Zizi
Role
Conducting interviews, digital wireframing, and low and high-fidelity prototyping. Conducting usability studies, iterating on designs and responsive design.
Tools
-
Adobe XD
-
Adobe Photoshop
Purpose
Training Project
Duration
6 weeks- Aug 2022
Project overview
Zizi real estate is a website that offers services like buying a home, rent a home, sell and finance a home
Project Goal
The project aims to design a responsive website for Zizi mobile application for users who prefer to use the Zizi desktop PC version with the same features as the mobile version.
Target Audience
Zizi's mostly target audience is all people who need to rent a home, buy a home, sell a home, or looking to finance a home.
Key Challenge or Constraints
The key challenge of the project was to make sure that the search result is accurate and within the range of the selection area.
Usability Study Parameters
-
Study Type: Unmoderated
-
Location: Europe
-
Participants: 4
-
Length: 30-40 minutes
Findings:
-
Users weren't able to find a suitable house to rent or buy
-
Creating an account/ login process is time-consuming
-
Users were unable to compare different houses that appeared in the search result
Research Study Details
I conducted user interviews, then turned them into empathy maps to better understand target users and their needs. I discovered many users have trouble finding a suitable home to rent or buy. Because other online real estate has limited options in their filter area, so users need to struggle with search results and try to manage an appointment to visit home. Some of the homes were rented or sold but still appear in the search results which makes finding the home process very confusing, boring, and time-consuming.
Persona
.jpg)
Persona
Affinity Diagram
Confusion
Getting Started
Findings:
-
Users can't compare houses with each other
-
Users can't specify house types in more detail
-
Users want to save a house for check later
-
Users want to use their social media accounts to log in
Insight Identification
Findings:
-
Users need a feature to save houses
-
Users need more features in search filters
-
Redesign and apply other login possibilities for users
Competitive Audit
An audit of a few competitors' products provided direction on gaps and opportunities to address with the Zizi web.
User Journey Map
The user journey map was created based on persona, a real estate consultant who needs to update to stay in the market
.jpg)
Design Process
Sketch:
I sketched 8 different wireframes on the paper, from each sketch I choose the best part and the final version is made up of these parts.
Final Sketch
Digital Wireframes:
Moving from paper to digital wireframe revealed what is the user pain points and how to improve the design to eliminate user pain points.
Low-Fidelity Prototype:
To create a low-fidelity prototype, I connected all of the screens involved in the primary user flow. At this point, I received feedback on my designs from participants about the color and size of the buttons, page organization, and visual effects used in the design. I decided to implement those feedback to address user pain points.
Mockups:
Based on the insights from the usability study, I made changes to improve the site’s search option. By adding some filters the result of the search has been limited to the houses that match the applied filters.
Before usability study
After usability study
Additional design changes included an option that allows users to bookmark a property that finds in a search to check out later or compare with other properties.
High-Fidelity Prototype:
The high-fidelity prototype followed the same user flow as the low-fidelity prototype, including design changes made after the usability study.
Accessibility Considirations
-
Using headings with different-sized text for a clear visual hierarchy
-
Using landmarks to make user navigation easy
Site Map
My goal here was to make strategic information architecture that would improve overall website navigation.
Final Design
Some final design screens are shared below
User Testing
The app was tested with 5 participants. They asked to do some tasks as below:
-
Log in to the web using their social media accounts
-
Search for a property using the web's search bar
-
Bookmark any property
-
Change search filters
-
Try another search to understand if results are different
Results:
All participants complete tasks without any problem, however, the speed of completing tasks between participants is different. Also, they shared that they have a good feeling after completing tasks successfully.
Conclusion
Impact:
What I learned:
I learned that even a small change in the design can make big difference in the result. So before changing anything its better to study the new change and its effect on the result.
Next Steps:
-
Conduct follow-up usability testing on the new website
-
Identify any additional areas of need and ideate on new features