Project: Movie Trailer App for a movie theater
Role: UX designer
Duration: July 2022 to October 2022 (3 months)
Project vision
Design an app for X Cinemas that allow users to watch trailers, book movie tickets, and set up a notification system for tracking upcoming movies.
Challenges
- Designing an interface that is both simple and informative
- Making sure that the users notice and can interact with all functions
- Combining what attract the users in a simple and clean way
- Make sure that the app conform to web content accessibility guidelines
Starting line
In this project, I took an approach which proved to be quite effective in my design effort. I found qualitative research methods to be most useful, consisting of research, competitive analysis, stakeholder interviews, and most important our person hypothesis construction. I started by asking myself some initial questions.
“what is the product and who is it for?”
“what do our primary user need most?”
“which users are the most important to the business?”
“what challenges could I face moving forward?”
“who do we see as our biggest competitors?”
“what literature should I review to familiarize myself?”
I conducted a secondary researches and created a poll on movie lovers on a Facebook group and I have also conducted selected interviews to understand the users.
The primary user groups were working adults who have time to enjoy night outs with their friends / partners.
This user group confirmed initial assumption about movie theater customers, but research also revealed that time was not the only factor limiting users from going to cinemas.
Other user problems included obligations, interests, or challenges that make it difficult to select a movie or knowing which theater air a specific movie.
Meet the users
Competitive Analysis
I looked at several potential competing companies, and found that they can infringe on the business revenue and popularity. X Cinemas movie trailer app has the opportunity to capitalize on this by bringing ideas from each company to create one stop app without oversaturating the user’s selection.
Starting the Journey
After sketching some P&P wireframes and thinking through the preliminary flow, I reviewed it to process the area of importance then started organizing the flow.
I constructed two user flows of what a basic start to finish journey would look like while booking a ticket, or setting a notification for a soon to be released movie. This helps in my understanding ways users can interact with the app as well as allowing me to see navigation through user goals. Then I started organizing the flow in a lo-fi prototype.
Iteration
After creating the lo-fi prototype flow, I did an unmoderated usability study. I asked 5 participants to run through different scenarios in my prototype in hopes of garnering enough feedback to use for the next set of designs.
Users need a way to notice the soon to be released movies on the home screen in an easier way
Users need better understanding of ways to watch selection in the booking process
Users need a way to both book a movie ticket and order food & drinks in an easier way
Challenge 1: Highlighting
To make users notice the coming soon section in the home screen of the app, I changed both the font size and the weight of the sub header text.
Challenge 2: Explaining
Some users had doubts and confusion about the way to watch selection in the booking process of the movie. So I added a little information circle that describes what it means as well as provided and entire page in the menu about way to watch.
Challenge 3: Merging
Some users found that separating the food and drinks tab from the booking process to be annoying and confusing. So I merged both the ticket booking and snacks ordering in one direct process.
Style Guide
Combining incredibly vivid colors to create X cinemas signature gradient came from wanting to express to users just how entertaining and inviting our cinemas can be. The splash screen feels warm and welcoming enough to draw the users further in, and also the only place where it is applicable to use this much color, considering our colorful movie selections within the app.
Takeaway
While designing X Cinemas app, I learned that the first ideas for the app are only the beginning of the process. Usability studies and peer feedbacks influenced each iteration of the app’s design.