Your Home – Real Estate Cross Platform

Your is a cross-platforms design for a web app which can be deployed as a market store app or browsed through internet.

“Your” is a project focused on the way users do house-hunt online. The idea shaped during the Covid-19 pandemic. I was starting my User Experience Nanodegree, therefore I decided to investigate the Real Estate portals’ world, seeking for pain points and new opportunities to deliver a user-tailored experience
Users often don’t know about the place where they need to relocate. Furthermore, sometime the solution must be found remotely.

Duration: 27th April – 19th May 2020


Your is a end to end project and it covers all the aspects of a User Experience and Interface case study:

  • Identification of the problem to investigate.
  • Competitive analysis.
  • User researches for qualitative and quantitative data (interviews, surveys and personas).
  • Synthesis of the collected data (affinity maps, feature ideation, feature prioritization).
  • Sketches, sketches, sketches.
  • Workflow and Lo- fidelity prototype, iterate.
  • Style guide, design library, and accessibility standards.
  • Hi-fidelity prototype.
  • Usability test and iterate.

Design process

Design process

Understanding user needs

User persona

Persona archetype for Real estate case study

Semi-structured interviews

I recruited 4 participants for semi-structured interview sessions. I then organized the datas in a Miro whiteboard with affinity diagrams.

To read the notes please visit the Miro Whiteboard

Survey to collect quantitative data

The next step was to run a survey to validate or not the qualitative datas collected with the semi-structured interview. It was shared within targeted users living in 3 different countries, therefore adopting different portals for their house hunting sessions.

Key findings from researches

«I never found services like post offices, supermarkets, pharmacies in the map or in the advertisement, I had always to leave the website and look at them by myself».

Participant 2
  1. Users declare they prefer a Pc to look for a new house, but they use more often the smartphone, even when they are at home.
  2. Surprisingly, the price of the house is important but is not the priority number 1.
  3. 3 participants of 4 admitted that their number one priority is the position of the house.
  4. 3 participant of 4 admitted that the presence of nearby services of a potential house is important or very important.
Findings from survey


Competitive analysis

Focused on the features used for the actual research moment and on the most important portals of Switzerland (, Italy ( and USA (

Competitive analysis (features)Map divided in clickable zonesDraw the perimeter on the mapPrices on mapNearby services on map
Homegate (Switzerland)YesNoNoNo
Immobiliare .it (Italy)YesYesNoNo
Zillow(USA)NoNoNoOnly schools
Competitive analysis for features


Feature ideation and prioritisation

Through the Synthesis of the datas I ideate the following features:

  • Add “Nearby services” in filters;
  • landing in a map view and
  • show the prices on the map;
  • switch to a List view;
  • show desired nearby services on a map when selected in filters;
  • favourites;
  • notification;
  • on site notifications;
  • account needed for on site notification and to publish advertisements.

For the feature prioritization I collaborated with an experienced software developer and engineer. Thanks again!

It ended up that the Key features, challenging and strategic to implement are:

– the switch between the Map and List view;

  • receive notification;
  • favourites.
  • GPS- on site notification, for which I had to strive a bit, since it is very difficult to implement but actually feasible and strategic.

Easier to implement, therefore less strategic but also fundamentals features are:

  • Main Filters
  • Prices on Map
  • Additional filters;
  • Services on map.

Important decisions

During this stage:

  • I categorized the main filters and the additional filters. The main filters are displayed on the Landing / Homepage and their function is to narrow down the research to a primary scope;
  • User arrive to a Map view of results with interactive price tags, so that the price and position priorities are conjunted in a single view. Of course has the opportunity to switch to a classic List view at any time if wished;
  • I abandoned the idea to divide the map in zones because I realized that is either a too exclusive either a too inclusive action for the users to take: if they know already where, what is the point? If they know already where, how does it help? Does the user know if the locations at the border or just outside the border will be considered? Does a particular user need this consideration or not? What is the benefit at the end? Those and more were all the questions that brought me to the conclusion that the division in zones is fancy but not so useful and that a single interactive map tailors the research to the user needs.


During the sketch stage I also started to think about a logic workflow for the users to use the app/website.

The flow I am going to illustrate here is

The journey that the users do from the beginning of the research until the moment they will contact or not the advertiser.

It is not shown the entire asset of the platform fuctionalities.

Flow from the beginning of the house hunt until the contact with the advertiser.



With this good quantity of datas I finally started to sketch, I am happy to share with you some of sketches, which are representative of different sketch phases: from the very first until the more defined ones.

Sketches on different stages of ideation. You can also find them on the Whiteboard.

Low-fidelity wireframes

Finally it was time to bring the best ideas developed during the sketch phase in the digital world. After the first iteration, I tested the interactions and resulted that was difficult for the users to identify the List/Map View and Filters buttons on the first flow. Therefore it was needed to iterate with a second version that you can see below.

Design patterns, style guide and accessibility

Finally, I transformed the Low Fidelity prototype in the first High Fidelity prototype.

The Design Patterns I selected are very common and usual to the users. The design is kept to the functionalities without forgetting desiderability in the graphic design.

As usual, I dedicated special attention to color accessibility before to set my color palette. AAA is the goal!

Color contrast ratio in color palette scores AAA on all combinations.

Time to iterate

To have a more complete idea on the usability of the flow before to run a usability test, at this stage I added:

  • the “Nearby services feature” in the filters view;
  • the “Advertisement details page” with all the related house information, the new added Nearby services on map, and advertiser’s contact info and contact form on pop-up, accessible with a floating button.
Detail of the section of the filters where the nearby services were added


Usability testing

Using Look Back I recruited participants to test the prototype,.


  • 40% of participants did not tap on the Price chips on the map to interact with them although asked to interact with the map.

I observed users were unable to find the call to action on the map and on the filters because they didn’t look clickable.

Time to iterate

According to my observations, I added a shadow effect also on the prices on the map containers, that took the tooltip shape.

High-fidelity wireframes



Design tools