Project Overview
Challenge
The Austin Food & Wine Festival is an annual three-day event filled with delicious food, wine tasting, celebrity guest chefs, and more! We were asked to redesign the mobile experience for festival goers while they were at the festival as well as highlight their non-profit organization partnership.
Role
UX/UI Designer
Team
Kevin Chong, Ansel Fok
Duration
2-week design sprint (est. 85 hrs)
UX Methods
Heuristic Evaluations, C&C Analysis, User Surveys, User Interviews, Task Analysis, Persona, User Flows
Sketching, Wireframing, Usability Testing, Prototyping, Visual Design
Tools
Figma, Trello, Whimsical, Slack, Pen & Paper, Zoom
Design Process
Research
Research Plan
My team and I conducted research because we wanted to get deeper insights on what a typical music or food festival goer experienced as well as identify the potential drop off points of the current website (mobile and desktop).
My Initial Assumptions
Festival goers want to go to Austin Food & Wine Festival to try new foods and experience live events
They use the mobile website at the festival to check updates of the event
They do their research before buying an expensive festival ticket
Research Methodologies
Secondary Research (Competitive and Comparative Research + Heuristic Evaluation)
Primary Research (User Surveys + User Interviews)
Competitive Research
We conducted competitive research specifically a pluses and deltas analysis of 4 direct competitors of the Austin Food & Wine Festival. The competitors were food and wine festivals that occurred nationwide. The competitive analysis informed our understanding of what the industry standards and standard features for food and wine festivals.
User Surveys
Our team sent out a screener survey to learn about the typical festival experience and 24 users completed our survey. The survey helped us choose interviewees who best fit our target user criteria.
Example Questions:
Are you a self- proclaimed foodie?
What cooking shows do you watch?
In the past 3 years, how many food festivals have you attended?
User Interviews
Based on the screener survey, my teammates and I chose four users from the screener survey who fit the user criteria. My team and I then did 1-on-1 user user interviews and task analyses with the users. We asked non-leading questions specifically to learn about their past experience at any type of festivals, what they do at the festival, and how they found out about the festival.
Example Questions:
Tell me about the last time you attended any festival or event.
What are the things you look for when you are looking for a food related event?
Do you ever use your phone at an event? If so, how?
Task Analysis
We asked our 4 users to complete three tasks to test the validity of the original website.
Tasks:
Find the age requirement for entry
Find details about the Austin Food & Wine Alliance
Find a list of the top restaurants and chefs
Research Analysis
Due to time constraints, we rapidly analyzed our research by discussing our key insights and behavioral patterns from each user interviews. We found four key insights that we learned from our users and used as principles to design our prototype.
Be updated on social media
Everyone reported that they use social media (Instagram, Facebook, etc..) to buy festival tickets and be updated with any new information. They also used it to check the guest lineup and the schedule.
Avoid long lines and big crowds
No one enjoyed waiting in long lines and being packed into big crowds. They would’ve had a better time if those wait times were reduced.
Use an Event Map
Everyone wanted to easily get around the food festival without constantly getting lost. Examples included an event map or an app specifically made for the festival.
Reduce Planning Time
They wanted a way to reduce their planning time before going to the festival so they don’t have to spend lots of time thinking about where to go.
User Persona
Meet the Fantastic Foodie! Based on our user interviews, we defined our user persona and decided to use a general name to avoid having biases.
User Flows
We mapped user flows based on four tasks we believed that the Fantastic Foodie would do while they’re at the festival. This process helped us think from the perspective of the Fantastic Foodie and give them the most seamless experience. We wanted to think through different scenarios that they might encounter (see full user flows).
Ideate
Group Ideation
During a group ideation and brainstorming session, we did a design exercise called “How might we?” where we asked ourselves questions on how to think of actionable ways to design a successful prototype. We gave ourselves creative liberty to think of any ideas that could potentially benefit our users. This exercise gave us direction on how to design a great website.
How might we make the important festival information (chefs/ vendors, event times, ticket description) easy to find?
How might we simplify the festival goers’ planning process?
How might we highlight the Austin Food & Wine Alliance?
Sketches
Once we finished ideating different features, we collaboratively sketched screens defined by our user flows. Based on the research, we focused on designing for the mobile experience because the Fantastic Foodie would use their phones to look up event information at the festival. Then we designed the ticket checkout as a desktop website because The Fantastic Foodie would look at ticket details and buy tickets on a laptop.
Low Fidelity Wireframes
We created low fidelity wireframes in Figma for the purpose of the usability testing. We wanted our users to focus on the tasks rather than confuse them with visual design. In the process, I learned that designing the the hamburger pull-out menu rather than using a side pop-out menu would potentially decrease friction.
Testing
Usability Testing
Our team tested our low fidelity prototype with 3 users to assess the validity of our designs and then we reiterated our designs based on their feedback.
How did users feel?
Confused on how to reserve a wine from the event map
Unclear about their itinerary and how to add a chef to it
Loved the easy ticket checkout process
Iterative Process
Based on the user feedback from the usability tests, my teammates and I worked on improving the prototype in Figma.
Increased the fidelity of our wireframes
Removed the Itinerary from talents and pushed into the general navigation
Updated the filter section on the event map as a pull up menu
Reorganized the “All chefs” page so users could read different profiles and search for chefs
Final Prototype
High Fidelity Prototype
Next Steps
Work on UI- adhere to iOS and Android native app guidelines
Expand the map option- include other amenities like parking, restrooms, accessibility, etc..
Retest our visual designs- ensure that it complies with accessibility rules
Conduct more usability testings- try it on a sample group of Austin Wine & Food Festival attendees
What I Learned
Trust the process - During the sketching phase, I was a little worried because I wasn’t exactly sure how the final prototype was going to look like. I learned that being confident and trust that my design skills will bring me through the design phase. Ultimately, it turned out great.
Usability testing is key - I reminded myself to always put the user in the mind first and design for them. The feedback from the usability testing really helped my team reiterate and improve designs we may have otherwise overlooked. For example, we became aware of how hard it was to see the itinerary and create the user’s own schedule.
