At Virgin Wines, working with a team of six we provided design recommendations and enhancements for their Wine Bank recruitment user journey on their websites. While collaborating on the desktop version, my classmate and I focused on designing the mobile website.
View Prototype
UX Designer (Mobile)
Mar 2023 - May 2023
Team
Competitor Analysis, User Story Mapping, Heuristic Analysis, User Flows, Wireframing, Prototyping, Usability Testing.
Reduce 6 Step Voucher Flow
Current journey has too many opportunities to drop out.
Improve Converted Customer Rate
To optimise every pixel to create a more streamlined experience.
Improve Mobile Experience
Mobile traffic isn’t as well catered for as it should be.
Inject More Virgin Branding
Customers need to understand they are joining Virgin Wines / WineBank which is a Virgin Wines subscription.
Before jumping in we wanted to connect the customer problems with the business goals.
During this phase we analysed each step in their Voucher Redemption flow. Methods used: Customer Reviews, User Testing, Heuristic Analysis, and Customer Journey Map
Customer Reviews
There was a common issue which customers were stating on their reviews. This was “I did not know what I was signing up to”. To find out more of this, we conducted some user tests.
User Testing
Through hands-on user testing we identified the general design issues for both desktop and mobile. Additionally, we also looked at the content they liked and what they thought was not useful. The majority of issues resulted around the copy, however a big issue for mobile was a lot of inconsistent layout and too much text.
Heuristic Analysis
With the information we gained from our hands-on user testing, we moved this into a Heuristic Analysis using the Heuristic principles as a reference. This helped us identify the points where there was an opportunity for a user to most likely drop out.
Heuristics that needed the most attention were: Aesthetic and minimalist design, Visibility of system status, and Consistency and standards.
Customer Journey Map
The customer journey map allowed us to identify there was a problem with their information hierarchy. Each page has a completely different amount of content. They need to create a consistent layout and structure for each page so that the most important information is most apparent to the user.
Competitor Analysis
We completed competitor analysis for both Desktop and Mobile. We found the average flow was 3-4 steps long. 2 Companies we specifically liked were Netflix, Gusto, and Tesco due to their simple flow and design.
Before jumping in we wanted to connect the customer problems with the business goals.
During this phase we analysed each step in their Voucher Redemption flow. Methods used: Customer Reviews, User Testing, Heuristic Analysis, and Customer Journey Map
Customer Reviews
There was a common issue which customers were stating on their reviews. This was “I did not know what I was signing up to”. To find out more of this, we conducted some user tests.
User Testing
Through hands-on user testing we identified the general design issues for both desktop and mobile. Additionally, we also looked at the content they liked and what they thought was not useful. The majority of issues resulted around the copy, however a big issue for mobile was a lot of inconsistent layout and too much text.
Heuristic Analysis
With the information we gained from our hands-on user testing, we moved this into a Heuristic Analysis using the Heuristic principles as a reference. This helped us identify the points where there was an opportunity for a user to most likely drop out.
Heuristics that needed the most attention were: Aesthetic and minimalist design, Visibility of system status, and Consistency and standards.
Customer Journey Map
The customer journey map allowed us to identify there was a problem with their information hierarchy. Each page has a completely different amount of content. They need to create a consistent layout and structure for each page so that the most important information is most apparent to the user.
Competitor Analysis
We completed competitor analysis for both Desktop and Mobile. We found the average flow was 3-4 steps long. 2 Companies we specifically liked were Netflix, Gusto, and Tesco due to their simple flow and design.
Now gathering our initial research, we connected them to the business goals to define the problems we need to solve.
Too many opportunities to drop out
Too much copy with confusing terminology
The mobile design is inconsistent and not user-friendly
Reduce the process to 3 - 4 steps
Simple copy and aesthetically pleasing (some negative reviews were due to a lack of awareness of what they were signing up for)
Improved mobile design through layout, functionality, and appearance
Adding a social proof to improve conversion rates by 15%
We focused on the Mobile first due to its restrictions.
During this phase we firstly we wanted to look at what other services did to identify which unique selling points Virgin Wines had that could be used that other brands didn't offer. After we ideated solutions and ideated the best way a user should redeem a voucher and compelte the flow.
Methods used: Competitor Reviews, User Flows, User Tests
The Original Flow
The original flow started with a external webpage where the user could redeem their voucher. Once redeemed they then were redirected to the actual website where they could then use their voucher.
Redeeming The Voucher
After comparing competitors and analysing Virgin Wine’s flow. We ideated different flows a user could take. We came to the conclusion of having a 3 step flow. Landing Page - Product Page - Basket Page. Each idea for the flow is very similar however we ideated different ways a user could claim their voucher. To find the best solution we completed some low fidelity user tests of the entire flow..
Low Fidelity - Redemption Ideas
User Test Feedback
After user testing we concluded on using the CTA on a landing page as the main flow as we received the best feedback from our users. Good use of a landing page will improve conversion rates by 14%.
We focused on the Mobile first due to its restrictions.
During this phase we firstly we wanted to look at what other services did to identify which unique selling points Virgin Wines had that could be used that other brands didn't offer. After we ideated solutions and ideated the best way a user should redeem a voucher and compelte the flow.
Methods used: Competitor Reviews, User Flows, User Tests
The Original Flow
The original flow started with a external webpage where the user could redeem their voucher. Once redeemed they then were redirected to the actual website where they could then use their voucher.
Redeeming the Voucher
After comparing competitors and analysing Virgin Wine’s flow. We ideated different flows a user could take. We came to the conclusion of having a 3 step flow. Landing Page - Product Page - Basket Page. Each idea for the flow is very similar however we ideated different ways a user could claim their voucher. To find the best solution we completed some low fidelity user tests of the entire flow..
Low Fidelity - Redemption Ideas
User Test Feedback
After user testing we concluded on using the CTA on a landing page as the main flow as we received the best feedback from our users. Good use of a landing page will improve conversion rates by 14%.
Reducing the Copy
A big issue customers stated was the confusing terminology and lack of awareness. This is because they have large paragraphs and user’s will only scan this. Therefore, our main priority was reducing the length of text to its key points.
What's in the box?
During our user tests, users complained about the length of the product page. There were 13 bottles of wine in a box and so this meant the page was extremely long and annoying for users to navigate.
Product - Add on page
To reduce the 6 step flow, we removed an entire page which was their add ons page. They had an add on page before the basket page, to smoothen out the process of the flow we changed this to a section on the basket page.
Social Proofing
During our competitor reviews we found a massive feature Virgin Wine’s did not include was social proofing. This feature is important for companies because 92% of consumers feel hesitant to buy when there are no customer reviews available.
Reducing the Copy
A big issue customers stated was the confusing terminology and lack of awareness. This is because they have large paragraphs and user’s will only scan this. Therefore, our main priority was reducing the length of text to its key points.
What's in the box?
During our user tests, users complained about the length of the product page. There were 13 bottles of wine in a box and so this meant the page was extremely long and annoying for users to navigate.
Product - Add on page
To reduce the 6 step flow, we removed an entire page which was their add ons page. They had an add on page before the basket page, to smoothen out the process of the flow we changed this to a section on the basket page.
Social Proofing
During our competitor reviews we found a massive feature Virgin Wine’s did not include was social proofing. This feature is important for companies because 92% of consumers feel hesitant to buy when there are no customer reviews available.
We presented as a group to the board of Virgin Wines, this included Jay Wright – CEO, Jon Shannon – Commercial Director, Stuart Brown – Head of E-commerce and lastly Rheanne Smith – Head of Partnerships. They were very happy and supportive of what we had designed. I am very pleased to say that they loved my mobile design due to how "Simple, crisp and clean it looked" and "It feels so easy to use the website on mobile phones". I am very pleased with the group because of how we presented the work, it was like a conversation and we were just explaining what we did and why.
A fishing lake website re-design to make it modern, easier to understand, suitable to the client's needs, and overall improve the user’s experience.
See More
Keep In Touch:
