ALESSANDRO MOTTA
How can we create an engaging wine shopping experience
that educates users about their taste?
ROLE
Product Designer
UX Designer
Timeline
Skills
February - June 2024
Interaction Design
Visual Design
Design Systems
User Research
Tools
Figma
PROJECT OVERVIEW
As part of the development team, my role involves collaborating with cross-functional teams (including engineering, product management, and user research) to refine the platform’s user experience and ensure it meets industry standards. This project is a crucial part of our roadmap to help local suppliers scale their digital capabilities.
WNO is an online wine marketplace designed to meet the immediate need for same-day wine delivery. The product focuses on simplifying the process for consumers to discover and purchase the perfect wine to pair with their meals, all delivered right to their door on the same day.
Table of contents
01
Problem statement and design goals;
02
Competitive Analysis and User Interviews results;
03
Identify User Personas and Use Cases;
04
UI Ideation and Prototyping;
05
Final appearance and features.
01
motivation
In today’s fast-paced society, it’s easy to leave small decisions to chance, especially when life gets busy.
Choosing the right wine, however, can transform a meal and elevate social interactions, making it an often overlooked skill.
But making an educated choice about how to pair a delicious beef stew with a red wine that does not give you a headache, it’s hard.
THE EMERGING PROBLEM
There are already many tools available online
that help users in selecting wine.
Yet many remain underutilized and relatively unknown. While apps like Vivino offer expansive wine databases, they are primarily used for gathering information rather than purchasing new options. Only a small percentage of users take advantage of these apps to actually buy wine, highlighting the gap between discovery tools and practical purchasing solutions.
Thus, we set a GOAL:
Create an engaging same-day-delivery shopping experience that educates users about wine, boosts their confidence in making informed decisions, and fosters a deeper passion for wine and winemaking as a valuable conversational skill.
02
UNDERSTAND
IT BEGAN WITH RESEARCH
1/ COMPETITIVE ANALYSIS
I audited 3 different wine-related apps to understand existing patterns, interactions and interfaces during the research process.
2/ USER INTERVIEWS
To address that, I conducted online and offline surveys, interviews, to understand customers shopping behavior. To confirm the results,
I also interviewed 54 wine shop owners to identify what are the most redundant requests from customers.
COMPETITIVE ANALYSIS
HOW DO PEOPLE BUY WINE ONLINE?
I sought to better understand the mechanics of existing alternatives through a competitive audit of 3 wine-related apps. Each app serves a unique purpose for researching a purchasing, which means unique approaches to how they imagine customer journeys. I started by breaking down these different purposes...
A peek at how shopping looks like...
VIVINO
WINE.COM
WINE SEARCHER
Research concluded that...
In all three major WNO competitors, the purchasing process is not streamlined, making it challenging for users to complete transactions easily. There is a common lack of consistency throughout the customer journey, which detracts from a personalized, reliable, and efficient experience.
The UI across the platforms prioritizes wine consultation over the purchase journey, making it feel secondary.
Unlike its competitors, WNO places the shopping experience at the forefront while still maintaining its role as a consultant.
It provides tailored recommendations for users based on their preferences, pairing suggestions, and budget, balancing between facilitating purchases and offering personalized guidance.
Create engaging UI, taking advantage of Artificial Intelligence and create affiliation with the platform.
Talking to the people
USER INTERVIEW
To design a user-centric product, I conducted 112 online and offline surveys to understand customers shopping behavior. To confirm the results, I also interviewed 54 wine shop owners to identify what are the most redundant requests customers make when they need assistance during the purchase.
This process gave me an initial idea of the main factor involved when shopping for wine resulting in,
63%
PRICE
9.5%
PAIRING
15.3%
RE-PURCHASE
8%
NOTORIETY
4.2%
ATTRIBUTES
Research concluded that,
For the average customer the price has a higher drive than the quality of the product itself. This results in cheaper and less qualitative wines having the biggest market share, lower users perception of quality and penalizing smaller winemakers that made that quality the motif behind their wines.
Therefore, users lack of skills and knowledge that would allow them to make an educated choice in the process of buying wine based on their taste, making the price the main feature involved in the shopping experience.
03
identify & synthesize
Identifying Core Product Experiences
PRODUCT PRINCIPLES
After reviewing the research findings and better understanding the competitive landscape, I generated a set of product principles to help guide the direction of the product experience.
🧩 EASE OF ACCESS
🧠 MUSCLE MEMORY
🌊 FLUIDITY
Provide an intuitive shopping experience that incentivize users to engage more with the platform
Keep users coming back to using expressive features, and help them feel confident using them
Interacts with the pairing food experiences while reducing steps without adding friction
Identifying Scenarios
PRODUCT USE CASES
Next, to probe into how the purchasing will fit into WNO ecosystem specifically, I brainstormed different types of use cases that could best serve our target user. This distinction will help us understand what kinds of features we need to design for.
🥘 FOOD PAIRING
Provide an intuitive shopping experience that incentivize users to engage more with the platform
The system will identify the most accurate flavor profile for the food entry, providing a comprehensive breakdown for optimal wine pairing.
🍷 WINE RESEARCH
Keep users coming back to using expressive features, and help them feel confident using them
Examples include searching for type of grape, year of crop, nationality and winemaking method.
📚 BOOSTING KNOWLEDGE
Interacts with the pairing food experiences while reducing steps without adding friction
To develop an effective use case for users engaging with the product for learning, the app will track shopping behavior, offering insights into taste development and tailored suggestions based on that data.
Identifying Users
USER PERSONAS
Finally, to better understand how specific features will solve specific problems, I identified 3 main User Personas:
1/ User Persona: Newbie
Someone who knows little to anything about wine.
Pain Points & Solutions
🤔 PAIRING DILEMMA
Difficulty pairing wine with food
AI pairing tool with an explanation of the pairing process
📖 WINE KNOWLEDGE GAP
Lack of understanding of the differences between wines
Wine comparison tool
💰 BUDGET FRIENDLY OPTIONS
Finding quality wines without overspending
Ranking system with added insights when the user explores a higher-priced wine.
2/ User Persona: LEARNER
Someone who has interest on wine and tries to run the extra mile when it comes to pick a wine
Pain Points & Solutions
🧐 DEFINE TASTE
The user started to try different options
and is trying to identify their taste
Track choice behavior / give users tailored recommendations based on their previous purchases / My cellar feature
📚 ONGOING LEARNING
They need to keep learning and get value from the platform
Have complete descriptions for each wine / include a game section
👥 NETWORKING
Networking with other learners
Possibility to interact with other users directly in-app to share their experience
3/ User Persona: GURU
Someone who has significant understanding of their taste and makes educated choices
Pain Points & Solutions
🕵️ EXPLORATION
The user experienced user wants to research wine with a specific query
Advanced search feature to research under different criteria (grape, vintage, aging, nationality)
🏪 TRUSTED RETAILERS
The experienced user needs to find trustworthy retailers or they won’t finalize the purchase
Locate nearby retailers using geolocation
🎯 ACCURACY
The search engine and the database must be complete and must find all the wines researched
Implement a detailed tagging system to offer relevant search results and propose coherent alternatives.
04
IDEATION
Reflecting on Research
HOW SHOULD WE GUIDE OUR IDEATION?
In the competitive audit done in the Understand phase, the following questions were asked for each app’s UX system analysis. While beginning my explorative ideation phase, I kept these questions in mind to ensure that my designs aligned well to the project's goals.
How smooth is the transition from pairing to purchasing?
AWARENESS & ACCESS 🧠
How can I learn & remember how to use features?
EDUCATION & MEMORY 📕
How does using features feel when I’m trying to buy a product?
FLUIDITY 🌊
UI Ideation
HYPOTHESIZING THE DESIGNS
Keeping the above questions in mind, the next phase focused on exploring a wide variety of new approaches to creating an effective product experience. I generated ideas in 3 "buckets that lay the foundation of pairing, learning and fluidity and evaluated each bucket on a set of metrics that each address the three product principles above, in order to land on the best option.
BUCKET #1: PAIRING
First, let's take a look the different variations of the pairing research tool.
Option 1
Top bar with
related products
SIZE
Option 1
🟢 — Takes 1/3 of the
homepage
, not invasive
Option 2
Two paths: search on the top right or categorization
DISCOVERABILITY
🟢 — The search bar is easy to identify
Option 2
🔴 — Small / Corner anchor
🟡 — Search feature lays in a separate section / neat but counterintuitive
Option 3
🟡 — Full page / Intuitive / Possibly overwhelming
🟢 — Easy to find at launch
Option 3
Full Page UI
AFFORDANCE
🟡 — The pairing feature looks secondary and suggest to search for wine
🟢 — The pairing feature has a full section that allows 2 ways to pair wine
🟢 — Highly intuitive / the purpose of the search bar is clearly highlighted
BUCKET #2: LEARNING
Next, I explored how informative are the product pages focusing on how the layout can improve the way the informations are conveyed.
Option 1
4x2
Option 2
2x2
INFORMATIVE
SCROLLABILITY
Option 1
🟡 — Do not provide enough informations
🔴 — Does not incentivize the user to scroll further down
Option 2
🟢 — Well paced / Wide range of informations provided
🟢 —The placement makes the user scroll further
Option 3
🟢 — Plenty of informations
displayed
🟢 — The placement makes the user scroll further
Option 3
2x4 with dropdown
READABILITY
🟢 — The layout is wide and tidy / Readability enhanced
🟢 — Layout is less wide but informations are better organized
🟡 — Harder to read / overwhelming
BUCKET #3: FLUIDITY
Finally, I explored what was the best layout for the home screen focusing on how to make the user aware of the main WNO features and get them there.
Option 1
side by side button
Option 2
search bar
AWARENESS
ACTIONABLE
Option 1
🟢 — Pathways are clearly laid out
🟢 - Elements are positioned to be reached with one hand use
Option 2
🟡 — Search bar is immediate
but pairing becomes secondary
🟢 — Elements are positioned to be reached with one hand use
Option 3
🟡 — Stacked logic is less immediate
🟡 — Buttons are too wide and it’s not clear right away the action to perform
Option 3
wide stacked buttons
NON INTRUSIVE
🟢 — No significant obstacles
🟢 — No significant obstacles
🟢 — No significant obstacles
05
EXECUTION
Here's how the pairing flow looks like to the user!
Once paired, users can seamlessly browse available options at nearby wine stores, complete their purchase, and enjoy swift delivery within minutes.
Easy, right?
Once users begin the pairing process, they are guided through a streamlined, mono-directional UI designed to create a lightweight and engaging experience.
I learned from UXR that people need to receive recommendations in ways that
feel natural and personalized to them 🌱
