Mobile App Redesign for a Cinema Chain

Color Themes

To improve the text readability we added contrast, changing the background and font color to a dark and light color scheme.

Having several color schemes to choose from also accommodates various user preferences. The light theme is more beneficial for text screens, making the screen more spacious and enabling the user to focus more on the content. If the screens contain images, the dark background adds depth to the color. The dark theme is also more convenient for those who are accustomed to the old version of the app.

Payment

The app offers 3 ways to pay for tickets: by credit card, gift card and iPic Access Points (bonus points).

With the newest version users can combine payment methods, mixing and matching credit cards, bonus points and gift cards as they see fit.

We implemented a simple and understandable payment flow, where users can continue or go back and edit/cancel actions at each step.

First, the user has to choose the amount they want to pay by bonus points. The rest will be paid by gift card or credit card.

Tab Menu

To make the menu more intuitive we revamped the app navigation, renamed the menu buttons, and designed new icons. Selected item icons are now highlighted in orange to help users understand which tab is open:

Seat Reservation

To make seat reservation more convenient, we increased the area of the movie hall, made the seat status (unavailable / free / selected) more obvious, and added a legend.

In order to prevent mistakes when choosing the movie theater and the desired screening time, we added information on the location, movie, show time and date to the selection screen.

To avoid information overload, we moved the section with payment information to another screen.

It is now clear what seats are available and what the next steps are.

Movie Carousel Slider

The movie selection screen was packed with information: displaying days of the week, titles, and available showtimes.

To reduce cognitive load and simplify information perception, we regrouped the screen elements and highlighted one movie at a time. We increased the font size of the available showtimes to make it easier for users to select their desired show and implemented a movie slider where showtimes are displayed only after selecting a movie. 

To make the location field more visible and that the user selects the right movie theater location, we outlined it, moved to the center and added a location pin icon.

The movie slider enables users to easily navigate through the available movies and showtimes.

Dining

To make food and drink ordering easier, we regrouped the menu items and added clear categories:

We also optimized the ordering screen. After the user selects a dish, the screen now displays information about the ingredients, the desired temperature, additives, quantity, and price: