Snack Preordering for a Movie Theater

Mobile Only Design
March 2022 to June 2022

Project Overview

This will be app for movie-goers or individuals who would like a more streamlined process for ordering snacks before arriving to the theater.

In this portfolio case study, I present the design of an app tailored for movie-goers seeking a streamlined process for ordering snacks before reaching the theater. The app addresses the common inconvenience of waiting in lines by allowing users to pre-order their snacks. The focus is on enhancing the overall movie-watching experience, providing users with a convenient and efficient way to customize and purchase snacks ahead of time. The goal is to save time and enhance user satisfaction by offering a seamless and enjoyable process for snack selection and pre-ordering in preparation for their movie-going experience.

Impact: The goal for this project is to help impact movie goers experience, streamline process of ordering food, and reduce the pain point of waiting in line and/or reducing any bad experiences at the theater.

What I learned: Throughout this entire project I've learned about the many details and steps it takes to polish your design. Creating a design to benefit all types of users was a humbling first experience. Being able to collaborate on designs with users to better the overall project is invaluable to all that would use the app.

Jump to:

User Research & Personas
Paper/Lo-Fi Wireframes Prototypes Hi-Fi Designs & Mockups

User Research: Summary

Sent out a 4-5 question survey to multiple users and interviewed 2 to get a more in depth look into what advantages a mobile ordering app could help enhance their movie experience.
‍
The problem: Users find most movie theater lines for snacks and drinks could be improved upon or expanded.
‍
The goal: Is to make multiple options for individual users, families, and improve experience any user with a disability.

User Research: Pain Points

1 - How busy and peak times can influence decision making process
The problem: Users find most movie theater lines for snacks and drinks could be improved upon or expanded.
‍
2 - Miss early parts of the movie if stuck in a long line making it just in time for showing

3 - Longlines can affect families with specific dietary needs who need to check ingredient lists

Persona - Rashid

Rashid
Age : 32
Education : Bachelors
Hometown : Chicago
Family : Married, no kids
Occupation : Designer

“I wish there was a system where I can just order and then pick up when it is ready”

‍Goals - I feel like if there was some sort of system or application that lets you order in advance like either an app or a kiosk which you go to put in your order then pick it up when its ready.
Frustrations - How busy it can be during peak times or evenings.
‍
User persona has a movie member pass so they would frequent a movie every Sunday or at least 1 day out of the week. Usually will try to avoid buying snacks because of the issues and would rather order a beer or acholic beverage.

Persona - Ingrid

Age : 32
Education : Bachelors
Hometown : Chicago, IL
Family : Husband, 2 kids
Occupation : Accounting Manager

User would go to the movies every Friday there was a release of a movie. Now, after Covid, they haven't gone recently. User would order snacks every time they’d frequent a movie, smell of popcorn is infectious. Would like certain allergy restrictions or dietary options for children.

"With my kids having dairy allergies, there isn't options for them or when you ask to check employees just say they cant check, so I can’t get anything”

Goals - Ultimately would like more employees on staff which would contribute to ease ordering ahead, before movie starts, and/or while family is finding their seats.

Frustrations - Lines can be long with a family of 4 with 2 younger kids, both under age of 6.Highlights sometimes workers not getting order correct and kids having dairy allergies

Problem Statement: Ingrid is a wife and mother of two who needs to order snacks for her family and make sure its in line with dietary restrictions for her children because it is difficult to wait in line with younger children during weekends and busy periods in the theater while trying to make sure her family makes it in time for their showing.
‍
Hypothesis Statement: If Ingrid downloads the movie snack app and orders her snacks ahead of time for pickup then she can walk in to the theater after checking in, pick up her snacks/order, and head to her seats with her family for an easier and convenient process to the screen.

IF/Then Statement

‍
If Ingrid downloads the movie snack app and orders her snacks ahead of time for pickup then she can walk into the theater after checking in, pick up her snacks/order, and head to her seats with her family for an easier and convenient process to the screen.

Persona - Austin

Goal: A fast, easy way to place and pickup snacks at a movie theater

Competitive Audit

Competitive Audit File

Starting the Design

‍
Paper wireframes
Digital wireframes
Low-fidelity prototype
Usability studies

Paper Wireframes

‍
Initial sketches are just trying to feel out my 1st project and have all the elements I'd want or need on the page to be front and center. Most of these initial paper wireframes would not ultimately make it towards my final design but most of the main elements needed did.

I was mostly focusing on creating digital wireframes for the main flow as well as including items and snacks to offer up after your movie had already been selected.
Having an updated view and changing icons to the bottom instead of a hamburger menu proved to be more beneficial after some feedback from another designer.
Also Increased pages to align with user flow of app and adding on top of the paper wireframes

Digital Wireframes

‍
Link to Low Fidelity Prototype in Figma

Figma Link

Usability Study: Findings

‍
Round 1 Findings
1 - Users wanted a simpler menu bar
2 - Wanted a way to add to cart without going to directly to cart afterwards
3 - Looked for a way to add/edit comments about an order
4 - Wanted a back button

Round 2 Findings
1 - Users want more multi-selection options for certain foods
2 - Want an option for every single payment option, ex. Gift card and/or coupon code.
3 - Would like an option to add utensils if necessary
4 - Want information on their theater/showing as well as how much time trailers will show before the actual movie starts.
5 - Users are looking for more smart phone features, especially gestures in checkout screen.

Refining the Design

Mockups
High-fidelity prototype
Accessibility

Mockups

Before users were automatically sent to cart, new flow will put them back into menu and show cart icon with loaded item.
‍
Notifications and settings will be nestled under persona icon.
‍
Comments section added.

Before Usability Study

The main goal for this round of mockups was to limit and streamline the amount of information presented.

Point of emphasis was to simplify the menu detail of information.

After 2^ndround of usability testing I updated the home page/screen, added more options for candy/food, changed the snack icon, and added a gesture to swipe/delete items from the cart.
A couple more changes were added like adding a gift card or coupon code as well as a piece of info about how many minutes of previews will show before your movie.

After Usability Study

High-Fidelity Prototype

Figma Link

Accessibility Considerations

Kept color contrast and checked color compatibility to make sure colors complied with Web Content Accessibility Guidelines (WCAG)
Added swipe to delete designs in cart to help reduce clicking and inserted gestures.

Takeaways Going Forward

1 - Push and clean up any smaller design or visual tweaks to benefit more information to be added
‍
2 - Create a seating chart page if theater is higher-end that food can be delivered to your seat purchased
‍
3 - Create a visually appealing ticket page for purchasing more movie tickets. Focusing on being able to scroll through your inventory of stubs and current rewards you've earned
‍

Want to work together?

If you like what you see and want to work together, get in touch!

[email protected]