Design a responsive web app that provides property buyers with information on properties of interest


Real estate investment is an increasingly popular way for individuals to achieve financial security. It is an exciting and emotional experience, but often complicated. While there are plenty of blogs and agencies providing information, often, buyers new to the market may struggle to get started without professional guidance and waste time viewing properties out of their range. This web app will provide them with the expertise needed to get started efficiently.


This project was presented with some of the UX research already done. I wanted to better understand the pain-points of users, not just their needs, to be able to address those concerns and design a product that could provide better service than competitors.


Perfect Properties* - Portfolio Project



Competitive Research
User Research - Surveys & Interviews
Site maps
Mental Models & Flows
Information Architecture
Usability Heuristics
Wireframes & Protoyping
Usability Testing
Preference Testing
Visual Design


Sketch, Photoshop, InVision, UsablityHub


1 Month

Understanding: The Competition

"Find Your Happy"

“We know what a home is really worth”

Feature Comparison


Understanding: The User

Surveying Previous Property Purchasers

Respondents : 20 
Age during purchase : 24 - 50

Most people in the survey purchased homes over 5 years ago, utilizing both websites & directly with agents to find properties. 72% viewed less than 10 properties, and managed to close within 6 months.



  • "The inability to move from one listing to the next without having to return to the initial results page."

  • "Some of the ads not having clear photos, or images that were deceptive. Omission of pictures of certain rooms."

  • "No floor plan or one which you can barely see. Floor plans which don’t show the extent of gardens. If you’re buying a house with a garden it’s kind of really important see actually how big it is."

  • "Floor plans don’t have a compass on them so you don’t know where the light is coming from into each room."

  • "Organizing viewings with different agents."

  • "Finding a place that meets the criteria you want."

  • "Comparing properties properly. Average price per sq ft, info about pricing over time in the area, costs of equivalent properties in surrounding neighbourhoods."

  • "When searching, to understand how much each 'feature' is generally worth in the area."

Mortgages & Finances

  • "The negotiations/financing."

  • "Worrying that the bank wouldn’t allow us to buy the property because they appraised it for much lower than the seller was selling it for"

  • "Rounding up all the financial information"

  • "Difficult to avoid budget-creep, i.e. paying more than you originally intended."


  • "Since it's mostly an agent driven process, it's more time consuming and you don't have full disclosure in the first go as owners don't want to get involved till you make an offer."

  • "The estate agents acted like they didn’t care as there were loads of buyers around. The agents had an attitude."

  • "Estate agents insisting on showing me places that I wasn't interested in."

The user persona and stories were provided for this project.


"As a user,

I want to create a profile containing all my property criteria, so that I am recommended results most relevant to me.

I want to be able to search and filter properties, so that I can find good matches based on my needs.

I want to be able to save or mark properties I am interested in, so that I can easily revisit them.

I want access to as much written and visual information as possible about properties I’m interested in, so that I can make an informed decision.

I want to be able to contact the right people if I am interested in viewing a property, so that I schedule a viewing.

I want to see how well a property meets my criteria or compares to other properties, so that I can refine my options."

Understanding: Mental Models & Journey

Generally the competing websites offer the same the services and features and do not address some of the pain points for users. As purchasing property is something most people do not do often, people tend to be quite inexperienced and trying to compare multiple properties and understand their value is a point of frustration.  Dealing with different agents can be frustrating if they don't meet expectations.



If it were magic, how would it work?

There are better solutions for users.  Perfect Properties can take aggregated data and rather than just show lists of filtered items, we can provide users with tailored suggestions to their needs.  The perfect property is perfect for different reasons.

Design Criteria

Requirements :
  • Sign in, create user profile, and input property criteria
  • Search and filter available properties
  • Access comprehensive information about a given property (e.g., specs, value, previous sales, location, 360° visuals, etc.) and its neighborhood
  • Bookmark a property listing
  • Property recommendations feature
  • Ability to contact real estate professional when wanting to move forward with a property (i.e., guided viewing, ready to invest)

Partial Branding Guidelines:

  • Key Messaging: “Finding the perfect property shouldn’t be hard”
  • Style: Clean, quick, smart; greens, blues, purples

Prototype & Testing


Sorting & Reviewing the Findings

Usability went well except for some copy needed clarification. Some icons were not clear as they were not standard to what users expected. Other issues concerned expectations of a fully developed app which were not present in the prototype.


Suggested Solutions

Cards changes - Cards were changed to provide info that would be more suited to what information a user could be looking for depending on the type of search.

Arrows were added on the sides to give clear indication that the images were swipeable, as well as pagination dots changed to numbers to indicate the number of photos.


Smart Search - Since the smart guide/search feature was not something that was common with other sites, users were not sure what it was.  They were expecting the first thing they would see is the option to do a general search.

"Search" is now the first page they would see.

"Our Guides" is now a "Smart Search"
Adding "I'm looking to" gives a clearer idea of what the feature offers.


Language and Other Updates:
- Search: Available > Results
- Sort function: Newest > Recently Added
- Chevron removed from filters button, added text under search to show what filters active.
- Additional filters added
- Filters page shows number of results as selection changes
- Some icons changed to be more common

Visual Language & Branding

Mood: Modern, clean, simplicity, natural




Animations & Interactions


Responsive Design


*Perfect Properties is an example project and is not affiliated or connected with any product

Thanks for reading!

Jack Kuzniar © 2021

Back to top Arrow