← Back

Improving user journey for Virgin Wines

My role
Responsible for redesigning the desktop version of the site based on research analysis of the old site
Methodologies
Heuristic analysis, competitor analysis, affinity mapping, information architecture, wireframes, prototypes
Timeframe
March 2023 - May 2023
Introduction

Overview

Virgin Wines wanted to modernise and improve their existing recruitment journey, with an aim to boost conversion rates. As part of their exploration of how this could be achieved, they asked for UX students help. Working with a team of five other student designers, we analysed the previous user recruitment journey and presented the client with a new proposed user journey for the desktop and mobile versions of their website.

The design recommendations were taken into consideration by Virgin Wines as part of their own redevelopment work on their recruitment flows.

Problem

  • The current journey has too many opportunities for drop out.
  • Mobile traffic isn’t as well catered for as it should be.
  • A mix of key messages and conflicting branding leads to brand confusion due to Virgin Wines branding, WineBank branding and point of entry partner branding.

Solution

Our solution involved optimising the existing user journey by reducing it from six pages to three pages as per clients request. We enhanced the content hierarchy, improved legibility, and ensured better accessibility, resulting in a revamped, fresh, and modernised look for the website.
Stage 1

Research

The majority of the research stage was spent analysing the current stage of the journey. Although the client advised against conducting user interviews or usability tests directly with the existing site, they did supply us with essential information and quantitative data to work with.

During the research phase, I analysed the existing content structure of the pages, taking into account the overall theme, branding, language and tone of voice consistency across the entire journey.
My primary research goal was to learn about and analyse the current state of the journey. To accomplish this, I went through several stages of analysis, examining every detail on the page to determine what should be included and what could be removed in the new redesign.
  • Heuristic analysis was used to pinpoint design problems throughout the pages. Many of the notes addressed issues with hierarchy or content.
  • Through competitor research, I found that many of the competitors had a lot more simpler user-flow with less decisions and steps for users to follow. Many of the competitor websites were built mobile-first.
  • Copy analysis was also used to determine whether the tone of voice matched what the client was trying to convey to their customers.
  • Hierarchy analysis was done to map out which content and elements were most important and where they should be placed on the page for optimal visibility based on their use.

Identifying pain-points in the current journey

  • The user has to engage with lots of different steps throughout their WineBank journey, making it unnecessarily confusing and hard to navigate.
  • The page's functionality appeared to be the result of numerous revision attempts over the years, adding to the cluster of information without providing clear direction to the user.
  • The way that information is displayed fails to build trust and give clear directions to the user. In order for the user to fully understand what they are signing up to, they are required to read through several paragraphs of information.

Finding themes through collaborative affinity mapping

Our team collaborated to create an affinity map of all of our findings in order to organise and compare the information. We compared our findings across the several website pages and organised them based on three criteria: content, aesthetics, and functionality. Finally, several themes and patterns emerged, which we addressed through team brainstorming sessions.
  • First two pages of the website could be merged together if not redesigned or removed completely.
  • The structure of each page lacks a clear purpose, and the content on the pages often overlaps, making the user experience inconsistent and confusing.
  • The pages need better navigation system that clearly indicate to users their progress and how to easily backtrack to the previous step in the process.
  • It should be made clear to the user if the voucher discount has been applied throughout their journey to minimise any guess work.
Stage 2

Designing

Through the design stage, I collaborated with another team member to redesign the desktop version of the site. To be as productive as possible, we each worked on our own versions of designs and later through brainstorming sessions we compared and combined our ideas together.

We presented multiple redesign concepts to the client to gain their feedback. Collaborating closely with the client, we aimed to strike a balance between business objectives and user experience considerations. Based on their feedback, we delivered a redesign that addressed the shortcomings of the previous site.

Introduction page

  • Using large type and visual elements, it was made clear where the user had landed. This replaced the previous background image, which occupied valuable screen space and proved to be a big dropout point.
  • The user is introduced to the product's basic features and given the option to easily learn more and contact support if they have any questions.
  • "How it works" is placed above the fold to capture the user's attention for the next page section.
  • Visual hierarchy of elements was improved to enhance legibility and to better guide the user through the page.
  • Reduced the use of CTA buttons to make them more purposeful and to make them stand out more on the page.
  • More brand cues were introduced based on client requests to make it clear that the user is joining Virgins Wines subscription.
  • To build customer trust, social proofing was added with customer reviews.
  • Frequently asked questions were broken down and sorted based on their importance. To improve legibility, they were aligned to the left.

Choosing introductory case

  • The majority of the text was removed, and the visual hierarchy of elements was adjusted to emphasise the page's purpose. From the client supplied data, this page suffered from a lot of dead clicks due to incorrect use of text elements.
  • As per clients feedback, three different wine cases were added for the user to choose from, with the most popular one being pre-selected and highlighted.
  • Added clear information about item details, pricing, and delivery.
  • Using carrousel wheel to bring the content forward and more visible to the user. More information about each wine in the case was added using visual elements from other pages, making it more legible and understandable.

Your basket

  • Page layout was redesigned to give each section its own space.
  • Improved the pricing details for each product and clarified the specific contents included with each product.
  • Buttons were redesigned to make them clearly stand out from the main CTA button.

Final design suggestion

Client feedback

We had the opportunity to give a client presentation to the Virgin Wines in Norwich. The design recommendations were taken into consideration by Virgin Wines as part of their own redevelopment work on the recruitment flow. As of now, Virgin Wines are working on a redesign of their website and the impact of our work is not yet known.