.png)
Overview
Team
Individual
Hats Worn
Solo Designer
Timeline
2 weeks
Tools
Figma
Summary
This was a self-directed visual design project exploring the user interface of a movie ticket booking app for a fictional theater chain, NOVA Theaters. The goal was to design a clean and intuitive mobile experience from theater selection to ticket checkout. As this was a concept project, I had full control over the visual language, from button states to typography and spacing, while drawing on common mobile app design heuristics.
Project Goals
This concept project was an opportunity to explore the entertainment space by designing a mobile app for movie ticket booking. My focus was on creating visual clarity across a multi-step flow — from movie and theater selection to ticket type and quantity. I used this as a chance to practice:
-
Branding and cohesive visual tone
-
Visual hierarchy and UI spacing
-
Create clarity across a multi-step booking flow
#UIUX #VisualDesign #Concept Design
Nova Ticketing
Designing a seamless movie booking experience for mobile from theater selection to ticket checkout — with an emphasis on clarity, visual hierarchy, and microinteractions.
Process
Mapping the Experience
To kick off the design, created a task flow to map out the user’s journey through the movie booking experience. This helped clarify the key interactions, identify potential friction points, and ensure a smooth, intuitive flow from start to finish.
Following the task flow, I designed a series of mid-fidelity screens to explore layout structure, text hierarchy, and button placement. This phase was especially useful in understanding how negative space influenced visual clarity and overall usability before moving into high-fidelity design.
Task Flow, from opening the app till payment and exit
5 Mid-fidelity Wireframed Screens
Visual Identity
Typography
Chosen Mshtakan for its clean, modern appearance and excellent readability at varying sizes. Its neutral tone doesn’t overpower the visual design, allowing the color palette and content to take center stage. While the choice was primarily visual, it supports a balanced and approachable interface that remains legible across both mobile and desktop layouts.
Color Palette
I initially explored warm tones (red, orange, pink) for the primary color but found they disrupted the dark, cinematic feel I was aiming for. They clashed with the cooler undertones of the supporting palette and broke the illusion of a theater-like space.
Switching to cooler hues, I landed on teal, a bold yet calming choice that paired harmoniously with the darker shades. It maintained balance, contrast, and visual cohesion. This final choice also inspired the app’s name: Nova.
The darker tones are used for background, chips, and unselected states to preserve focus and structure. The dark-mode aesthetic aligns with common entertainment platforms and enhances the immersive experience.
High-Fidelity
Reflection
This project was completed within a focused two-week timeframe, during which I designed four high-fidelity screens that established the overall look and feel of the movie app. These screens highlight key moments in the user journey and effectively communicate core information.
While the main flow is in place, a few additional screens—such as movie type and time selection, ticket type selection, and ticket preview—are still in development. These, along with micro-interactions, are currently in the experimental phase. Some pages also involve more complex interaction patterns that I’m actively refining to ensure a smooth and intuitive experience. This ongoing process is helping me further strengthen my interaction design skills.