Notonthehighstreet

Lead Product Designer

Project Overview

I joined Notonthehighstreet.com as their lead product designer, working under the commercial director at the time. My main aim was to rebuild the design team and set out a structure for user experience testing and build a strong design system that could lead the company into the future in terms of development and design. At the time I was brought on as the sole designer, starting to steer the company to be user focused in mindset.

My projects varied from building new applications to designing and incorporating a design system into the new react based website. We also managed to build out the new homepage utilising this design system, with a emphasis on user research and creator's feedback. Most items here are public domain, projects I completed whilst working their are under NDA and won't be discussed in this case study.

Working at notonthehighstreet was an exciting experience, and taught me a lot about eCommerce companies at scale, with design being incorporated across numerous departments and working closely with execs to deliver key strategic features. (It was also a fun place to work, so go check out their career's page if you're interested)

Mandatory sticky note picture. Showcasing critical user flow journeys. Inspiring the team using Game of Thrones references.

Design Process

My first task at Notonthehighstreet, was to build out a structured product design process communicating across numerous departments within the company. I set out creating a testing plan, with a heuristic test and learn approach. We wanted to move fast whilst keeping research at the heart of what we deliver within the design team. Each new feature was researched, put into a wireframe prototype and tested with the Notonthehighstreet user base and a user testing panel. Once a feature was put into place on the website, we leaned on our data team to supply us with the key figures needed from multi-variant testing, if something didn't work, it was back to the drawing board. If it did, we looked at expanding and pushing this version to more of the user base.

Our first major test utilising each of the above methods including our new design system was the new notonthehighstreet homepage. Which had involvement of four departments in the company with the design team leading the charge. The homepage needed to be fast, mobile-first and push users to explore more categories. From a brand perspective, the company wanted to highlight our key creators.

Old Homepage
New Homepage
The old homepage didn't have a clear call-to-action, which we noticed from numerous heat and click maps. It used curated categories which were not the most popular user paths.
The new homepage utilises the new design system, has a clear call-to-action and focused on the top user categories, all above the page fold for desktop and mobile users. The A/B test which was run came back positive and was changed over towards the end of 2019.

Solution

We created a brand new homepage for Notonthehighstreet, implementing a clear call-to-action to the related gifting calendar event such as "Father's day", we also added four of the top-categories which cut down the time in which users where exposed to without searching and thus increased conversion. The branding department wanted to clearly communicate why we were different from our competitors, replacing a "Skinny Banner" located at the top of the page with a clear key messaging banner. The "Skinny Banner" removal did not impact conversion or discovery statistics as we pre-checked click and revenue before removal. Changing a homepage for some companies may not impact much, but for a major player like Notonthehighstreet any drop in conversion was a dramatic in terms of revenue.

Outcome

Once the homepage was developed using a react library which implemented the new design system, the data team ran it through A/B testing, comparing the statistics to the currently released homepage. After 3 months, we noticed a small increase to conversion, and a shorter time to checkout as customers where finding products through the main category groups via the website. Overall, all departments where happy with the result and it was eventually deployed into production and is now the main homepage for the website.

The process used to create the homepage was the first the company had done through a design, test and learn strategy. The company was setup for the future, with a full design system which other designers can pick up, and the testing strategy was fully in place and sold into upper management.

Let's start something great together.Jonathan.mark.kelley@gmail.com+44 7792 069547