Project Type
School | MUXD 5100: Foundations of UX Design | Group Project
Timeline
7 Weeks (03/12/2024 – 04/30/2024)
Role
Rapid Prototyping, Usability Testing, UX/UI Design
Deliverables
Summary
In this course, I worked with a team to design a hypothetical feature for a product of our choice. We chose Zillow rental listings, a familiar and relatable topic. While one teammate had conducted user interviews on Zillow in a previous course, I complemented this by analyzing online reviews and categorizing users’ pain points into themes. Using Teresa Torres' Continuous Discovery Framework, we first explored multiple possible solutions to achieve our desired outcome—increasing engagement rates for rental listings—before committing to designing a review feature for the listings.
With the goal defined, I began prototyping. Fortunately, Zillow’s existing brand guidelines were available online, allowing me to recreate foundational elements and components. Additionally, Zillow already had a review section for property management, though it was buried deep within the interface. This served as a valuable precedent for style and conventions, enabling me to build on existing patterns rather than starting from scratch.
Once the high-fidelity prototype was ready, we conducted usability testing with five participants. Observing their experiences—both moments of delight and areas of struggle—led us to implement two major iterations:
Overall, this project was an invaluable learning experience, taking us through the end-to-end process of designing a hypothetical feature. From research to prototyping and usability testing, it reinforced the iterative and collaborative nature of UX design.
Desk Research
Who are we Solving for?
Zillow serves a variety of users, which we divided into two main segments: primary and secondary. Its primary users include buyers—people seeking to purchase properties, renters—people seeking rentals, and casual lookers—individuals without intent to buy/rent but browsing listings out of curiosity or to stay informed about the real estate market. The secondary users consist of real estate professionals such as agents/brokers, property managers, landlords, lenders, builders, and local advertisers.
For our project, we focused on addressing the needs of one of the app's primary user segments—renters—by helping them gain confidence in making informed decisions. We will consider our objectives achieved if this user segment demonstrates increased trust in Zillow rental listings and proceeds with a rental decision.
Opportunity Solution Tree
From user research, we identified six major pain points:
For each of these pain points, we generated as many solutions as possible to address them. Eventually, we decided to focus on the first pain point, with the solution of creating a review section for rental properties.
Problem Statement
Developing an appropriate problem statement required careful thought. I consulted with the instructor to learn how to construct a statement centered around a key performance indicator (KPI). Ultimately, I decided to focus on engagement rates, specifically through increased inquiries and tours.
"Zillow’s mission is to help more people get home — with speed, certainty and ease.
We have observed that customers are struggling with gaining insights into properties from listings to make informed decisions, which is causing them to close the listings without any interaction.
Our goal is to enable users to leave reviews for rental properties, as this will ensure our customers are confident in their decision to use us based on improved engagement rates through increased inquiries and tours."
JTBDs & Assumptions
We identified several Jobs to Be Done (JTBDs) to understand how renters might use the review feature. Three notable JTBDs are:
While researching and designing the review feature for Zillow, we kept the following assumptions in mind:
Designing the Review Section
We built a pattern library for Zillow by following the atomic design framework and replicating the existing brand guidelines found online. I started with the smallest building blocks of a design interface—foundations such as typographic scales, color palettes, and elevation (atoms). From there, I moved to groups of UI elements like Property Cards, Review Cards, and Buttons (molecules & organisms), before diving into the feature design.
With an existing review function for property management on Zillow, I based our design on it but made necessary improvements. For example, the current review section displayed all reviews vertically, making the property listing even longer. I redesigned the review preview as a horizontal scroll, displaying only a few reviews at a time. Users can click "see more" to be directed to a full-screen page where they can sort and upvote/downvote reviews. This approach ensures the review section integrates seamlessly without being intrusive or cumbersome, helping to reduce cognitive load.
For the review form, I used the existing property management review form as a precedent. I closely followed its design but made adjustments for scalability. For instance, the original design had criteria and stars inline, which caused line breaks on smaller viewports. In my design, I separated the criteria and star ratings onto different lines, making the rating clearer and easier to scan while preventing line breaks. I also increased the spacing between text and sections to enhance readability and provide more breathing room.
As for rating criteria, we have temporarily settled on four: "Property Management," "Location," "Amenities," and "Cleanliness." However, these criteria require further research and consideration to ensure they are free from bias. For instance, it is important to avoid favoring upscale properties, as this could alienate a broader range of users or marginalize more affordable and diverse rental options.
Usability Testing
We conducted moderated usability testing with five users. The three tasks we tested were locating the review section on the property listing, browsing existing reviews, and submitting a review. Overall, the feature was well-received, and we received numerous compliments for integrating the review feature into Zillow, as if it had always been there.
All participants (5/5) were able to identify the starting point for reviews. They successfully navigated to read all the reviews and found the sorting options reasonable. Additionally, all participants found leaving reviews to be very easy and straightforward. However, a few issues were identified:
“Finding the review is fairly easy and intuitive.”
“It took a bit of scrolling to get there.”
“Location—what does it mean?”
Key Takeaways & Recommendations
From conducting the usability testing, we gathered the following key takeaways:
We developed two recommendations:
I quickly incorporated these changes into the prototype.
Lessons
Through this project — ranging from conducting desk research with a focus on the Opportunity Solution Tree, to crafting a problem statement centered around KPIs, to rapidly developing a clickable prototype for user testing, and finally iterating the design based on test feedback — I gained valuable insights into UX design.
Some of the key lessons I learned include:
The design process is inherently iterative and can often feel messy, requiring frequent movement between different stages of the process as needed.
As a final consideration, introducing a review section for rental listings raises ethical concerns, for example, its potential to contribute to gentrification. Reviews may amplify privileged perspectives, attracting higher-income tenants and driving up prices, which could displace long-time residents and reduce neighborhood diversity. Small business renters may also have little reviews compared to a big management and hence could be marginalized in search results. To address this, Zillow may consider creating review guidelines that encourage inclusivity, using algorithms to showcase a variety of perspectives, and adding features that help users make thoughtful, conscious choices.
Thank you for visiting!