Cinema Cafe Kiosk
Kiosk Design
Figma
Demo of the kiosk.
What
I designed a self-service kiosk for Cinema Cafe, a dine-in movie theater brand. The kiosk allows guests to browse showtimes, order tickets, and choose concessions. The goal was to create an streamlined experience that aligned with Cinema Cafe’s casual atmosphere.
The kiosk’s movie info screen.
The kiosk’s movie service screen.
Why
Cinema Cafe lacks a solution for slower ticketing and ordering. This project explored how thoughtful interface and hardware design could improve the movie-going experience for the brand, creating efficient ticketing and faster ordering for guests.
How
The kiosk interface was designed with a focus on clarity and ease of use, allowing users to quickly navigate movie selections, reserve seats, and order food. I designed a horizontal touchscreen for optimal visibility and accessibility with the overall experience to reduce wait times and enhance the flow of Cinema Cafe’s dine-in service.
Process
Research was conducted into how people typically interact with self-service kiosks in entertainment environments. I looked into common user issues, such as long wait times, unclear navigation, and accessibility challenges. From there, I sketched interface concepts, mapped out user flows, and refined the design based on usability best practices.
The kiosk’s user flow.
Initial concept sketch of the movie times screen.
The date and schedules of a selected movie were originally intended to be separated. The decision was made to limit the information to times as the customer would have already planned to attend the movie on the day they arrived at the cinema.
Initial concept sketch of the movie info screen.
The arrangement of various details felt too random, thus the content was designed to fit more into a top-to-bottom reading approach.
Early draft of the welcome screen.
The original background featured scrolling movie posters, but this was removed due to its distracting nature. Green tones were also replaced with Cinema Cafe’s brand red for better alignment. The “Discover” button label was changed to improve clarity, making “Welcome” seen as more visible and intuitive.
Early draft of the movie info screen.
The green color motif was removed for the same reasons mentioned for the welcome screen. The banner was removed as it served no real purpose due to being redundant and taking up unnecessary space. People would already know prior information regarding the movie, with the poster already displaying the title and the production company.