Case Study 01
Case Study 01
Case Study 01
HomeScape; Home-Rental Website
HomeScape; Home-Rental Website
HomeScape; Home-Rental Website
Overview
Overview
Overview
HomeScape is a modern and user-centric rental-home website. HomeScape caters to a diverse range of users, including young professionals, families, and retirees, who are in search of rental homes that align with their unique needs and preferences.
HomeScape is a modern and user-centric rental-home website. HomeScape caters to a diverse range of users, including young professionals, families, and retirees, who are in search of rental homes that align with their unique needs and preferences.
HomeScape is a modern and user-centric rental-home website. HomeScape caters to a diverse range of users, including young professionals, families, and retirees, who are in search of rental homes that align with their unique needs and preferences.
My Role
My Role
My Role
Product Designer
Product Designer
Product Designer
Client
Client
Client
HomeScape.Co
HomeScape.Co
HomeScape.Co
Tools
Tools
Tools
Figma, Google Docs, ChatGPT
Figma, Google Docs, ChatGPT
Figma, Google Docs, ChatGPT
Project Duration
Project Duration
Project
Duration
March 2023 to May 2023
March 2023 to May 2023
March 2024
to April 2024
The Problem
The Problem
The Problem
Available home-rental websites have outdated designs, inefficient systems for browsing through products, and confusing main user flow.
Available home-rental websites have outdated designs, inefficient systems for browsing through products, and confusing main user flow.
Available home-rental websites have outdated designs, inefficient systems for browsing through products, and confusing main user flow.
Understaing the user
Understaing the user
Understaing the user
User research
Personas
User journey maps
User research
Personas
User journey maps
User research
Personas
Problem statements
User journey maps
Research Origins: Unveiling Insights
Research Origins: Unveiling Insights
Research Origins: Unveiling Insights
User interviews were conducted with a diverse individuals seeking rental homes , with analyzing their responses. Assumptions were made regarding user behaviors, pain points, and preferences prior to the research. However, through the interview process, these assumptions evolved as valuable insights were gained.
User interviews were conducted with a diverse individuals seeking rental homes , with analyzing their responses. Assumptions were made regarding user behaviors, pain points, and preferences prior to the research. However, through the interview process, these assumptions evolved as valuable insights were gained.
User interviews were conducted with a diverse individuals seeking rental homes , with analyzing their responses. Assumptions were made regarding user behaviors, pain points, and preferences prior to the research. However, through the interview process, these assumptions evolved as valuable insights were gained.
Here are the major User Pain Points;
Here are the major User Pain Points;
Navigation
Navigational challenges resulting in a disrupted user flow while searching for rental homes.
Information
Frustration with outdated or inaccurate information about rental homes.
Frustration with outdated or inaccurate information about rental homes.
Accessibility
Difficulty in locating suitable homes with necessary accessibility features.
User Personas: Understanding the Needs and Goals
User Personas: Understanding the Needs and Goals
User Personas: Understanding the Needs and Goals
Understanding users is key to delivering an exceptional web experience. Through insightful interviews, I crafted user personas to embody the needs, desires, and behaviors of the target audience. This persona has a fictional character who represents a composite of real users, ensuring that the design decisions align closely with their goals and expectations.
Understanding users is key to delivering an exceptional web experience. Through insightful interviews, I crafted user personas to embody the needs, desires, and behaviors of the target audience. This persona has a fictional character who represents a composite of real users, ensuring that the design decisions align closely with their goals and expectations.
Understanding users is key to delivering an exceptional web experience. Through insightful interviews, I crafted user personas to embody the needs, desires, and behaviors of the target audience. This persona has a fictional character who represents a composite of real users, ensuring that the design decisions align closely with their goals and expectations.
User Journey: Mapping the Pathways of User Experience
User Journey: Mapping the Pathways of User Experience
User Journey: Mapping the Pathways of User Experience
I created a user journey map which is a series of experiences a user has as they achieve a specific goal, to help identify improvement opportunities .
I created a user journey map which is a series of experiences a user has as they achieve a specific goal, to help identify improvement opportunities .
I created a user journey map which is a series of experiences a user has as they achieve a specific goal, to help identify improvement opportunities .
Starting the design
Starting the design
Starting the design
Sitemap
Sketches
Wireframes
Usability Studies
Sitemap
Sketches
Wireframes
Usability Studies
Sitemap
Sketches
Wireframes
Usability Studies
IA and Sitemap: Structuring the Website for User-Friendly Navigation
IA and Sitemap: Structuring the Website for User-Friendly Navigation
IA and Sitemap: Structuring the Website for User-Friendly Navigation
IA (Information Architecture) and sitemap section details how to organize the content and structure of our website to ensure intuitive navigation for users.
IA (Information Architecture) and sitemap section details how to organize the content and structure of our website to ensure intuitive navigation for users.
IA (Information Architecture) and sitemap section details how to organize the content and structure of our website to ensure intuitive navigation for users.
Digital Wireframes: Transitioning from Paper to Pixels
Digital Wireframes: Transitioning from Paper to Pixels
Digital Wireframes: Transitioning from Paper to Pixels
In digital low-fidelity wireframes, I sketch out the basic blueprint for our website's user interface, focusing on content placement, navigation elements, and overall flow. By keeping the design simple, so it can be quickly iterated and gather feedback on the usability and functionality before diving into more detailed design work.
In digital low-fidelity wireframes, I sketch out the basic blueprint for our website's user interface, focusing on content placement, navigation elements, and overall flow. By keeping the design simple, so it can be quickly iterated and gather feedback on the usability and functionality before diving into more detailed design work.
In digital low-fidelity wireframes, I sketch out the basic blueprint for our website's user interface, focusing on content placement, navigation elements, and overall flow. By keeping the design simple, so it can be quickly iterated and gather feedback on the usability and functionality before diving into more detailed design work.
Usability study: parameters
Usability study: parameters
Usability study: parameters
Study type
Study type
Study type
Unmoderated usability study
Unmoderated usability study
Unmoderated usability study
Location
Location
Location
United States, remote
United States, remote
United States, remote
Participants
Participants
Participants
5 participants
5 participants
5 participants
Length
Length
Length
20-30 minutes
20-30 minutes
20-30 minutes
Usability study; Findings
Usability study; Findings
Usability study; Findings
Search Bar
Users had to navigate back to homepage to access the search bar.
Users had to navigate back to homepage to access the search bar.
Users had to navigate back to homepage to access the search bar.
Account
The account element on the navigation menu isn't receiving much attention.
The account element on the navigation menu isn't receiving much attention.
Homepage
Some users expressed that the above-the-fold section doesn't look as appealing as expected.
Refining the design
Refining the design
Refining the design
Style Guide
Hi-Fi Designs
Style Guide
Hi-Fi Designs
Style Guide
Hi-Fi Designs
Lo-Fi Wireframe
Lo-Fi Wireframe
Hi-Fi Mockup
Hi-Fi Mockup
Hi-Fi Mockup
Style Guide
Style Guide
Style Guide
Colors
Colors
Colors
#002366
#002366
#002366
#FAF9F6
#FAF9F6
#FAF9F6
#A7C7E7
#A7C7E7
#A7C7E7
#E5E4E2
#E5E4E2
#E5E4E2
Font
Font
Font
Aa
Aa
Aa
Lato
Lato
Lato
General Components
General Components
General Components
Buttons
Buttons
Buttons
Forms
Forms
Forms
Logo
Logo
Logo
Final Design Showcase
Final Design Showcase
Final Design Showcase
Desktop
Desktop
Desktop
Above the fold
Above the fold
Above the fold
Footer
Footer
Footer
Blog Posts
Blog Posts
Reviews
Reviews
Reviews
Search Results
Search Results
Selected House Page
Selected House Page
Application
Application
Tablet & Mobile Variations
Tablet & Mobile Variations
Tablet & Mobile Variations
