Soft Textured Gradient Background
Black Shadow Element
Dark Phone Blur Shadow
Black Shadow Element

Wealth ​Estate

WebApp

Overview

Please note that this is a case study, and it includes the objectives and UX ​research that were delivered as part of the project.​


The following responsive web app is a comprehensive platform for users​ who are looking to invest in properties.


The primary objective of the platform is to provide a user-friendly interface​ that allows users to search for properties based on their preferences and​ compare them side-by-side to make an informed investment decision.​


The platform will enable users to search for properties based on various​ criteria, such as location, property type, price range, and other specific​ features like the number of bedrooms, bathrooms, or the property's square​ footage. The search results will be displayed in a clear and concise manner,​ making it easy for users to browse and compare different properties.​


To help users make informed investment decisions, the platform will provide​ comprehensive property information, including property history, estimated​ value, and other relevant data. Users can also save their favorite properties​ and compare them side-by-side using a comparison tool, allowing them to​ identify the pros and cons of each property.​


Overall, the proposed web app provides a one-stop-shop for users looking​ to invest in properties, with a range of features and tools designed to help​ them make informed decisions.​

Role

UI Designer

UX Designer

Duration

February - ​March 2023

Tools

Figma

C​anva

wh​at

A responsive web app containing a ​database of properties and ​comprehensive information on each ​listing.

Wh​en

Buyers will use this tool when ​conducting property searches, and ​making a decision about where to ​invest.

Context

Wh​ere

Buyers will use this tool anytime, anywhere.

Wh​o

This web app is primarily designed for users ​who are seeking to find the best property ​investment options based on their ​personal preferences.

Why

Buyers need access to reliable, ​uncomplicated information about their ​potential property before spending time on-​site.

Soft Textured Gradient Background

Pe​rsona

"I may be busy, but I never let that stop ​me from achieving my goals. With the ​right tools and determination, anything is ​possible." - Rashida

Meet Rashida,

a 42-year-old female IT consultant who is constantly on the go. Rashida holds a Bachelor's degree in Computer Science and a Master's degree in Advanced ​Computer Systems. She is married and has two children.

As a busy working mother, Rashida values her time and is always looking for ways to increase her family's financial security. She is interested in investing in ​properties outside the city, but finding the right property can be time-consuming and overwhelming.

Rashida is tech-savvy and relies heavily on technology to help her manage her busy schedule. She frequently takes calls while driving and is a master of ​multitasking.

Her primary goal is to find the right information quickly, so she can make informed decisions about property investments. Rashida wants to use a tool that can ​help her easily find the right properties based on her personal preferences, so she does not waste her time on properties that do not meet her needs.

In summary, Rashida is a busy IT consultant who values her time and wants to invest in properties for her family's financial security. She needs a fast and ​efficient way to find the right information and properties based on her personal preferences.

User Flows

The user flows guide the user from an entry ​point through a set of steps towards successful ​outcome and final action.

Flow 1:

User can create a profile

Flow 2:​

User can choose their property cri​teria.

Flow 3:​

User can search and filter properties, so ​that they can find good matches based on ​their needs.

Flow 4:​

User can save or mark properties they are ​intersted in, so that they can easily revisit ​them.

Flow 5:​

User can mark to compare properties.​

Flow 1

Flow 3

Flow 5

Flow 2

Flow 4

Moodboard

It features a blend of earthy and clean tones, ​as well as purple and blue hues. The warm, ​natural earthy tones would evoke a sense of ​stability and reliability, while the luxurious ​purple hues would add a touch of elegance ​and sophistication. The blue tones would ​create a feeling of trust and dependability, ​giving potential investors the confidence to ​make informed decisions.


The images showcase beautiful homes and ​properties surrounded by natural scenery such ​as forests, mountains, and lakes, highlighting ​the lifestyle aspect of property investment.


The typography would be simple and clean, with ​bold headings and subheadings drawing ​attention to the main message. The use of ​simple geometric shapes would give the ​moodboard a modern and minimalistic look ​while conveying a sense of stability and ​structure.

You are not buying a house you are buying a lifestyle

Buy. Rent. Earn.

Five Homes Logo, House logo template
Beautiful white barn-style house. 3d visualization of a house with a terrace

Style Guide

Colors

Primary

Secondary

Light gray scale

Primary colors are used for actions

Secondary colors are used for display


For Dark UI Icons will be displayed in white and vise versa

Dark gray scale

Lato for Titles

Verdana for Body

Lo​go

77x48px

primary and secondary color in linear coloring

Icons

24x24px

in a 48x48px rectangle

Images to use:

clean, no faces, more about wealth beauty, money, ​growth

Images not to use:

pictures that are too chaotic, and not clean, people ​looked placed in a weird way.

Toy Houses on a Table
Man and Pregnant Woman Standing in Front of Man in Gray Jacket
Black Flat Screen Tv Mounted on Wall
PROPERTY CONCEPT
Soft Textured Gradient Background

Wireframes

UI Elements

Dropd​own list

Search fi​eld

In​put field

Co​unter

Pr​imary Button

Lo​gin with Button

Ca​rd

Ch​ip location

Chip to​ggle

Ch​ip tag

So​cial Buttons

Social Ic​ons

Menu

Responsive Design

Home

Comparing Property

Property Details

Mockups

Clickable Prototype

Prototype in Figma follow this Link:


https://www.figma.com/proto/PRX3CskcAOxni6FVNlvoqs/Perfect-​Properties-Dark-mode?node-id=275-42099&scaling=scale-​down&page-id=275%3A42087&starting-point-node-​id=275%3A42099&show-proto-sidebar=1

Soft Textured Gradient Background

Takeaways

I would like to express my gratitude for the opportunity to delve deeper into UI ​design and to develop my skills in this area. Through this experience, I have ​come to realize the importance of organization in managing ideas, designs, and ​the final outcomes.


The entire process, from the initial ideation to the final results, has been a ​rewarding journey. Watching ideas transform and become more aesthetically ​pleasing as my UI skills developed was truly fulfilling. It has also become evident ​that mastery of the right tools is essential to bring ideas to fruition.


Moving forward, I intend to invest more time into exploring color schemes and ​refining my understanding of how fonts complement each other.


Once again, I appreciate your time in reviewing my portfolio.


Cheers,

Tsantsou