Unseasoned buyers need access to reliable, uncomplicated information about their potential property investments. While there are plenty of blogs and agencies providing information, buyers who are new to the market may struggle to get started without professional guidance and waste time viewing properties that don’t match their needs. Dream Properties aims to solve this problem by providing a user-friendly, responsive web app containing a wide range of available homes so that users can easily find the right fit.
UI Case Study
September 2021 - November 2021
Challenge
Solution
Users need a simple way to find homes to rent or buy and will need the option to do so across a variety of devices.
Dream Properties is a responsive web app that allows users to view listings in their desired area, helping them to find their perfect home with ease.
Tools Used
Adobe XD
Adobe Photoshop
Adobe Illustrator
Procreate
Dream Properties

The information about Rashida was given to me in the project brief, and I compiled the information to create my primary user persona.
User Persona
I created a user flow based on the information given to me in the project brief as well as the goals of my persona.
User Flow
Based on the determined user flow, I sketched out low-fidelity wireframes.
Wireframes
After planning and designing, I created final mockups of the concept for Dream Properties. These included responsive designs as well.
Final Mockups
Dream Properties was the first project I worked on that was only UI rather than a mix of both UI and UX. I found this to be a bit challenging, as I was going off of research I had no part in, but I think that learning how to create a product based on existing guidelines was valuable experience. I would love to have an opportunity to work on this further, taking a look at improvements that can be made through a UX lens, as well as working through adding more features.
Final Thoughts
Style Guide

Rashida Brown
Job Title
IT Consultant
Relationship Status
Married with 1 kid
Age
32
Location
San Diego, CA
Extrovert
Driven
Intelligent
Friendly
Motivations
Finances
Family
Information
Ease
About
Goals
Frustrations
“I’ve been considering buying property for a while and am looking for a tool that can quickly help me find what I’m looking for.”
Rashida is looking to move into a more permanent residence with her family. As a first time home buyer, she is hoping the process will be relatively stress free and straightforward. She and her family are hoping to find a house before their current lease is up.
Invest in property for increased financial security for her family
Find the right information for fast decision making
Find a tool to help her find the right properties so she doesn’t waste her time
Is very busy and doesn’t want to waste time looking at homes that don’t meet her criteria
Doesn’t want to be overwhelmed with the process
Doesn’t like when apps don’t provide a welcoming experience for new users/buyers
Open App
View Listing
Log In/
Sign Up
Enter Info
Sign Up
Log In
Home
Search
Filter
See Results
Search
“3 bed
2 bath”
Create
Account
No
No
Yes
Filter/
Sort

After putting my ideas down, I created mid-fidelity wireframes of my sketches to see a more accurate portrayal of the product. In doing so, I applied grids and took into account visual hierarchy, spacing requirements, and UI design patterns. These practices helped me construct a solid foundation to apply visual design principles to when creating the final screens.






Colors
#09161A
#E4F0F8
#42A7DD
#FFFFFF
Primary
Secondary
Neutral
Typography
Font Family
Aa
Quasimoda
Medium, 35px
Heading 1
SemiBold, 30px
Heading 2
SemiBold, 25px
Medium, 20px
Heading 3
Heading 4
Headings
Medium, 19px
Paragraph
Paragraph 1
Medium, 15px
Paragraph 2
SemiBold, 15px
Button
Button