Role: Full UX Design End to End
Duration: April 2024 (4 weeks)
Process Deck 🚧
Mountain
WINERY
the
Client: Mountain Winery
Contributer(s): Tyler Gustafson
DISCLAIMER: While Mountain Winery is a real business in the Bay Area please note that this project was completed to showcase my skills and how I might approach this case. Mountain Winery did not employ me during this engagement, but I have to say its one of the coolest places in South Bay!
Product Vision
In my latest project, I am thrilled to present the Mountain Winery Loyalty App, a transformative platform designed to redefine how visitors experience the winery and its vibrant event offerings. Developed for the Mountain Winery, an iconic event center and music venue known for its lively atmosphere and scenic beauty, this app aims to enrich user engagement through a seamless and personalized journey.
Our goal with this app is to optimize interactions between the venue and its patrons, offering exclusive member benefits and fostering a deeper connection. By simplifying the process of discovering activities with a simplified view, we've made it easier for guests to find concerts, events, and wine-tasting experiences that suit their preferences. My vision is to provide a platform that helps guests explore the winery's full spectrum of offerings, all while building a strong community of loyal patrons!
User Pain Points
1
Why not just go to Napa?
In my research I discovered that many users were not aware that Mountain Winery had events or was a "fun" place to visit and instead opt for Napa or Sonoma for special experiences
2
Overwhelming Choices
Users often find themselves overwhelmed by the vast array of event options and struggles to decide which would be the most enjoyable for them and their friends
4
Limited connection Outside Concerts
Users actively share and reviews their experiences online, but they look for more engaging ways to connect with the venue and build a community
3
High Costs /
Scalpers
The pressure of last-minute decisions not only affects seat selection but frequently results in higher expenses, diminishing the overall value of the event
See the FULL design process
UNDERSTANDING
THE USER
-
User Research
-
Empathy Maps
-
User Journeys
-
Value Statements
User Research
Thanks for choosing the full design path! While the final design is always cool and interesting to look at, no one will ever use it if it doesn't align with the user's needs! This is the most critical step and it's crucial to remain empathetic and place users at the heart of the design process.
For this project, I drew on personal experiences and conducted interviews with several friends. However, in a full-scale implementation, a more thorough approach would be used to establish a comprehensive research base to better understand the customer. In this instance, the research process was condensed for practice purposes. For a detailed overview of the typical methodology I would employ, please refer to the following link: [🚧 link 🚧].
Empathy Maps
Empathy maps are vital because they can distill our user research findings into actionable insights, capturing what users say, think, do, and feel. In our case, we have already begun to see pain points such as the hassle of using multiple websites to book tickets, difficulty deciding on events, and even a potential brand awareness issue!
This is a great tool when starting the journey to understand the user. Next, these insights can help in creating accurate user personas, providing a deeper understanding of user needs and motivations before designing the product.
User Personas
Meet Emily and John, two personas we've developed from our research to create a better sense of empathy for our users when developing our customer loyalty app for Mountain Winery + Music Venue. These personas embody the diverse needs and preferences of Moutain Winery's current and potential guests, guiding us in creating a more engaging and personalized user experience.
Through Emily and John, we aim to deepen our understanding of our audience, ensuring that our app effectively meets the expectations of all visitors to Mountain Winery. Below is an overview of these personas:
SCroll Through
Based on these personas and insights, we can craft user stories that are essential for shaping product design. These stories will guide the development process and act as a checklist to make sure we're tackling the right issues for our users.
As an avid event-goer, I want to experience concerts and exclusive events that are affordable, so that I can share unique experiences (in person and on social media) with New friends and Old - Emily
As a DUDE living in the Bay Area, I want to participate in engaging and diverse activities, so that I can create memorable experiences and strengthen friendships. - John
From here we can take a closer look at their journeys and what emotions they might experience throughout them. This exercise is great for thinking through the frustrations of the user and what we can do to improve upon or surprise them with unexpected solutions. Below you will see an example of Emily's journey in detail:
Emily's User Journey
Emily has had a generally good experience, but there are some areas where we can improve such as a simplified view of our events or giving her more opportunities to engage with Mountain Winery and build a community. While Emily's experience focuses on enhancing her current activities, John's journey presents several pain points that offer opportunities for significant improvements. Below is an overview of his user journey:
John's User Journey
Okay, John's path is a little rough, let's do a double click into his journey to better understand his experience...
Sounds like John could have benefited from some personalization and simplification of the process of attending an MW event. These exercises have helped us start to empathize with our users, let's take a shot at summarizing their frustrations.
User Pain Points
1
Why not just go to Napa?
In our research we discovered that many users were not aware that Mountain Winery had events or was a "fun" place to visit and instead opt for Napa or Sonoma for special experiences
2
Overwhelming Choices
Users often find themselves overwhelmed by the vast array of event options and struggles to decide which would be the most enjoyable for them and their friends
4
Limited connection Outside Concerts
Users actively share and reviews their experiences online, but they look for more engaging ways to connect with the venue and build a community
3
High Costs /
Scalpers
The pressure of last-minute decisions not only affects seat selection but frequently results in higher expenses, diminishing the overall value of the event
Value Proposition
After identifying the above user pain points with our user research, we can begin thinking about the potential benefits of our product that can help solve these user frustrations.
This consisted of spending time jotting down a preliminary brainstorm to explore potential features for a Mountain Winery App (roughly represented to the right). This is a crucial step to ensure that our product provides solutions that are closely aligned with the specific needs and problems faced by users.
After our brainstorming we can group these benefits into our own value proposition consisting of four fundamental categories:
-
Promote MW & Boost Fun Appeal: Offer personalized event recommendations and exclusive member experiences based on user preferences, past attendance, and loyalty status level
-
Simplify the Search Process: Streamline finding and booking events with user-friendly search tools and personalized recs.
-
Opportunities for Cost Savings: Deliver exclusive discounts, membership pre-sale, loyalty rewards, and special promotions to keep offerings affordable for frequent attendees.
-
Build Community Engagement: Build a community of event-goers who can share experiences, reviews, and connect over shared interests.
Preliminary
Design
-
User Flows
-
Information Architecture
-
Wireframes (paper + Digital)
-
Lo-fi Prototypes
User Flows
The first step to begin the design process for Mountain Winery was to develop an understanding of the potential user flow. The user flow is the path a user takes through a product, starting from the initial entry point up to the final interaction or goal completion.
This path is mapped out to show the sequence of steps a user follows in accomplishing a specific task or achieving a desired outcome within the product. Understanding and designing effective user flows are essential for creating intuitive, user-friendly experiences. Below is an example of what the user flow would look like for a Mountain Winery app.
In this case, we see several different pages that the user can interact with in the MW app. Looking for similar areas that might be able to be grouped together we can see that we could potentially simplify the organize by say moving my events into the member page
Information Architecture
Now that we have a better understanding of user flows we can apply this knowledge to build our Information Architecture (IA). From these flows we can structure our architecture around three keep components or pages:
1) Home Page 2) Member Profile 3) Community Page
The original intent of this structure was to simplify the user experience by keeping the highest priority things a user needs in their member profile and then the home page can be used for booking. We will see why a slightly different approach was taken when we got to the wireframe stage.
Information architecture is critical for several reasons:
-
Organizes and defines structure for app
-
Provides a high-level view for planning
-
Helps engineers understand how to organize the data
A well-designed information architecture facilitates quicker and more intuitive access. It is an essential part of any design process. From here we finally can begin sketching out our app! We do this through paper and digital wireframes.
Original Wireframes
(Paper + digital)
Home Page
Profile Page
Community Page
Okay confession, our users hated how these original digital wireframes turned out. After I finished the designs I evaluated them against both our user research, personas and did some usability testing with users. The feedback was it really felt like the designs were missing on most of the user pain points.
I shared these wireframes above because I think it's important to emphasize that all designers need to remember that no matter how experienced they are it is easy to get caught up designing based on what YOU know and what already exists. This leads to a product that isn't empathizing with its users or truly solving their problems. It's critical that we continue to revisit and use our user research and be comfortable with the importance of iteration in the design process.
Below is a quick evaluation of these original designs before going through the process of revamping them:
Why not just go to Napa?
Overwhelming Choices
High Costs / Scalpers
Limited connection Outside Concerts
How'd the design do?
Not great🥱
Could be improved 🫤
Fine 🤔
A lot of opportunity 😐
General Assessment
-
The wireframe doesn’t really help MW stand out. It feels very standard and stale
-
There’s nothing special in the structure of it that addresses the needs the users are looking for
-
Immediately when the user lands on the home page they are faced with a ton of options: Do they look at the recs? The calendar? Or EVERY event? This view is too much
-
The app does an okay job with this with a built-in notification icon and the calendar gives some notice of upcoming events, however, this could all be improved to make it less effort driven by the user
-
I would rate this pretty poor. The community page has a very typical message board feel that really doesn’t encourage user engagement. Big miss on the user needs here
Potential Fixes
-
Redesign to align to a fresh branding (relaxed, fun, unique experiences)
-
Further build out member status structure so people want to come back, attend different events and stay engaged
-
Move all the search functions to its own page and simplify the landing page
-
When a user enters the app, it should feel relaxed. Maybe only a couple tailored recommendations
-
Build in features that help drive awareness for members (i.e. develop a members only ticket release in a “just announced concert section”)
-
Member “presale” party when the concert series schedule is released for the summer
-
Revamp the community page to be Groups focused (i.e. MW bike club) that can plan events, and message each other
-
Create a simple member feedback place (i.e. how was an event? What weekday events would they like to see?)
Updated Wireframes
Now that we have evaluated our initial wireframes we can put a little bit of reengineering into them and come up with updated digital wireframes that ensure a better user experience by focusing on our user personas and needs. Below you find a reimagined view of our three original pages.
Click Through
Home Page
Profile Pages
Community Page
A simplified landing page for users that doesn't overwhelm them. The user is greeted and provided with a few tailored recommendations they can leisurely swipe through.
A revisioned membership page that focuses on exciting the user about their interactions with the venue, perks for their status level and upcoming member events
The community landing page provides a way to quickly gather member feedback. In addition, a revamped approach to groups lets users connect and build communities at MW
In addition to these original pages, two pages were added in order to minimize the information "overload" during the user experience: My Events and Explore. Please check out these designs below:
My Events
Explore
Click Through
The my events page is a centeralized place for users to manage their events and reveiw past events. The "day of view" is an execellent opportunity for MW to go over the top on exceeding expectations and delighting users whenever they attend MW
The explore tab was added to help with planning. The intent of the design is to keep the functionality to find whatever event you want but simplify it in a way that doesn't feel exhausting.
LoFi Prototype
Now that we have our wireframes we can begin thinking about how a user will navigate through the app and build those connections in a low fidelity prototype. While none of the coding has been done behind the scenes yet this is an excellent way to bring ideas to users and test them before rolling them out to all customers. Below is the initial lo-fi prototype of the Mountain Winery app.
WATCH BELOW
Simplified Process
Personalized Recs
Day of Engagement
Member Rewards
Community Groups
FINAL DESIGN
Mountain
WINERY
the
