PROJECT OVERVIEW
INTRODUCTION
I designed this responsive website as a part of the Google x Coursera UX Design Professional Certificate program. It is intended to allow users to easily search for apartments to rent, as well as get insights about their search area neighborhoods.
Themes
UX Research
UX Design
User Testing
Prototyping
Role
Sole UX Designer
Tools
Adobe XD
Timeline
3 Weeks
THE CHALLENGE
With so many options out there for searching for apartments, the task can be overwhelming. Common frustrations include lack of floor plans, scattered information, confusing navigation, and long processes around booking tours and contacting the appropriate point of contact.
Frustrations get deeper for users who are new to an area, or who are searching from out of town. Even though location is perhaps the most important amenity that apartment hunters are looking for, most search sites don't incorporate neighborhood information into the process.
RESEARCH
WHO ARE THE USERS AND WHAT DO THEY WANT?
In defining target users, I interviewed six people--aged 25-38--who had previously used a website to search for apartments to rent. As a result, two distinct user personas emerged.
Trey Domingo
24 years old
Lives in NYC
Just hired as an accountant
“As a busy college grad and new worker, I need an apartment search website that lets me quickly find apartments within my price point and that give all the information in one place so that I can start this new chapter off on the right foot."
Trey recently graduated from college and secured his first full time job as an accountant at a large firm in NYC. He’s now ready to find his first apartment to rent, but there are so many options in the city. Being an accountant, he knows exactly what his budget is, but is flexible on location and amenities. He needs an apartment finding website that lets him explore different options at his price point, with all the most up to date details all in one place.
Zoe Parker
30 years old
Lives in Boise, ID
Veterinarian
“As a transplant looking for a new housing, I need an apartment search platform that allows me to virtually tour and learn more about different neighborhoods so that I can make the most informed decision for me and my family."
Zoe is a passionate veterinarian and mother to 2 dogs. After her husband was offered a new position in Chicago, she needs to find a new apartment for them to rent from their current home in Boise. She doesn’t know much about where to live in Chicago, and can’t tour anything in person before they need to move. So she needs a site that integrates maps and neighborhood information, as well as detailed floor plans and virtual touring.
COMPETITOR AUDIT
I targeted the below three direct and indirect competitors to create a competitive audit. These three companies have web and mobile applications, are well-regarded, and were mentioned by name when talking with target users about what current platforms they use when searching for apartments to rent.
Strengths:
-
Step-by-step setup
-
Allows specific filters
-
Built-in map feature while browsing
Weaknesses:
-
Must give email address to see matches
-
Auto-separates properties by category
-
No neighborhood guides
Strengths:
-
Includes a tips and advice column
-
Grid view vs map view
Weaknesses:
-
Takes too many clicks to see details (no overlaid information on map)
Strengths:
-
Sleek, modern design
-
Property ratings with reviews
-
Key property information is overlaid on interactive map
Weaknesses:
-
Caters to short-term vs. long-term rentals
DESIGN PROCESS
INITIAL DESIGNS - WEBSITE
After defining my target users, identifying main competitors, and sketching out several potential designs, I began wireframing the designs the users expressed as being the most useful.
Home Screen
Design inspiration for the home page came mostly from Airbnb's intuitive design. Based on user insight upfront, I knew an interactive map had to be included, along with "property cards" with key property information along the side and overlaid on the map as users clicked around at available pin points.
Users can easily save properties to their "Favorites" by clicking or tapping a "heart" icon, and can then quickly tab between their saved favorites and available properties, based on their filters.
"Learn" Pages
To cater to target users who search for apartments in a city they don't know much about, I created a separate "Learn" page with a range of city options. When users select a city, another page can pop up to show key city information, inclding details about different neighborhoods.
This page can be built out to include a blog with tips and tricks on moving, budgeting information, and other resources for first-time renters and renters moving to a new city.
Property Descriptions and Tour-Booking Pages
When users select a property they're interested in, they are taken to a product description page, which lists more details about the property, and allows them to continue the user flow to book a tour, view floor plans, virtually tour the apartment, share the property with a friend, submit an application, and contact the property manager.
When selecting a tour time, a pop-up activates to allow users to select available touring times to best fit their schedule while giving them control. After submitting, another pop-up activates to show confirmation details.
INITIAL DESIGNS - MOBILE
I created a seamless responsive layout for mobile phone users, which are a majority of this particular products' target users.
Home Screen
On mobile, I prioritized the map, since target users cared most about seeing the location of each property. Users can pinch and drag the map to zoom and move. Interactive pins are tap-able and can be saved instantly, like on the website. Tapping on each property takes users to a detailed property screen, and a list view can be accessed by dragging the bottom overlay screen up.
"Learn" Screen
The mobile version of this page is similar to the website. I decided to show all information on one screen, instead of linking each city to another screen. The city "cards" are tap-able and the information below auto-populates depending on which city is selected.
USER TESTING
I shared the low fidelity prototype with some users from the original group of target users from the research stage to get feedback before creating the final designs. Overall feedback was positive, and everyone could complete the task of selecting a property and booking a tour. But small adjustments were made to several pages that included a way to see more photos on the property description page, and a way to quickly add booked tours to calendars. After several iterations with this group, I continued on to the final mockup and high fidelity prototype.
