habitat

find your perfect home, first

OVERVIEW

Habitat is a responsive app created to help home buyers find their perfect home. What differentiates Habitat is its ability to custom curate the newest homes on the market so the user never has to miss the perfect home. 

Habitat was created for users that don't want to rely on apps that generally search their area with basic criteria and don't want to place their home search solely in the hands of a real estate agent. 

CHALLENGE

To develop a responsive app that provides future home buyers with an easy customizable interface to find their first or next home. While it may be hard to find the perfect house or view and put an offer in on one before someone else does - Habitat helps by notifying the user immediately of new listings that fit their custom selected criteria. 

ROLE

UI / Wireframes (low, mid + high), Mockups, Animation, UI Prototype

TIMELINE

2 months

THERE'S NO PLACE LIKE HOME

RESEARCH + USER FLOW

I started off by conducting a competitive analysis on the top rated real estate apps for first time and repeat home buyers to familiarize myself with the general layout, features, and design patterns. 

 

Key features were then identified and turned into user flow based on the competitive analysis and the projected users motivation and needs. 

The goal was to create a real estate app that would do the searching work for you. In order to achieve that we needed a comprehensive on boarding process which can be seen below. 

ENTRY POINT

WELCOME

CREATE ACCOUNT

LOGIN

FORGOT PASSWORD

DESIRED LOCATION

PROPERTY TYPE

# OF BEDROOMS + BATHROOMS

SIZE

PRICE

ADDITIONAL FILTERS

PUSH NOTIFICATIONS?

PROFILE CREATED

SUCCESS CRITERIA

DONE

WIREFRAMES

low fidelity

Initially, I started with hand sketched low fidelity wireframes and digitally translated them with Balsamiq to start the project off with a clean digital flow of the app.  

mid fidelity

After some thoughtful iterations I applied hierarchy, spacing & design principles to create mid fidelity mock ups on Sketch.

MOOD BOARD

I created two moodboards to represent the spectrum of users that could be using the app. 

I ran an A/B test with 35 participants and Moodboard #1 won 60% to 40%.

Decision: Moodboard #1 Moody Tones

I decided to go in this direction because the colors in Moodboard #1 promote a sense of wealth, calm, and nature. 

(hover to view Moodboard #2)

STYLE

All design decisions about colors, typography, and other elements adheres to creating an app that feels strong, confident and calm.

FINAL DESIGN

STYLE GUIDE