Wahi

MY ROLE

Product Designer

OVERVIEW

Wahi is a Digital Real Estate Company that focuses on creating an End-to-End Platform experience for homebuyers.

For this client, I worked on both desktop and mobile designs for a multitude of features such as: a 'Search & Browse' map page, individual home listing pages, a 'Financial & Mortgage calculator', a marketing site, and the brand's Design System.

Check out their site, Wahi.com, or read more about my responsibilities and view some of my work below:

DESIGN SYSTEM

First, I was tasked to build and update their design system to unify the design rules, patterns, themes, and components for the Wahi brand. This includes, but is not limited to, components such as:

Global Component Library

Typekit outlining the brand typeface(s) with more than 15 font styles and weights across both desktop and mobile platforms.
Colorkit outlining use cases such as primary, interactive, system, hover & active states, and more.
Grid systems for Desktop, Mobile, and Tablet detailing the margins and gutters for each device.
Primary, secondary, and tertiary buttons as well as text links, all with designs for their default, hover, active, and focus states.
Inputs such as search bars, free text, dropdowns, date pickers, and price inputs, all with their respective default, hover, active/selected, filled, and error states.

Product Library

Listing Cards detailing the image aspect ratio, usage rules either on its own or in a row/column, and multiple designs for the various states.
Map designs and map pins showcasing transition effects and use cases for the different pin designs.
Chat page designs: chat bubbles, unread chat indicators, messages sent by another party versus messages sent by me, as well as designs for various states.

property listing Development Library.png

Marketing Site Library

Testimonial cards highlighting real user reviews, as well as stress tests for various lengths of feedback.
Main CTA newsletter card prompting users to sign up for both desktop and mobile platforms.
FAQ Accordion showcasing both a default and expanded view as well as stress tests for lengths of text.
Table of Contents with stress tests and different layouts depending on the number of items.

Search & Browse Listings Map

Designed iterations of the Search & Browse Map page to showcase properties within a given radius and to guide home buyers when searching for dream homes. Streamlined and scaled this search process for Mobile.
Included multiple states such as Default, Search Typeahead, Loading, Active/Sold listings, and Cluster.
Designed Filter selections for users to customize search preferences when browsing for properties.

Property Listing Page

Aided in the design of individual property listing pages to help new and existing home buyers gain valuable insight on properties easily.
Included features such as School Zones, Purchase History, Save listing and more.