Happy
Home
Happy Home is an online real estate marketplace company in which users can find and buy/rent apartments from agents or directly from apartment owners. Is elegant, easy, and intuitive.
The Problem
Some real estate websites don't give enough information or photos about the apartment, and there is no option in which users can check how far is that apartment from a specific place (Itinerary).
The Goal
The goal of Happy Home is to give the user a pleasant experience while exploring apartments.
My Role
UX Designer leading the Happy Home website.
Responsibilities
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs and responsive designs.
Project duration
November 2021
Empathize
Summary
I started the user research by conducting interviews with people who have used at least one time real-estate websites. I interviewed students and grownups. Even though their goals were different, they experienced the same problems, such as lack of information, insufficient number of photos, and difficulty contacting the seller. After creating an empathy map of each interviewee, I summarized their point of view and created two personas. One was described as a university student, the other one as a doctor.
Empathy maps
![Google UX Design Certificate - Empathy Map [Template] (1).png](https://static.wixstatic.com/media/3ca09d_29e87749835249aa91704c07e15ab92d~mv2.png/v1/fill/w_236,h_236,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Google%20UX%20Design%20Certificate%20-%20Empathy%20Map%20%5BTemplate%5D%20(1).png)
![Google UX Design Certificate - Empathy Map [Template] (2).png](https://static.wixstatic.com/media/3ca09d_fbaa1cad314e450d88cf2dc32980d20b~mv2.png/v1/fill/w_238,h_236,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Google%20UX%20Design%20Certificate%20-%20Empathy%20Map%20%5BTemplate%5D%20(2).png)
![Google UX Design Certificate - Empathy Map [Template].png](https://static.wixstatic.com/media/3ca09d_e3a8a8ac9ec744c98fdaff81a2038ea3~mv2.png/v1/fill/w_236,h_236,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Google%20UX%20Design%20Certificate%20-%20Empathy%20Map%20%5BTemplate%5D.png)
Personas
![Persona [Website for finding apartments] (1).png](https://static.wixstatic.com/media/3ca09d_4ad4015764644b2db2cbcbbdd308a53f~mv2.png/v1/fill/w_394,h_211,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Persona%20%5BWebsite%20for%20finding%20apartments%5D%20(1).png)
![Persona [Website for finding apartments].png](https://static.wixstatic.com/media/3ca09d_ebccfac8e0174048a3060658bdea3ba1~mv2.png/v1/fill/w_398,h_215,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/Persona%20%5BWebsite%20for%20finding%20apartments%5D.png)
Rosanna is a doctor who needs additional and better information about the apartment because she wants maximum guaranty on the quality of the place.
Pietro is a physic student who needs an easy and efficient way to buy/rent apartments because he wasn't satisfied with his latest researches.
Lastly, I created a user journey of both personas...
![User Journey Map [Website for finding apartments].png](https://static.wixstatic.com/media/3ca09d_d661f0cb4a614796adfaf5984bdd8423~mv2.png/v1/fill/w_580,h_317,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/User%20Journey%20Map%20%5BWebsite%20for%20finding%20apartments%5D.png)
...and suggested solutions or improvements that would make each step easy and enjoyable.
Ideate
Sitemap
I created a sitemap that gives all kinds of information and options for the users, so that their journey on the website would end up successfully.
Paper wireframes
Before creating digital wireframes, I kept in mind what were the main points underlined by each persona. After drawing some paper wireframes for the homepage, I chose what looked the best and designed similar styles for the other wireframes.
Digital wireframes
Mockups
Usability study
Study type
Moderated usability study
Location
Rome, Italy
In person
Participants
4 participants
Lenght
10 minutes
Usability study: findings
The usability study was a success. All of the users were satisfied with the flow and the simplicity of the website :-D The only problem encountered is that after arriving at a certain wireframe, some users had difficulty understanding that they could scroll down. To solve the problem, I created a dark green frame and put an arrow facing down at the bottom right of the corner. This adjustment can help users understand that they can scroll down to have more information about the apartment.
Before usability study...
...after usability study
Accessibility considerations
- When a text is placed above a color, I used the contrast checker to prevent accessibility problems.
- All the cta-buttons have the same typography and color.
Thoughts
Impact
Users have said that the website has a great design with lots of information and is easy and intuitive to navigate.
What I learned
Usability studies are always the most useful part of the job because the users always give the best pieces of advice on how to improve the product.
Next step
My next step would be to publish the work and periodically check the user reviews to see if there is something that the clients are frustrated with.