Cinema

Concept App

The hypothetical goal is to enhance the user experience within the app, driving platform adoption, attracting dissatisfied users from competitors, reducing queues at points of sale, and improving overall process efficiency by leveraging the digital channel.

Role:
UX / UI Designer
Year:
2020 (bored in lockdown)
Cinema — Concept App

Process

I defined two user personas: Manuel and Daniela. They represent typical users, distinct enough to establish an optimal range of constraints. Based on these user personas and project goals, I then assumed some hypothetical insights from an empathy process. Using those insights, I created a list of features to serve as a starting point for product design.

Main Flow

Such a product has several important flows: movie search, booking process, ticket purchasing, among others. Each of these flows has its own subset of user journeys. For this particular case, I defined the booking flow as the design goal.

User Personas

/*Although I defined each profile very detailed, in this portfolio I only show a summary with the conclusions that help me in the design process. /

Daniela, 25

Daniela, 25

Manuel, 39

Manuel, 39

Out of many possible user options, I defined two that lie at the extremes: Daniela, who is starting her career with high digital skills but low purchasing power, and Manuel, who has an average salary but lower digital skills. This selection ensures coverage of a wide range of use cases.

The app must be modern and engaging for Daniela while remaining highly intuitive for Manuel. We need to optimize the search, booking, and purchasing flows, as well as the trailer viewing process, since both users rely on it before deciding on a movie. Additionally, tools will be included to help them choose the best option and make the process as seamless as possible.

Cinema — Optimized Booking Flow

Optimized Booking Flow

Many cinema booking apps include unnecessary steps, such as selecting the number of tickets before starting the reservation process or choosing the theater room before the showtime. These steps were removed in this flow, making the process more efficient and improving the user experience.

Cinema — Special Movie Trailers

Special Movie Trailers

Both user personas watch trailers before making a final decision. That’s why I decided to place the featured movie trailers in the premium section of the home screen.

Cinema — Optimized display of elements on the screen

Optimized display of elements on the screen

I arranged the movie cards in a two-column grid to balance the number of visible cards per screen with the relevance of each one. Using more columns would overcrowd the screen, reducing the emphasis on each element, while fewer columns would make scrolling excessively long.

Cinema — “See Showtimes” Persistent Button

“See Showtimes” Persistent Button

For users who already know which movie they want to watch, I made it easier to find the showtime and proceed by keeping the button fixed at the bottom, ensuring it is always visible.

Cinema — Chairs Selection Improved Experience

Chairs Selection Improved Experience

In the (fictional) research, I discovered that the chair icons were too small for users' fingers, making selection difficult. To solve this, I initially displayed the full seating arrangement with all chair icons and designed it to enlarge upon the first screen touch. With larger icons, users can then easily select their desired seats.

Cinema — pantalla