Client: Superdrug
Date: 2020
Client: Superdrug
Date: 2020
In 2019, Superdrug approached my team to design and build them a new blog. Their current blog was old and designed before their website received a face-lift. As a result, the design was outdated, out of sorts with the new website and struggled to meet the needs of the businesses new focus on content lead shopping experiences.
Our brief was to create an experience which mixed content with commerce to maximise conversion and site dwell time. Therefore, our key focus was to make the user journey of finding a specific type of article as simple and as quick as possible.
We used HotJar to see how customers are using the blog. We put heat maps, click tracking and used recordings to research what our customer liked about the blog and how they used it.
We found that the navigation was not suitable. Customers didn’t know the difference between “Just landed” and “News and Trends”. This led us to redesigning the structure of the menu to ensure it met with customer needs.
We also knew that an overwhelming percentage of our customers visit the blog using mobile devices. The previous mobile experience was an after thought so we set out to ensure this was our main focus.
Based on this research our UX Specialist created wireframes and IXD models to explain the new user journeys to our stakeholders. After some iterations we went on to initial UI designs to create a high fidelity prototype.
After the UX team and our stakeholders were happy with the wireframes I set off designing a mock-up of the new blog. We were under time pressure due to taking this project on during the studio’s peak period so I decided to create a basic UI so I could create a high-fidelity prototype quickly. I created the prototype in Adobe XD and used Userlitics for user testing.
The test had set objectives so not all functionallity was required. The primary purpose of the test was to ask a user to find the skin cleanser article.
You can interact to prototype below.
Our testing showed that users liked the design and layout of the blog. They found it easy to navigate and gave us some useful feedback to make improvements including extra way finders and clearer bread crumbs.
After testing I finalised the design and created a UI kit. We then created a Desktop design and user tested that before making further improvements before sending to development.
