Looking For Fashion?




Improving Movie Ticket Booking Experience — UX Case Study


Improving Movie Ticket Booking Experience — UX Case Study

Can’t find a movie to watch in your spare time? Me too!

Please kindly check the app prototype here or my portfolio here.

Overview

Once, I’ve been in a situation when I had spare time and wanted to watch a movie in the cinema. It was Saturday afternoon, I had free time from 12–6 pm around South Jakarta, but I didn’t know what movies and which cinema was available in my particular spare time. It’s frustrating and time-consuming, because I had to check a cinema mobile page, see what movies were they showing at that time, and if I wasn’t interested with the movies I had to go back and checked the other cinema mobile page. So, I had to check each cinema one by one from their mobile app. I believe there is another way that could improve my experience to book a movie ticket for a particular time.

This is a fictional personal project, trying to find an alternative that could ease my problem with booking a cinema ticket. My role in this case study is creating user flows, wireflows, low-fi and high-fi mockups.

Problem & Design Statement

Currently, the user only can search the movie they want to watch but not search what movies are available at a certain time and location. The assumption is there are two types of movie watcher: the one who already know what to watch and find the time to watch that particular movie, while the other one has the time but don’t know what to watch at that specified time.

Problems from existing apps:

  • User can’t see what are available movies for a particular time.
  • User can’t see what available movies for a particular location are.
  • User can’t see what are available cinemas for a certain time.

Design solution:
A new flows for users so they can also choose movies based on available time and their location.

User Flow

  • Old User Flow
    The existing flow is generated from the current mobile apps for cinema ticket booking in Indonesia. Here, you can only choose based on the movie you want to watch or the cinema you want to visit, but you can not pick movies or cinemas based on your preferred time and location.
  • New User Flow

The new user flow shows a new branch that accommodates those two types of users: the user who doesn’t know what to watch at a specific time and location and the user who already know what to watch. In contrast, the old flows only accommodate the user who already knows what movie to watch.

Site Map

The site map is showing how each page should interact and located to each other. There are five main pages in the application: Home, User Profile, Cinema, Movie Page, Payment page.

Wireflow

The low-fidelity wireframe shows the steps user could take when using the app. This wireframe also shows how the sitemap implemented in the mobile application. In this flow, the user firstly picks the date or the preferred location, and then they can see what movies are available based on that criteria. Then, the user can choose the desired movie and proceed to pay. This flow also accommodate the old way, when user already have the preferred movie by searching it or tap the recommended movie on the first page

High fidelity

1. Home Page: Picking time and place

On the Home Page…

  • The user can pick the time, the date, or the location they preferred
  • The user who is more flexible with time or location, can go to the search bar and search the movie they want to watch or simply tap the movie poster on the home page.
  • The user can see promotions that are offered by the company
  • The user can go to their profile page

2. Movie Page
The movie page consists of two sections, I call it the “Schedule” and “Info”. Whether the user is on the “Schedule” or “Info”, the user still can see the basic information about the movie such as title, duration,genre, and rating.

On “Schedule”…

  • User can check the time available for the movie
  • User can see which cinema is showing the movie
  • User can see the price for the ticket

On “Info”…

  • User can check the premise of the movie
  • User can watch the trailer
  • User can get the information about the cast of the movie

3. Check out process
Here’s the ticket check out

  • After choosing the time and the cinema, user can select the seat they are preferred and the number of tickets they need.
  • Then, they are confirming their payment.
  • When they are successfully booking the ticket, the user will land on the ticket page.
  • Later, they will see it sticking on the home page as the reminder.

Reflection

After finishing this short case study, I realize there are a few things that I could’ve improved:

  • Work on user research, not based on assumptions to define the problems.
  • Conduct usability testing to get feedback from the users.
  • Some features could improve this app such as review from users, but since the design process is only trying to solve a specific problem and its’ not backed by user research thus, I can’t put features without knowing how the user will think or feel about it.

If you reach this far, I want to say thank you for the time you have spent on my article. Any feedback or critics are always welcomed. Have a great day!

Hi, my name is Made Darma Paramarta, and I’m interested in UX Design.
Feel free to say hi or check my profile here.

Improving Movie Ticket Booking Experience — UX Case Study was originally published in UX Planet on Medium, where people are continuing the conversation by highlighting and responding to this story.