top of page

In-Movie Snack Ordering Flow

Project duration: August - October 2021

​

Christina Laing—UX Research, UX Designer, Visual Designer, Interaction Designer, Motion Designer

​

Responsibilities included conducting user research, wireframing and prototyping.

desktop-tiles-movies copy.jpg
screentime-logo.png

The Problem

Theater-specific snack ordering sites are limited in functionality and accessibility, with out of date interfaces and payment options.

The Goal

Create a well-designed, responsive website that provides a simple, accessible way to order snacks directly to your seat in the theater, with delivery timing options, and quick pay functionality built in.

User Research: summary

I conducted user interviews and created empathy maps to understand the users I’m designing for and their needs. A primary user group identified through research was disabled theatre lovers who want to attend the movies and purchase concessions, but have difficulty maneuvering through the theater and crowds, to their seats with food and drinks in hand.

 

The majority of research pointed to a distinct lack of concession pre-ordering functionality with direct to seat delivery options.

User Research: Pain Points

Pain Point 1

Difficult maneuvering through busy theaters to purchase concessions and take them back to the auditorium while using a wheelchair or cane.

Pain Point 2

Current concession ordering sites have limited cart functionality, making it difficult to continue where the user left off.

​

​

Pain Point 3

Current concession ordering sites have limited quick payment functionality, inconvenient for a user to dig for a credit card in a dark theater.

Pain Point 4

Current concession ordering sites only allow for ordering and then window pick up, causing a user to have to leave the auditorium during the movie.

User Problem Statements

Persona: Deanna

Deanna is a disabled film lover who needs an accessible and unobtrusive way to order snacks to her seat at the theater because she doesn’t want to miss any of the movie and has a difficult time carrying multiple items at once.

Persona: Geoff

Geoff is a sociable movie goer who needs a way to acquire food and drinks for multiple people at once because he doesn’t want to stand in long lines before the film or risk forgetting something.

Digital Wireframing

I began with paper wireframes, then refined the paper wireframes into digital wireframes while referring back to my user research for guidance.

Screen Shot 2022-03-01 at 6.01.57 PM.png

Having direct to seat delivery was a specific user need discovered during user research, and I took it a step further by allowing users to specify delivery or pick up as a method, and also to specify time.

Usability study: findings

When my digital wireframes were completed, I used them to conduct two rounds of remote, unmonitored usability studies with 5 participants.

Round 1
  • Users needed a product detail page to choose options before adding item to cart

  • ​Users wanted it to be more visually obvious that the cart contained an item

  • Users wanted the checkout button easily accessible on the mobile version of the site when an item was in the cart

Round 2
  • Users thought the text size could be more consistent

  • Users wanted the specials to be available on the mobile version

  • Small text on black needed to stay white instead of red for accessibility

Mockups

After identifying themes in my usability study findings using an Affinity Diagram, I synthesized the themes into insights that I could then solve and iterate on in my mockups. 

FINDING: Users needed a product detail page to choose options before adding item to cart

Before usability study
Screen Shot 2022-03-01 at 6.23.19 PM.png
After usability study

FINDING: Users thought the add to cart buttons were difficult to locate at a glance

Before usability study

Screen Shot 2022-03-01 at 6.27.19 PM.png

After usability study

Screen Shot 2022-03-01 at 6.27.25 PM.png

High-fidelity prototype

After refining the mockups, I built interactions between the screens using Adobe XD so that it closely resembled a real desktop and mobile website.

Screen Shot 2022-03-01 at 6.57.00 PM.png
desktop-tiles-movies copy.jpg

Takeaways

”I love that the color palette is kept dark so it’s not distracting to others in the dark theater during the movie.”

”I love that the color palette is kept dark so it’s not distracting to others in the dark theater during the movie.”

What I learned

It is best not to assume you know what the user needs and wants out of a product. Doing the research and getting feedback is invaluable to avoid this.

bottom of page