Daniel Novak's profile

Cinema Ticket Booking Website Design

Project overview
The product
Cinema City is an online platform, where you can book and pay in advance for cinema tickets. Typical user is between 16-30 years old, preferring online shopping options.

Project duration
February to March 2022

The problem
Online ticket buying platforms are usually a bit confusing (movie and seat selection, checkout process) and also designs are not so nice.

The goal
To create a user friendly platform with clear navigation, offering nice and easy process to buy cinema tickets.

My role
UX designer, leader of the Cinema City project.

Paper and digital wireframing, conducting interviews, low and high fidelity prototyping, usability studies, accounting for accessibility, iterating on designs and responsive design.
Understanding the user
User research summary
I conducted interviews and created personas and empathy maps to understand the users I’m designing for and their needs. The primary user group identified, who lives in a big city and at least once month going out to watch a movie in the cinema.

User research pain points
Navigation: Booking platforms are often hard to navigate.
Interaction: On cinema ticket booking websites item selection is usually difficult, because of the big amount of movies.
Experience: Buying a ticket online is usually confusing and not providing a good user experience.
Problem statement
"Phil is a movie addict who needs an online opportuninty to book seats in advance, because he likes to organize everything online and hates to stand in the queue."
User story
"As a movie addict I want to book cinema seats online so that I can arrive to the cinema comfortable, without stadning in the queue."
Sitemap shows the main goals and points, what the site has to know to find you movie and buy tickets. The final user interface has been changed at many points, but this was the base of the idea.
Paper wireframes
Hand sketched wireframes of the website, prioritized to book a ticket easily within few steps.
Digital wireframes
As the initial design phase continued, I made sure to home page designs on feedback and findings from  the user research.

Desktop version
Smartphone version
Low fidelity prototype
Using the completed set of digital wireframes, I created a low-fidelity prototype. The primary user flow I connected was booking 2 tickets at one of the cinemas, so the prototype could be used in a usability study.
Usability study parameters
Study type: Unmoderated usability study
Location: Hungary, remote
Participants: 5 users
Legth: 20 minutes
Usability study findings
Seat booking: It wasn’t clear for users where the screen is, where the movie will go, when they booked the seat.
Cart: There was no option to cancel a ticket from the cart
Based on insights of the usability study, users were not sure, where the seats are facing on the map, therefor I added the grahpic of the screen they are going to watch.
Based on insights of the usability study, users were’t able to cancel the ticket, if they wanted to modify the items added to the cart.
High-fidelity prototype
The final high-fidelity prototype presented clean user flows for booking a cinema ticket for a movie.

Cinema Ticket Booking Website Design


Cinema Ticket Booking Website Design


Creative Fields