Hushblankets - UX Case Study

Redesign of landing page for higher conversation rate

4.8/5

Business satisfaction

4.6/5

User testing satisfaction score

01

Introduction & Scope

Overview

Hush blankets is a Canada based company which sells weighted blankets for a comforting & stress free sleep. This was a freelance work done in mid 2019. They approached me for a redesign of their existing E-Commerce website.

My scope of Work

The scope of the project was to redesign all the pages in their website including the landing page, products page, cart and etc. This website is built on Shopify and hence the checkout page is not in the scope.

User Analysis, Competitor Analysis, Brand Styleguide & Visual Design

My Role

Freelance UX Designer

User & Competitor Analysis, Brand Styleguide, User Interface & Visual Design

April 2019 - June 2019

Team structure

Product Owner - 1
Marketing people - 2
UX Designers - 2

PROBLEM STATEMENT

To redesign the Hushblankets E-Commerce Website with special focus on the Landing Page to improve the conversion rate, brand recall and in overall to give a uniform design across all devices.

A Website Redesign...

The scope of the project was to redesign all the pages in their website including the landing page, products page, cart and etc. This website is built on Shopify and hence the checkout page is not in the scope.

Problem Statement

To redesign the Hushblankets E-Commerce Website with special focus on the Landing Page to improve the conversion rate, brand recall and in overall to give a uniform design across all devices.

02

Competitor Analysis

What works and what doesn’t for Hushblankets’ competitors?

Weighted Blankets are not such a niche space nowadays. There are several other popular brands also in the same area. Some of the decisions which I took in my solution were direct or indirect result of this competitor analysis.

03

Styleguide & Moodboard

Branding overhaul without making it look like a overhaul.

I prepared two moodboards with different tones and overall feel of the website. One was cool and the other was warm.

Brownish tone to signify warmth from the blanket.

✅ Blue & Green because they denote a more cool, sophisticated and cosy feeling.

We finalised the blue & green style in the end since it matched more with the existing brand values & people’s mental models.

04

Information Architecture

One main issue I saw in the content layout of old design was everything was mixed up.

I worked on the IA first and first most, to get the flow and make sure some of the most essential parts are covered.

05.1 Solution Breakdown

Improving the Hero Section

#1 - Improving the Hero Section

The older version of the hero section wasn't designed to be impactful

#1 - Device Setup

We need to make it easy for the user to setup the hardware connection since they are not tech people.

05.2 Solution Breakdown

Being more specific

#2 - Increasing the specifics

The old design talked too much generically about Weighted Blankets rather than about the uniqueness of Hush.

Device Setup User Flow

Based on the insights we gathered from our research, we arrived at an user flow which would allow users to quickly and confidently setup their devices within a few mintues.

#1 - Device Setup

We need to make it easy for the user to setup the hardware connection since they are not tech people.

05.3 Solution Breakdown

Reducing the Content Clutter

#3 - Reducing the Content Clutter

Most of the content in the old design were just too lengthy, boring and jargon heavy

Device Setup User Flow

Based on the insights we gathered from our research, we arrived at an user flow which would allow users to quickly and confidently setup their devices within a few mintues.

#1 - Device Setup

We need to make it easy for the user to setup the hardware connection since they are not tech people.

05 Why I did, what I did

Solution & Challenges

⛔️  CHALLENGE 1

The older version of the hero section wasn't impactful

1

✅ UPDATE 1

Proper usage of alignments and colors to convey a better message

  • Left aligned the text and used the brand color for thee CTA button so that it grabs attention.
  • Made sure peaceful expressions of the background image's subjects were clearly visible.
  • Gave a overall cosier feeling to the background image.

🦖 Old Design:

🌸 New Design:

2

⛔️  CHALLENGE 2

The old design talked generally about weighted blankets.

✅. UPDATE 2

We needed to educate people on what 'Hush Blankets' brings to the table

Instead of talking generally about Weighted blankets, I talked specifically about Hush Blankets and the difference it gives to the users.

🦖 Old Design:

🌸 New Design:

⛔️  CHALLENGE 3

Some content were just too lengthy, boring and jargon heavy

3

✅  UPDATE 3

Concise and understandable points

You could literally hear the users screaming for TLDR on reading the old content. I made it more concise and easy to understand.

🦖 Old Design:

🌸 New Design:

06

New Design

Homepage

Product Page

Blog Page

Learnings

Designing for E-Commerce

This was my first website which I designed for a physical E-Commerce store and I got to know about the entire process involved.

Knowledge of the marketing world

I got to know a lot about conversion metrics, designing for FOMO, and used several purchasing triggers throughout the design.

Shopify

This website was built on Shopify. Hence I got to know a lot about the platform, features, plugins and it's liquid theme language.

Conclusion

This was a great experience working with a new client and a new business area. At the time of writing this case study, this design is on the development cards. So, stay tuned for the outcomes!

More Suggested Projects