REDIFIN REDESIGN
Product Design | UX Research | Information Architecture | UI Design | Prototyping
This project was made between September 2015 to December 2015. I redesigned the Redfin’s website by reorganizing the information architecture and completing three key interfaces.
Redfin is a residential real estate company that provides web-based real estate database and brokerage services. This redesign project is focusing on reorganizing information architecture, enhancing the functionality of the product which help users get the accurate information conveniently and intuitively when they are seeking their dream houses.
Current Problems
I love to check house price daily, and like visiting open houses to know how other people decorated their houses. When I travel to a new city, I’d love to search real estate price in that city as well. I began to use Redfin since 2013 for all these real estate related needs, and it becomes one of my frequently using products.
Before doing anything, I interviewed 28 friends in San Francisco Bay Area. Some of them had already owned 1 or 2 houses. And some of them had a plan to buy a house within 1 year. In the interviews, I gave them 1 to 2 tasks, and I watched their process and took notes about where they feel confusing and where they get stuck.
During those interviews, I found out the “location”, “house price”, “amenities” are the top 3 factors for users to consider. And men were more care about location, and women cared more about amenities and house appearance. Then I listed some common pain points below:
- Users feel hard to check the amenities information about the area in which they want to buy a house.
- Users have to scroll the page to the middle to find more detailed payment information.
- Users use browser‘s back arrow to go back, but they can’t go back to specific previous step.
- After using the filter function, they have to move their eyes from top left to the right area, especially when they open the Redfin on the iMac.
- The information architecture in the house detail page is very disorganized. For example, “Upcoming Open Houses” and “Schedule Tour” are far from each other.
Design Process
01. Redfin Heuristic Evaluation
First, I ran a heuristic evaluation on Redfin’s 3 key pages “Landing page”, “Houses listing page”, and “House detail page”. Then I accumulated some UX design problems.
02. Redfin User Demographics Research
After understanding the current pain points from the user and accumulating the design problems, I began to redesign Redfin website from understanding who are the target users including their education background, their ages, their household income, etc. To get this information, I searched some data from the internet and read some reports and surveys from Redfin.
03. Target Audience
From the user demographics research above, I listed out both primary and secondary target audiences.
04. Personas, Use Case & Tasks
After analyzed the responses that I collected and grouped from the interview participants, I found they have some common pain points and similar behaviors. So I used the results from the interview participants’ personal experience to create these 3 personas, and gave each persona some use cases and tasks.
05. Design Solutions
Through interviewing 28 participates, I got their pain points when they use Redfin website. After I used heuristic evaluation method to evaluate 3 key interfaces, I accumulated some design problems. And in the personas, I understood their needs and goals. Then I listed some design solutions to solve the problems:
- I will add “Explore this area” function on the map for users to check “Crime, School, Commute, Amenities, Affordability, Demographics, and Hazards” on the map. This inspiration is coming from Trulia.com during doing the competitor analysis.
- All the payments information needs to be reorganized, and the monthly payment composition should be visualized to make user easy to check.
- Adding “Breadcrumb Trail” function on the pages to make users be able to go back to the pervious or any specific step.
- Moving “filter” function close to the house listing results, and reorganizing all the contents in the filter to the appropriate groups.
- Reorganizing all the information in the house detail page to arrange them into appropriate sections, and making each section can be expanded or retracted to shorten the page.
06. Sketches
07. Wireframes
Landing Page Design
Enhancing the search function to enable multiple search by adding advanced search function that contains price, lot size, bedrooms, bathrooms, parking, and keywords. So that it helps users to narrow down the searching results and their dream house ASAP.
Listing Page Design
Houses can be listed in two different views, so users can check houses on the map or in the list. Adding some new functions on the map to make it more functional and convenient. And also, changing filters layout, and making users be able to go back to the pervious or any specific step.
House Details Page Design
According to the research, location, price and amenities are the most important factors when users are finding their houses. So I rearranged the information architecture by changing the layout of this page and adding some new functions to make this page more functional, more convenient, and more clearer than before.
