K & L Wine Merchants - Redesign
Project Background
Since 1976 K&L Wine Merchants have been proudly offering the world's finest wines, great service, and competitive prices. They offer thousands of wines on this site with inventory updates happening in real-time. In addition, They operate three retail stores, in San Francisco, Redwood City, and Hollywood, California.
They offer highly rated wines from around the world. Additionally, They seek out little known wines from hot new wineries and find super values for our customers. Because they are located in Northern California in close proximity to many of the famous properties, they've established many relationships with these wineries and can buy in quantities that allow them to offer their wines at prices that are often below the wholesale cost of other stores.
Tools
Figma, Photoshop, InVision
Role
UI/UX Designer
Project Duration
2 weeks
High-Level Design Goals & Objectives
Redesign the responsive website of K&L Wine Merchants.
Develop or extend coherent branding that aligns with the shop’s current and desired clientele and customer experience.
Brand Message and Value
The ethos of K&L is a great selection of wine and spirits for a reasonable price. Anyone who likes to shop in a curated setting but doesn’t want to overpay would be their desired audiences.
People find out about the store through word of mouth (recommendations from people, Reddit, search for a specific brand of wine..etc) and there is a good amount of foot traffic (I can only attest to the Hollywood location)
It seems like they offer real-time inventory online so the website will offer all the products online.
Most of the people visit the site and store to either casually shop for wine or come in with a specific drink to buy in mind. The website needs to have information more accessible and easy to find.
Redesigning the site will help organize the information hierarchy and make the information more digestible to broader audiences.
Empathize
Research Goal
Discover who the ideal customer for K&L is and understand their needs when ordering products to optimize their digital purchasing experience
Methodologies
Secondary Research Findings
Since the late ‘90s, wine sales in the U.S. have steadily increased. And according to research by the Wine Institute, the U.S. has been the highest consumer of wine in the world since 2014.
In 2017, online sales of beer, liquor, and wine increased by more than ⅓ year-over-year (YoY). Wine was the most popular kind of alcohol, accounting for 65% of those sales.
Wine e-commerce website should tell the story of your brand and invite customers to become part of your community.
Market research showed that a large portion of users were open to exploring and wanted to learn more about wine.
The research found that most hesitation in buying alcohol online is the inability to closely inspect bottles and also a lack of detail or information online.
Competitive Analysis Findings
Provide Intuitive Navigation
Simplify your navigation menu but provide a descriptive menu labels
Prominent calls to action and, above all, ensure that your pages are no more than four clicks away from the homepage
The best way to help users find what they want based on different preferences is with filters
Create Product Pages that Convert
Product images: Make sure your images blend well with your site’s color palette and keep them consistent.
Product information: Tell your customers everything they need to know about the product to help them make informed decisions
Make your Checkout Processes User-Friendly
- Don’t force them to register
- Be open about your shipping costs
User experiences are critical for your online store’s performance. They drive loyalty, inspire conversions, and encourage customers to share a positive word of mouth about you.
Survey Findings
15 people participated in the survey with age 26-35 being 80%, 36-45 being 13%, and 21-25 being 7%
Average purchase per month was 3-4 bottles with average price of $20
Majority of the participants buy combination of new and familiar wines (73% of the surveyors buy combination of new and same wines, 20% buy familiar wines, and only 7% buy unfamiliar wines)
Majority of them usually purchase wine at wholesale stores or grocery stores that shows they are most likely drawn to the price and convenience those stores offer
When they do purchase wines online it is from instagram ads, buy online pick up at store (or delivered) and wine.com
The hesitation of buying online is not as convenient, mistrust of shipping, and cost.
Synthesize
Provisional Personas
The Adventurous
Goals
Gain knowledge
Find good price range & flavor
Reliable source of recommendation
Pains
Expenses
Risk of getting something disappointing
Not having enough knowledge
The Wine Lover
Goals
Discover new flavors
Improve wine knowledge
Quality over quantity
Collect rare wines
Pains
Too many product choices
Finding new wines that are not disappointing
Getting reliable recommendations
User Persona
Design
Sitemap
Combining the research, and user persona I used the information to optimize the navigation, categories and product search so that users are exposed to different discovery paths to find new products. When buying wines, the users need to rely on other senses since they can’t taste test them, so it’s important to elevate the brand when trying to sell the product.
User Journey Map
Exploring user flow of the Persona I created with assumptions and hypotheses on the decisions.
Point of entry through searching subject wine shop on Google
Deliberations
Search behaviors
Decision making on selections
Use of Sorting and Filters
Scenario 1: Joy is having a dinner party and wants to purchase wine. She has no idea what to get and wants to see what recommendations they have. She goes into her local wineshop website.
Scenario 2: Joy has an idea of kind of wine, price range and region in mind but does not have a specific wine in mind. She goes into her local wineshop website to shop around.
Wireframe
After all the features and prioritizing solutions to the issues I found during research, I started wireframing the ideas on how to improve the current site. This helped to see how my ideas would look on a final page.
Branding
Style Tile
Branding was evolved around keeping the current logo and primary burgundy color but elevating the aesthetic. This dictated the complimentary color palette as well as choosing the typography to keep things cohesive and clean so the focus is on the product.
UI Kit
K&L Wine Merchants offers some of the largest and best selections with competitive pricing. I wanted to transfer the catered feel you get from the brick and mortar stores into their e-commerce platform space. The focus became reducing complexity and encouraging particular discovery paths with a clear navigation.
Design
Hi-Fi Prototype
Navigation
The previous navigation was unbalanced with overloaded options and categories. I pared it down based on popular varietals and provided some alternative product finding paths such as search bar and discovery.
Search Results
The best way to help users find what they want based on different preferences is with filters. I designed a top filter that would remain sticky so the filter and sorting are available at all times to help with product discovery. Moving away from existing list view of the result page I went with a grid view by only keeping the winery, year and name of the bottle, price and ratings. The informations are displayed to help customers and lead them to their desired purchase.
Product Detail
In my research, I found that most hesitation in buying alcohol online was the inability to closely inspect bottles and also a lack of detail or information online. It was imperative to design a product detail page with a beautiful image of the bottle, the inclusion of ratings from wine experts, and having icons for easy access to predominant information. The copy is organized and separated with tabs to helps the user to navigate through the page with ease.
New Product Feed and Checkout
One of the most important feature in K&L is their real- time inventory updates on the thousands of wines they offer. Current site just use their back end inventory system to inform the users. I wanted to elevate the page to be more consistent with the brand style.
The checkout page is updated to be more transparent with shipping and show the curbside pickup options which has been a huge help during the pandemic.
Mobile Friendly
K&L site is not currently responsive and needed to update the mobile experience. I wanted to make sure the desktop to mobile experience is seamless and cohesive. Since more and more purchases are completed through mobile, it was important for the mobile site to have easy navigation and clear CTAs to guide users to complete a purchase.
Conclusion
Since the late ‘90s, wine sales in the U.S. have steadily increased. And according to research by the Wine Institute, the U.S. has been the highest consumer of wine in the world since 2014. While you can buy alcohol in K&L stationary stores, I wanted to explore the online market and design an experience that is closer to what they offer in store. I want to provide a space that is simple to navigate, expand user knowledge, excitement and discovery of new wines and other alcohols, as well as help them make the right decision for their needs. By crafting a specific persona based on a market research and survey, I designed a whole experience spanning the physical and online touch points that would support persona the whole way through their purchase.