Project Overview
The Timeline
5 weeks
The Goal
Design an accessible snack ordering app that allows customers to skip the concessions line and submit orders at their own convenience.
The Problem
Movie-goers are spending extra time waiting in line to order their snacks. Some are also not able to clearly read the menu from the counter.
Roles
I took up the following roles in this project:
User experience designer
Interaction designer
User researcher
Deliverables
Competitive audit
Personas
User journeys
Storyboards
Low fidelity wireframes
High fidelity wireframes
Usability studies and findings
Design systems
Mockups
Tools
Figma
Miro
User Pain Points
Time
Customers currently need to wait in a long line to place and receive their snack orders at the theater.
Accessibility
Some customers are not able to read the menu from the counter. Others are misunderstood because English is not their first language.
Flexibility
Competing apps only allow users to order snacks when purchasing their tickets.
Research Summary
I started the research process with a competitive audit that allowed me to utilize existing snack apps and take notes on their strengths and weaknesses. My primary intention here was to understand what can be improved in the overall experience of mobile ordering. Next I identified a primary user group of regular movie goers to confirm my findings from the audit.
User Personas
User Journey
Putting my feet in Tyler’s shoes and mapping out his journey was beneficial in understanding the steps he takes and feelings he experiences.
Storyboards
Wireframes
Paper ————> Digital
Lo-Fi Prototypes
———————>
Research Goals
Determine if users are being able to successfully submit an order.
Identify any possible pain points as users navigate through the prototype.
Usability Studies
Methodology
Remote study with 5 individuals across the USA
Each participant was given 30 minutes to complete 5 tasks followed by a 10-question system usability scale
The study took place 2x. Once with a lo-fi prototype and once with a mockup
Participant Profiles
Visit a theater and order snacks once every 1-2 months
Aged between 21-60
One participant listed English as their second language
One participant has a visual impairment
Study #1 Findings
1.
Users prefer to have the order button at the top of the page.
———>
2.
Users want the option to select their reception method before choosing their items.
———>
3.
Users requested more payment options like Apple pay and gift cards.
———>
Mockup
Design System
Study #2 Findings
1.
Users would like to have a navigation bar.
———>
2.
Users want more order and movie details on the payment page to confirm before submitting the order.
———>
3.
Users prefer to have pickup and delivery entries split between two pages.
———>
High-Fidelity Prototype
Try it out!
Note: Try out both entry methods to experience the difference between a regular user's and a new user’s perspectives.
Impact
This app gives movie goers the opportunity to take full control of the ordering process from the comfort of their phone while skipping the long concession lines.
Learnings
The process of designing an app is truly never-ending. Even after two iterations, there are many areas for improvement.
User research is really vital in identifying pain points with each iteration and design. Although the design originates from a designer, the experience is owned by the users which makes their involvement in this process very essential.
Inspirations
As a regular user of the Chipotle app, I appreciate the clean and seamless design they use. I took direct inspiration from their app with the pickup/delivery buttons at the top and the simple navigation bar at the bottom.
————>
2. I also chose to keep the menu page simple like the Chipotle app. Eventually, I added a drop shadow effect to make sure the buttons stood out to users.
————>