top of page
Free Device Mockup - Top view2.jpg
Redesigning Homepage 

Visit the new Homepage at https://makespace.com/. 

TEAM

Product designer | Ellen
Product manager | Michelle
Content lead | Lalita
Engineers | Kenneth, Ganesh, Jamie, Joey
VP of brand | Matthew

MY ROLE

UX/UI design, Interaction design, Prototyping 
Responsive web design
User research 
Product strategy, Data analysis 
Design QA

DURATION

2 months

PROJECT STATUS

Live (Mar. 2021)

New homepage.png

Redesigned Homepage at MakeSpace

Both the content and design of our current Homepage are outdated. It’s not easy for customers to understand MakeSpace’s offerings. 

PROBLEM

RESULTS

  • The online conversion rate has increased from 2.71% to 3.45%

  • The conversion rate from homepage to next page has increased from 41% to 60%.

BACKGROUND

MakeSpace is a late stage startup focused on disrupting traditional self-storage by providing on-demand pickup and delivery of all your home and business items. I worked as the sole Product Designer for over a year, carrying out multiple large-scale projects from conception to launch.  

MakeSpace homepage was designed back in 2017. The style has become outdated and the components are not consistent with our new design system. Besides that, MakeSpace has grown quite a lot in the past few years. Both our services and markets have expanded. It's the time to have a new look. 

To better understand the problem, we also: ​​

  • Interviewed stakeholders from different departments

  • Reviewed 30+ Fullstory recordings

  • Listened to 200+ sales calls

Current MS Homepage.png

MakeSpace homepage (old)

mobile 1.png

Mobile site

The problems we've discovered include:

​

[Content] 

  • In lack of a section explaining how MakeSpace works.

  • Not enough information around press logos.

  • Reviews and markets are outdated.

  • In lack of a section promoting new services.

​

[User experience]

  • Too many texts overall, it's not very easily digestible. 

  • With the iPhone mock being vertical, it occupies a lot of space.

  • Customers click on the texts and icons wrongly.

  • Overall color and style is not consistent with our design system.

PROBLEM

Both the content and design of our current Homepage are outdated. It’s also not easy for customers to understand MakeSpace’s offerings. 

KPI TO IMPACT

  • Online conversion per month

  • Online conversion rate

  • LTV

  • CAC

IDEATION

Content for new homepage:

A) How it works 

  • MakeSpace process

  • Two types of services​​

B) Reliability

  • Scale

  • IRM partnership and security​​

C) Competitive service package

  • Comparison chart​​

  • Online inventory

D) Humanistic touch

  • Meet our SpaceMaker

E) Review

  • Customer reviews

F) Locations

  • Markets

According to data, we have larger traffic on mobile device (59%) comparing to desktop (41%). We decide to take the mobile-first approach.
wireframe.png
wireframe.png
wireframe.png
wireframe.png
wireframe.png
wireframe.png

Wireframe - mobile

ITERATION

iPhone 8 - 15.png
iPhone 8 - 15.png
iPhone 8 - 15.png

Redesigned homepage v1 - mobile

Version 1

After putting all the content together, I started to use existing visual styles from our marketing pages to form the 1st version. But overall the design looks a bit old-fashioned and quite boxy. It doesn't feel modern and clean.

iPhone 8 - 18.png
iPhone 8 - 18.png
iPhone 8 - 18.png

Redesigned homepage v2 - mobile

Version 2

I also experimented with more whimsical elements like tilted lines to hopefully reduce the boxyness. But it feels random and doesn't add value.

iPhone 8 - 46.png
iPhone 8 - 46.png
iPhone 8 - 46.png

Redesigned homepage v3 - mobile

Version 3

I started to take a step back to reduce the complexity of the background. Using only white and light grey colors makes the background simpler and subtler. The content actually stands out more. 

WORKING ON DETAILS

11112121.png

Landing

12214E12321.png

When scrolling down
- floating CTA

chat box A.png

When scrolling up
- header appears

213W21312312.png

Chatbot option B
- on left side

123123123.png

Chatbot option C
- minimized 

PROTOTYPE FOR TESTING

342423432.png

Homepage - desktop

324324234.png

Mobile

342423432.png

Landing option A - Light

23423423.png

Landing option B - Dark

sdfvdsvsdv.png

Light - mobile

ASFASFAS.png

Dark - mobile

USER TESTING

During testing, we talked to people who have no previous MakeSpace experience. All the participants were showed both light and dark version on both desktop and mobile device.

The goal was to understand if the service process and value is clear, if there's any confusion and whether they respond better to light or dark version.

Frame 3.png

Testing results summary

PROTOTYPE FOR IMPLEMENTATION

Homepage prototype-1.png

Light version was chosen based on user testing results. The headline and image were both updated to better reflect our service nature.

Homepage prototype-2.png

We changed the content of the last step to focus on delivery rather than virtual access. All the titles were further simplified too.

Homepage prototype-3.png

Junking section was moved up due to the interests shown by customers and our business strategy. 

Homepage prototype-4.png

We use a larger section to highlight our partnership with IRM and emphasize security. 

Homepage prototype mobile-1.png
Homepage prototype mobile-2.png
Homepage prototype mobile-3.png

New Homepage - mobile

After finalizing the design and content, the following steps include:
1. Design walkthrough with engineers
2. Implementation
3. Design QA
4. Release + AB testing

The new homepage was released in March 2021, please feel free to visit the website at https://makespace.com/

IMPACT

  • The percentage of users' submitting zip code on homepage has increased from 17% to 26%. ​

  • The online conversion per month has increased 50%. 

  • The online conversion rate has increased from 2.71% to 3.45%.

  • The conversion rate from homepage to next page has increased from 41% to 60%. 

NEXT STEPS

We will be constantly updating homepage. Some of the next-step improvements include: 
1. Work with marketing team on finalizing press section. 
2. Improve the review section to make it look less customized. 

We also redesigned the features page, and it's now being implemented.

bottom of page