top of page
An app that simplifies the snack ordering experience at movie theaters.
The problem
Users had to wait in long queues during the interval to buy their favorite snacks and often would take longer to decide on the snacks they see at the kiosk.
The goal
To design an app that showcases all the available snacks and offers a way to place order anytime as per the users requirement.
My role
Being a solo project, I had to perform UX research, UX design, wireframing, prototyping and iterating designs.
Tools
Figma
Adobe illustrator
Adobe photoshop
Jamboard
Preliminary survey
The initial survey was aimed at finding the possible use cases and pain points of potential users of the app. Movie goers from a wide spectrum was interviewed and asked about their snack ordering experience at movie theaters Based on the research findings, the needs of the users were classified into two fictional personas.
Further a user journey map was created to outline the users journey, which is attached in the case study pdf.
User pain points:
1
Time
Ordering snacks was possible only during interval. Our app would offer the option to place an order anytime during the movie.
2
Choice
Snack choices are not revealed to the user until they visit the kiosk in-person. Our app would display a menu of all the snack items available.
3
Convenience
Larger quantity orders would require multiple visits to the snack counter. The orders placed through the app would be delivered to the user at their seat.
4
Accessibility
Users visiting the theater in a larger group had to have one person going around everyone asking their snack preference.
Insights:
The user research conducted helped us identify various user groups with different needs within the app. Some people were interested in the convenience that such an app offered. Others liked the fact that they could buy snacks at anytime during the movie. Another advantage that we hadn’t anticipated was that some users would be placing orders in larger quantities and they were more concerned that traditional ordering method required them to make multiple visits to the kiosk to make their purchase. This was another pain point that our app would solve.
Design Process
Paper wireframes
Tried various ideas for each screen and came up with these designs as the final paper wireframes.
low fidelity design
Digital wireframes
We aimed for a familiar and easy to understand layout.
Based on the low fidelity mockups, we developed a low-fidelity prototype to test the functionality of the main user flow.
Insights:
-
Many users suggested adding ticket and delivery seat information in cart window.
-
Payment confirmation prompt wasn't present.
-
Some users felt the need for review option in order history tab
Accessibility considerations
1
Sizing
All buttons have been designed with accessibility in mind. The button size is easy to click and button text is accurately mentioned to represent its function.
2
Color
UI elements such as call to action buttons and icons have been designed with contrasting colors as per Web Content Accessibility Guidelines (WCAG).
3
Minimal UI
Each page consists of minimal UI elements and has an easy to follow navigation scheme.
Final design
The design choices of the final design was the result of the brand vision and ensuring accessibility constraints are met. A second round of user testing was done to ensure that the app met user expectations and offered a clear and concise user experience.
The details of the usability study conducted is included in the case study.
Takeaways
Impact
From the beginning the app was aimed to be accessible, easy to understand and strictly followed user centered design. This is evident in the way the app turned out to be.
“I really love your use of imagery and color. It feels like a real product. Also super easy to understand the prompts.”
- Emily Endara (study participant)
What I learned
This project has helped me realize the importance of goal oriented design and creating designs that are accessible for all.
Next steps
Tweak the design elements further to create an even more minimal look.
Add certain features like the ability to reply to reviews, and add interactive components to achieve the same
Improve usage of illustrations in product pages and cart.
bottom of page