Find me elsewhere 

  • White LinkedIn Icon
  • White Instagram Icon

​© Copyright 2019 by Dio Chen

Product Design & Design Management 

HubHaus -Reimagined Shared Housing

HubHaus Transformation

I am responsible for product design and branding for HubHaus. My redesign of HubHaus's website resulted in a 40% customer conversion increase. The newly designed internal tools helped boost acquisitions and operational efficiency, which supports our nationwide expansion for HubHaus. This successfully contributed to our rapid growth.

My Role - Senior Design Lead
Collaboration with  CEO, Growth Department, Engineers and Copywriters 

Back story -

I joined HubHaus in March of 2018. There was only one designer on the team before I arrived. There was a version of the website, the tenant portal, and admin portal. Luckily HubHaus had already proven a product-market fit, so we were looking to scale to more states and cities.  I got in at the right time to create valuable digital tools for the staff.

Research conducted

 

I lived in one of the HubHaus residency for 6 months to experience our product.

  • Reviewed recorded user interactions on the HubHaus website. 

  • Conduced eleven live user studies with potential users using different devices.

  • Gathered website data. (including Google analytic, Mixpanels & Periscope data...)

What did we find?

Bad usability led to high drop-off and an outdated visual design led to a lack of trust 

1.Mobile/tablet had usability problems which resulted in only half of the conversion rate compared to the desktop site.

2. The website did not have a user flow for users with different needs or in different stages of room searching.

3. Lack of some features to support user​ interactions.

 

4. No efficient navigational system.

 

New Branding

The color is too contrasting and makes it hard to have it in different colored backgrounds.

Concept

A House shape - Hub"Haus" 

Infinity loop - Community effect

Puzzle- Diverse people getting together

thehubhaus.com redesign

At first, the goal was to keep the development lean. To accomplish this, the product team conducted A/B testing and optimized the website piece by piece. However, the problems stated gave us a reason for a site revamp.

Primary problems: 

1. Lack of a flexible code structure for testing and experimentation.

2. Bad usability, especially mobile UX causing a drop-off. Visual Design was out-dated, causing a lack of trust.

A twist to enhance the user flow

1. Simplified the top menu bar options to decrease confusion and help guide potential tenants, landlords.

2. Encouraged cross-page browsing to keep users on the page. I found every potential touchpoint that would drive users to browse more houses. 

3. Enhanced the after-booking journey by recommending more houses which resulted in a 33% increase of the number of showings booked per user.

Digital ecosystem

& Scalability

Admin system - Internal tools.

Proven success

Lucy the PM:

OMG the site conversion is 40% better than the old one!

+39.5% 

book a house showing rates

6.3 increased to 7.2

satisfaction rate for Tenant Portal

400 + hours/week

cut in labor cost with 10+ Internal tools built

Kei the VP of growth:

This is awesome! We can finally do more a/b testings!

Consistent Brand

A set of portraits for the team, as we have a global team, it helps boost team moral.

What we learned from building this product

What we did well  

  • Good consistent branding helped to build trust and to drive high booking rates.

  • Improvements in information architecture and UX for mobile , tablet and desktop.

  • Improved website speed. Our tech team changed to Vue.js and built a good foundation for future UI development changes. 

Below are some other small examples of UX improvements:

learning plan photo.png