Padsnagger Responsive Website

Project Overview

The product

An apartment search website designed to help users snag the apartment of their dreams. Aimed at anyone who needs to find the right apartment to rent.

Project duration

September, 2021

The problem

When users search for apartments, it’s often difficult to apply for one before it’s already taken.

The goal

To create a website that helps prospective apartment renters get the apartment they want before it’s taken.

My role

UX Designer

Responsibilities

User research, market research, wireframing, and prototyping


Understanding the User

 

User research: Summary

I interviewed four users (2 women, one man, and one non-binary individual from the ages of 20 to 75)  about their experiences with apartment shopping online and off line. Going in, I assumed that the biggest pain point was the application process. While that was, in fact, a pain point, an even bigger pain point seemed to be the inability to decide on an apartment before it was already taken.

 

User research: Pain points

Time to Choose

Users have a difficult time deciding to apply for an apartment before it is taken. The website I develop will have to find a way to give users more time.

Apartment Tours

Users can’t always tour apartments in-person, especially during pandemics or when they’re far away. So the site will have to have virtual tours offered for all listings.

Communication

Users can’t always contact the person who is leasing the apartment directly and that makes it difficult to ask questions. The site I design will have to give users the ability to directly contact the leaser.

Not Enough Information

Users can’t always find information about the apartment, its landlord, or its neighborhood and that makes it harder to make a decision. My site will have all of that information and reviews from previous tenants.

 

Persona: Kenneth Chen

Problem statement:

Kenneth Chen is a busy, 30 year old accountant who needs to find an apartment and apply for it all in one place online because they don’t have much time to visit different places.

Persona: Chloe Mandrapilias

Problem statement:

Chloe Mandrapilias is a 64 year old author and mother of two who needs to apply for apartments quickly because the apartments she wants are often taken before she can apply.

 

User journey maps

Kenneth wants to research all information and talk to landlords online in order to apply for an apartment within their own schedule.

Chloe wants to read reviews of landlords and apartments in order to be able to choose the best apartment quickly.


Starting the Design

 

Sitemap

The goal is to create a site that gives users the ability to search for apartments, look at information about specific listings, apply for a listing and hold a listing for a 24 hour period.

 

Paper wireframes

I wanted to make sure that there was a search bar on every page and enough information without making the navigation difficult.

Paper wireframes: Size variations

For each main page of the website, I designed a desktop version, a tablet version and a mobile version for responsiveness.

 

Digital wireframes

Users wanted the ability to tour a listing from home and they wanted more time to apply for apartments before they were gone. So I made sure to include a button for a 3D tour and a button to hold the apartment for up to 24 hours on the listing page.

Digital wireframes: Screen size variations

I designed an iPad Pro and iPhone 11 Pro version for each main page of the website to make it responsive. I made sure to have a full nav menu for the desktop version but a hamburger menu for the alternate sizes.

 

Low-fidelity prototypes

Desktop Prototype: Link

iPad Prototype: Link

iPhone Prototype: Link

 

Usability study: Parameters

Study type:

Moderated usability study

Participants:

5 participants

Location:

United States, remote

Length:

20-30 minutes

Usability study: Findings

Users had difficulty getting to an apartment listing and finding the button to hold a listing.

Trouble clicking on apartment listing

3 out of 5 users had difficulty finding where to click to get to a listing page.

Can’t find Hold button

All users had difficulty finding the Hold button and holding an apartment for 24 hours.

Place Hold and Apply button on top of page

4 out of 5 users suggested placing the Hold and Apply buttons at the top of the page.


Refining the Design

 

Mockups

Users had difficulty finding how to Hold and Apply to a listing. So I moved the buttons to the top of the listing page with Call to Action text. And next to the listing title.

Users wanted more information on the home page, including price under the listings. So I added that to the Home Page, alongside a value statement  at the top of the page about Holding the listings.

Mockups: Original screen size

Mockups: Screen size variations

 

High-fidelity prototypes

Desktop: Link

iPad 10.5: Link

iPhone 12: Link

 

Accessibility considerations

Accessible for Screen Readers. I made sure to add headings for important information and designed a hierarchical structure for each page.

High contrast coloration across page designs for color-blind individuals.

Logos and images as well as text to make understanding user flow easier for ESL individuals.


Going Forward

 

Takeaways

Impact:

A study participant noted that it would be incredibly helpful to be able to reserve an apartment for a day if they don’t have time to apply right away, especially in a hot rental market where apartments are snatched in minutes. So this website would help give users like that more confidence in their apartment search.

What I learned:

I learned a lot from competitors in the apartment search space and from study participants about the difficulties of searching for and applying for apartments. This website is just one more step toward making apartment searching easier. I also learned how to use Adobe XD as a UX Design tool.

 

Next Steps

Create more pages for alternate user flows, including filter toggling.

Conduct another usability study to make sure my build and alternate user flows remain simple and easy to understand.

Use what I learn from the usability study to create a final iteration of a complete responsive website for apartment searching.


 Let’s Connect!

Thank you for your time reviewing my work on the PadSnagger Apartment Search website! If you’d like to see more or get in touch, my contact information is provided below. 

Email: jeanniestivers7@gmail.com

Contact me