‘Here or There’
A real estate e-commerce site designed for everyday people who struggle to find homes in the United States housing market. A product for individuals, not institutions.
Research, User Testing, Prototyping, UX & UI Design, Branding, Logo Design
Role:
12 Weeks, 2023
Time:
Tools:
Figma, Figjam
01.1: The Problem
01.2: The Research
01.3: The Discovery
02.1: The Vision
02.2: The Features
02.3: The Ideation
03.1: The Solution
03.2: The Iteration
03.3: The Future
01.Discover
The United States’ housing market has been a place where people’s dreams have been realized and deferred. From newlyweds buying a starter home to a retiree on the lookout to scale down their life, the housing market for a long time had something for everyone. As time progressed, and loopholes were found, the housing market became treacherous terrain for the average person. News outlets, like The Guardian, report one of the reasons for the turbulent market to housing scarcity caused by institutions who have the ability to pay over the asking amount and in cash. They are a difficult opponent for middle to low income buyers to bid over.
Often, home sellers are more likely to sell their properties to institutions instead of individuals for a larger profit. Then these single family homes are converted to rental properties dwindling the amount of homes that qualify for a middle class budget.
01.1: The Problem
I set three research goals:
Learn recent home buyers’/renters’ method for house hunting.
Learn about recent hone buyers’ experiences when bidding for a home.
Learn about recent home buyers’/renters’ level of knowledge on the housing market.
01.2: The Research
-
I conducted a competitor analysis to find both direct and indirect competitors that people.currently participating in the housing market may use.
-
Three students were interviewed over the phone and via a digital survey. Out of the three, one interviewee was in an undergraduate program while the rest were pursuing post-graduate studies. The survey was comprised of open ended and multiple choice questions to gain insight into their experience with utilizing academic ejournals for their studies. One of the students expressed how tough it could be to find articles similar to each other while another lamented about inadequate summations of papers that mislead them into thinking they are usable for their projects.
01.3: The Discovery
After affinity mapping, I synthesized the responses to reveal key takeaways:
Most of my interviewees had to figure out the housing market on their own.
Some interviewees who bought a home felt feelings, like, disappointment and anxiousness.
Interviewees spent a lot of time learning about potential neighborhoods.
-
Two personas were created that embodied the ideal ‘Here or There’ users which acted as a north-star when building the application’s features.
02.Define
Project goals were defined to help conceptualize the features needed for the product to ensure that the users’ needs will be met throughout the brainstorming process. Moreover, it helps me realize realistic business goals and technical constraints.
I was able to extrapolate a concept for the app from my research and further define the product’s goals:
To provide support and empower individuals in the housing market.
Provide knowledge and transparency about the housing market.
build an intuitive product that can integrate into any lifestyle.
02.1: The Vision
-
3 potential users participated in an unmoderated card sort to give me an understanding on what features are expected and how they should be organized in the application.
02.2: The Features
I created a site map and user flow that pushes the users to find potential homes, but also offering a community aspect that is oft overlook in other real estate e-commerce sites.
-
With the assistance of user interviews and research into similar sites, key features were developed to be implemented in the product.
-
A user flow for onboarding was created to layout the details needed for their journey to create an account for the app. Click here to view the full flow diagram.
02.3: The Ideation
As I reviewed the interviews and the card sorting, Dillon’s and Cameron’s primary concerns will be finding their ideal home and learning about various neighborhoods. Therefore, I focused attention on personal account creation and the public forum.
-
Low-fidelity wireframe sketches for the “Login” and the “Sign-Up” screens.
-
(L to R): Mid-fidelity wireframes for the “Login” screen and the “Community” screen.
03.Design
I knew that I wanted ‘Here or There’ to evoke cheeriness and serenity from users. One of its values are ‘People First’ which made me want to have a personable design. For example, I outlined features of a home and pasted them in the background throughout the product. They aren’t intentionally imperfect to show a human hand was present. Moreover, all of the colors and text size were passed through the WebAIM’s Contrast Checker to validate the accessibility of the product using the Web Content Accessibility Guidelines.
#F5F5B8
#98A100
#FA9442
Color palette
L to R: Home screen, menu, sign-up form, and public forum
-
I found it imperative to design an application that feels familiar for the user and wouldn’t crowd up the small screen of a user’s phone.
Utilizing the branded UI library I was able to evolve the mid-fidelity wireframes into the first version of the high-fidelity wireframes to then be converted into a clickable prototype.
03.1: The Solution
-
-
5 people between the ages 20-50 were recruited to test and rate the usability of the product. I designed and moderated the tests. Success was measured by 4 metrics: time on task, successful task completion, error rates, and a Likert scale. The test was remotely administered and completed, on an average, under 5 minutes.
Iterations informed by user feedback were performed on the high-fidelity prototypes. All iterations were completed to make functions obvious and easy to use on a mobile site.
03.2: The Iterations
Added hero copy on the homepage to entice visitors and included specific instructions in the search bar. Furthermore, the recommended properties were placed on individual cards.
Aligned icons below property photos.
03.3: The Future
What I learned:
eCommerce sites need to be image centric, so colors used for the design can’t detract from it.
User-centered designs may require to forgo initial designs I deemed essential, but could actually be unnecessary.
What I want to do in the future:
Optimize a design for desktop and tablet use.
Design direct messaging features for the platform.
