uX /UI Case Study

overview

Snap home is a mobile platform that helps users to enjoy a vacation at their favorite places like Home. This platform allows people to book a rental home, choose their desired location, and find the ideal accommodation for vacation time.

user research

We need to understand the users' behaviors ,needs, preferences, and pain points of target users. Conducting user interviews, surveys, and usability tests to help us gather valuable insights

design System :

best practices you I follow to create a design system for a rental accommodation app:

MVP:

Next, we created a Minimum Viable Product for the booking. This MVP includes the simplest core feature of what we were going to build eventually. We used this version of MVP for usability testing so as to gain valuable comments from potential users which may help us improve the features and interfaces of the final product.

Usability Testing

we need to validate our design decisions by testing app with real users and collecting feedback. This will help us identify areas of improvement and optimize the user experience.

What i learn

Designing a rental accommodation app need to learn how to design for specific user needs, create an intuitive layout, optimize for mobile, manage user data securely, and iterate based on user feedback.



desin process

dicover

Define

Test

Ideate

design

Wireframe prototype

High-fidelity prototype

Interaction Design

HMW Statements

Ideation

Sketching

User flow


Empathy Mapping

User Personas

Journey Mapping

Opportuntiy statement

Design strategy

User interviews

Questioner

Competitors analyzing

User needs and pain point

We design user survey with google form to know about user needs:

empathy mapping

user persona

user journey

What is your preferred Payment?

Says

Does

Thinks

Feels

i realy need a break

let’s a plan family vacation

where should we go?

should we book a hotel roomor vacation rental?

ido i spend time with family?

should i plan a vacation with family?

where we go?

how much leave should i take?

tired with ofice work

stressed

vacation mood

boared with daily routine

checks bookin apps

online trip planner

ask to family and friend

plannin leave

179C85

rgba(23, 156, 133, 1)

primary

9C2117

secondary

031411

text

dark

rgba(3, 20, 17, 1)

+

0E9283

0E9283

rgba(14, 146, 131, 1)

rgba(14, 146, 131, 1)

Green-Blue

Green-Blue

background

0E9283

FFFFFF

rgba(14, 146, 131, 1)

rgba(255, 255, 255, 1)


Green-Blue

main-white

main colors

rE

500

tints & shades

Our Home

Where is your destination

holiday list

find holiday homes that match you

Most visited

Home

Favorite

Trips

Profile

Home

Favorite

Trips

Profile

2 Bedroom, 5 Guests

$ 800,00

Forest Cottage

Ramsar, Mazandaran

Self check-in

Facilities

Forest Cottage hosted by Hamid

Check yourself in with the key safe.

Wi-Fi

TV

1 Bathroom

2 Parking

Kitchen

Air-Condition

2 Bedroom

Dates

Guests

Continue

The cottage has 3 bedrooms plus a balcony for a peaceful

morning Breakfast. The master bedroom with a king bed, the second

room has a queen bed and 1 single beds.

In total, we can accommodate up to 5 guests.

Bed linen, towels and cleaning are included in our nightly rate.

Please no smoking inside, or candles.

Please familiarise yourself with our postponement & cancellation

terms and conditions before booking.

Home

Favorite

Trips

Profile

Forest Cottage

Ramsar, Mazandaran

$3,200.00

$3,200.00

$0.00

hosted by Hamid

Dates

Your trip

Price details

20 May-24 May 2022

4 Adults

Guests

Edit

Edit

$ 800,00 x 4 nights

GST

Confirm and pay

Payment

Total

Our Home

Where is your destination

Dasht-e Kavir

Kavire Markazi

Rig-e Jenn

Semnan

Varzaneh Desert

Isfahan

Kavir-e Lut

Khorasan

Mesr Desert

Isfahan

Home

Favorite

Trips

Profile

Beach

Desert

Historical

Forest

secure third party

Social pay

Direct card

15000 to 30000

30000 to 50000

More than 50000

15000 to 30000

30000 to 50000

More than 50000



What is the rental price per month for this commodation?

Direct Cart

Social pay

secure third party


After defining our design challenges, the pain points and the needs of users, we started creating low-fidelity wireframes to sketch out the basic layouts of the insight dashboard. These simple wireframes clearly visualize what are we creating in the later stage without diving into the details yet.

Snap home

Mehzad Chavoshi

Product Desginer

3 Month

Sep to Nov ,2020

Snap home is a rental app for some one looking for homely space for stay while traveling

Tools:

Search functionality

Detailed property information

Reviews and ratings

Safe and secure transactions

Alerts and notifications

Support and assistance

Solution

Users need a search function that allows them to filter and sort rental listings based on their specific needs, such as location, price range, number of bedrooms, and amenities.


Users want to be able to view detailed information about each rental property, including photos, floor plans, property features, and lease terms.


Users need a way to communicate directly with property managers or landlords to ask questions, schedule viewings, and submit.

Users expect the app to be user-friendly and optimized for mobile devices, so they can easily search for rentals on-the-go.


Users want to feel confident that any financial transactions or personal information they share through the app is secure and protected.


Users need the ability to receive alerts and notifications about new rental listings that meet their specific search criteria or updates on their.


Users may need support and assistance throughout the rental process, so the app should provide access to customer service and resources for renters.


Information architecture

we need to structure the app's content in a logical and intuitive way, so users can easily find what they need. This involves creating a sitemap, defining navigation patterns, and organizing information hierarchies.

Define brand guidelines: Start by defining brand guidelines that will inform the design system. This can include color palettes, typography, and other design elements that will be used consistently throughout the app.


Develop a UI kit: Create a UI kit that includes reusable components such as buttons, forms, icons, and other design elements. Make sure these components are consistent with the brand guidelines and can be used across different screens and sections of the app.


Use a grid system: Use a grid system to create consistency in the layout of the app.


Consider accessibility: Make sure the design system is accessible to all users, including those with disabilities. Consider using high-contrast colors, providing alt text for images, and ensuring that the app is navigable using a keyboard.


Test and iterate: Continuously test and iterate on the design system to identify areas for improvement and make adjustments as needed. This can involve gathering feedback from users, conducting usability tests, and analyzing data on user behavior.


Objective goals

  • Redesign app and improve functionality

  • Improve customer retention rate

  • Add messaging feature

Heading 1

Typeface: Rubik

|

Font Size: 36PX

|

Line Height: 44PX

|

Tracking: -2%

Heading 2

Typeface: Rubik

|

Font Size: 32PX

|

Line Height: 40PX

|

Tracking: -2%

Heading 3

Typeface: Rubik

|

Font Size: 28PX

|

Line Height: 36PX

|

Tracking: -2%

Heading H4

Font Size: 24PX

Typeface: Rubik

|

|

Line Height: 32PX

Typeface: Rubik

|

Font Size: 20PX

|

Line Height: 28PX

Heading 6

Typeface: Rubik

|

Font Size: 18PX

|

Line Height: 24PX

Search functionality

Detailed property information

Reviews and ratings

Safe and secure transactions

Alerts and notifications

Support and assistance