Major Cineplex ticket buying flow redesign
Concept, Responsive web design
- Movie ticketing buying flow
- Mobile UI
- Responsive Web app UI
- Adobe XD
- Adobe Photoshop
Overview
This is one of my UX design projects for the Google UX Design Professional Certificate Course. Major Cineplex is one of the most famous cinemas in Thailand.
Problem
The current major cineplex website has not-so-easy visuals in many areas, such as the landing page, selecting seats, and the website is full of ads.
Goal
Be able to see "Now Showing" movies easily; better flow for buying tickets online; better visuals for selecting seats; and visual overhaul.
Users
For users who find the current web app design distracting and it is difficult to buy a ticket.
My Role
As this is a concept UX/UI design project, I had to work through the entire process, such as creating wireframes, low-fidelity, high-fidelity, prototypes, etc. I put more focus on visual design.
Preparing the journey
Based on the small research for this concept, I made some persona users to pinpoint their pain points and emotions.
Then I created a user journey map of how a user would go through the process of purchasing a movie ticket online to help me identify what will go smoothly, potential pain points, and improvements to make.
The site map was also created to give an overview of the website in order to provide a structurally organized experience for users to navigate it better and efficiently.
Persona-Concept
The user journey map created upon how a user would experience on the process of buying a movie ticket online.
The concept site map of the Major Cineplex website.
Wireframes
Before making anything, I sketched and ideated some paper wireframes to get a feel for what the main landing page would look like. After that, they removed the ideas that would not work, added some new ones, and refined the sketches to create low-fidelity wireframes.
Paper wireframes of landing page.
Style Guide
The use of strong, bold, and grand-feeling is perfect for the red-carpet style experience of a movie theater. The brownish gold gradient creates a feeling for customers to make sure this is the place where they will get the best movie experience. The typeface here is the iOS default, SF Compact family, as they are designed for readability in UI design, which is important in the process of buying movie tickets for customers.
Mockups
As a movie enthusiast myself, the concept of redesigning the movie ticket buying experience is a joy. It automatically teaches me some Adobe XD features, makes me research other inspirations, and helps me understand which features are a must to include in a cinema website. Although I was not able to redesign the whole website yet, I would love to create more and cooperate with the Major Cinema group in real life to improve upon their website for a better user experience.
What I learned
As a movie enthusiast myself, the concept of redesigning the movie ticket buying experience is a joy. It automatically teaches me some Adobe XD features, makes me research other inspirations, and helps me understand which features are a must to include in a cinema website. Although I was not able to redesign the whole website yet, I would love to create more and cooperate with the Major Cinema group in real life to improve upon their website for a better user experience.