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.
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
Freelance UX Designer
User & Competitor Analysis, Brand Styleguide, User Interface & Visual Design
April 2019 - June 2019
Product Owner - 1
Marketing people - 2
UX Designers - 2
Hush Blankets brand were not getting much conversions through their brand website. How can we discover the issue and redesign Hush Blanket's eCommerce website for a higher conversion rate, increased brand identity and visual appeal?
The client had already done some research from their end and had come up with few insights, which were:
Now, as a designer, I started doing my secondary research as well.
I researched using the internet, and I got many inputs from text-based social networking platforms such as Reddit and Quora.
My gathered insights about the Users:
With these insights in mind, I started analyzing the existing Hush Blankets website. Some of the problem areas which I identified were:
The Website lacked a consistent branding in visuals and messaging.
The old website had poor UI design choices leading to lack of appeal.
Too text heavy, lack of proper CTAs and loads of generic content.
More on the last point, The website had too much text and fewer visuals. I felt this was the reason the customers complained that they lacked time to go through it.
Everyone has time. It's about how we choose to use it. In our case, whether we could convince our customers to use that in our website.
And also, this wasn't an emergency service website/app which people typically access in urgent times. It was a luxury product which they most often access when they have enough time on their hands.
Like I mentioned previously, Hush was in a growing competitive space, and there were many competitors, both big and small.
For this competitor analysis, I choose only the brands which had at least one of the following:
Some of the brands which fit this criterion were:
All of these websites were in better shape than the current version of the Hush Blankets website.
Bearaby and Casper were the best of the lot in all the areas, but I would rate Bearaby as the Gold standard only because Casper's concentration on Weighted Blankets was less when compared to their other products.
How might we redesign the Hush Blankets website to give it a premium look in visual branding and messaging, which instils trust in the users and provides a good experience, thereby increasing the conversion rate in return?
In the previous design, some of the sections which are critical for the user's experience and as well as for conversions were missing. For example, Product categories, Social Proof weren't present in the previous design.
Based on my analysis in the previous sections, I added some new sections in the design and removed any unnecessary sections.
Even in the Product Page's old design, loads of critical information necessary to help the user make a decision were missing. It failed to speak to the user. I included some sections which would allow the users in understanding why this product is worth their money.
There was also a case where the users would come to the Product page directly without visiting the homepage or not reading all the information. Hence, some of the critical information from the homepage I showcased on this page too.
Checkout some of my different variations and iterations I tried out for this website redesign.
My clients were not looking to do too much of an overhaul of the entire style guide. They already had the green colour as the base brand colour. They mostly wanted to continue with using the same green. They also had a thought of experimenting with a warmer colour such as orange or brown.
So, I prepared two mood boards for the same. I wanted the website to have a bluer theme with blue themed photos for the green brand colour. The CTA buttons and highlights would have a green colour.
Green and blue are cool colours and represent relaxed, sophisticated, and cosy feelings, which was the emotion I wanted to convey on the website.
For the warmer mood board, I collected photos with yellowish and brown shades.
Finally, we zeroed in on the cool colours mood board since we did not want to mess too much around with the user's mental model. Most often, sleep is associated with cool shades.
Based on the mood board, I expanded it into a complete style guide for the website. I went with Avenir font. Inter was something that I also considered using initially.
I used a standard 4-point spacing system with a 12 column grid.
It is the place where any website can potentially convert a lot of its visitors all by itself. So naturally, we must get all the components of a standard Hero section right.
The Message - In the old website, it just had a generic sentence calling itself the 'Best'. How can we improve this?
Thinking back to my research, most of the potential customers of weighted blankets were people with high stress levels and had trouble falling asleep.
If we could effectively speak about the impact of blankets on stress/anxiety, it might talk directly to the visitors and get them hooked. So I updated the message accordingly.
The old design lacked a proper CTA, which is ABSOLUTELY critical. Instead, it just had the text 'Buy Now'. Buy what? Considering that Hush sold multiple blankets, it wasn't entirely clear as to which it was referring. I rephrased the text and made it more prominent.
I redesigned the Navbar and removed the CTA with the dollar value since it was unneccessary.
The old website of Hushblankets was laden with too much text. And most of it was generic information on weighted blankets, which was just a Google search away, or it could be included in the FAQ. So I removed most of the generic information and added content that spoke explicitly about Hush.
One major flaw in the old design was that it did not quickly educate the users on the type of products sold by the brand. So, I added the categories of Weighted Blankets sold by Hush.
Now that they know what the available products are, it's time to highlight why they should consider getting it. I started with the benefits of Hush Blankets and how it differs from other brands out there.
If you see the content in the old design, you can see that it's too lengthy, tedious and just too jargon-heavy.
I dealt with it in the following ways:
Now the users know what you have to offer.
But still, for the ones who are still in a dilemma, we need to emphasize a little more on the benefits and highlights. And that is where the social proof section comes in.
Before starting with the Product page design, I just had one thing in mind. I would do this, not as a 'redesign', but as a completely fresh design. The reason being the old design was terrible with no helpful information at all.
From my competitor study and as well as my experience in designing other eCommerce product pages, I came up with a checklist on the items I'll be having on the Product page.
I reused some of the elements from the homepage in the product page as well. However, the product page components are more tailored to the specific product which the user is viewing:
I used a pretty straightforward split layout with the Product images on the left side.
These sections were pretty straightforward since I mostly reused the same components from the homepage with the content alone tailored to match the selected product. It would increase the website visitor's confidence in the product and the brand.
I ended the page with the related products section and the footer.
This was my first website which I designed for a physical E-Commerce store and I got to know about the entire process involved.
I got to know a lot about conversion metrics, designing for FOMO, and used several purchasing triggers throughout the design.
This website was built on Shopify. Hence I got to know a lot about the platform, features, plugins and it's liquid theme language.
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!
