I was hired by Humble Lights to rethink their website in order to help them better achieve their business goals - in particular boosting their conversion rates. They design, manufacture and sell their own beautiful cordless smart lighting to both businesses and consumers alike. A small operation of just 5 (part-time) employees, they currently do not have an in-house specialist within the UX/UI space so there was a clear opportunity to provide them with some valuable insights.
Background
The Challenge
Website conversions are struggling
Current design too reminiscent of a product catalog rather than a webshop
Product descriptions are often too technical for buyers to really grasp
Site visitors often get lost on both the homepage and product page
Main competitors include Flinders, &Tradition, FatBoy, IKEA and FonQ
Project Balance
Research
Interaction Design
Visual Design
User Perspective
We interviewed 5 potential users, all with a genuine interest in interior design—most in their 30s.
Key areas for improvement included trust factors like reviews, customer care, and transparency around sustainability. The lack of product filtering was also a major gap, though trust-related issues were the main priority.
Based on this, we created a persona—Techie Phil—and mapped a user journey highlighting these challenges:
User Painpoints
Sustainability is a key concern for buyers
Products missing customer reviews
User's are convinced by compelling brand stories when first-time buying
Complicated return policies were often a deterrent
Found Sustainability
very important
Wanted to see
product reviews
May avoid purchasing
due to return policies
Found Brand
storytelling important
User Persona
With this, we created a user persona, Techie Phil, and built a compelling user journey for him where he runs into some of the key issues in the above bullet points. In short, Phil’s experience with Humble’s website showed that he was reluctant to commit to a purchase due to the lack of trust displayed from a still relatively young brand.
Problem Statement
In short, Phil’s experience with Humble’s website showed that he was reluctant to commit to a purchase due to the lack of trust displayed from a still relatively young brand. Thus our problem statement:
With a user persona and journey defined, we could create Phil’s “happy flow”. Using his pain points and the How-might-we’s created above, we could prioritize which problems to solve. From that we’ve created the user flow below, running through landing on the site to checking reviews, all the way to conversion. With the user flow set, we could now model a new site map (see next page).
Return policies are now clearly stated in the accordion menu of the product pages
Instead of linking to specific product models, Phil can navigate to relevant categories.
The home page now features a carousel where current deals can be advertised.
Customer reviews are now a key feature of the product pages
The product categories are now based on the use-case type of each item.
Business enquiries are now nested in a About dropdown together with brand content
Sustainability has now been added in the navbar as it’s a USP of Humble’s products.
Contact link has been moved to the footer to depopulate the navbar.
The Redesign
Brand Elements
Having tackled the website from a functional perspective, we also conducted an evaluation of its current visual brand components. We broke down the brand attributes into the following five descriptors, peer-approved by our colleagues:
Minimal
Smart
Cozy
Luxurious
Through these we created a mood board and thereafter a style tile matching these attributes from a visual perspective.
Low-fidelity Ideation
With the information hierarchy set of the site work commenced on ideating the actual UI interfaces through low fidelity wireframes.
The key ideas that made up these designs, built off the prior research conducted, included:
The homepage would be spanned with a hero image and be greatly shortened with more content moved to new pages.
The navigation menu had been revamped to house less content.
The product pages would be condensed, featuring thumbnails and product copy that’s more front-and-centre.
Product reviews are a prominent feature when viewing a product, accessible through tabs also housing tech specs and shipping details.
Mid fidelity
Following user testing, I had identified a number of possible improvements that could be made going into the mid-fidelity stage of wireframing:
The homepage now features a carousel to boost multiple promotions/products and CTA’s.
Users could now browse products based on their use-case rather than model names.
A three column scrollable grid would house the product feed of filtered products by selected category. Users later gave feedback that they were missing custom filters here.
This design included several options for users to select added functionalities. User testing showed that this was overwhelming so future designs would limit choice here to product colour & quantity.
High fidelity
A clear focus on beautiful product images to retain the luxury feel Humble strives for.
The top menu has further been depopulated based off user feedback.
CTA button and copy being part of the carousel enable multiple promotions.
The product categories are now based on the use-case type of each item.
Business enquiries are now nested in a About us dropdown together with brand content.
Thumbnails are now used to showcase product photos & colours.
Accordion menus have been moved up the page along with reviews.
Conclusions
Key learnings
This project highlighted just how important getting solid user feedback is to (re)designing a product. While it's easy to make assumptions based of of your own, or in this case, the client's biases those are not always reflective of the intended user.
In a digital transformation-driven world, more and more retailers learn to adapt to e-commerce. With that, users place ever-increasing importance on trust when selecting which platforms and brands to shop from.
Presenting your young brand to the world means not only do you need to make sure your user's purchasing process is as transparent and safe as possible, but also that you need to introduce your product's in a clear and easy-to-understand manner for what are likely new customers.
Client testimonial
"We were really impressed by how much Erik and his team have achieved and been able to produce in such a small amount of time. We really liked the thought process and felt that what he presented was really in line with our brand. You were able to make the website feel more like a webshop without compromising on the luxury feel of the brand.
The category pages showcased our products well, we liked the simple and clean, but clear design. Same for the product page, having the essential details on one page makes it for the customers easier to understand how our products might fit their need.”