Axyon Booking flow
Christel Branchereau
The product:
Axyon Cinema is the ultimate destination for young movie enthusiasts and casual viewers alike, dedicated to delivering an unparalleled cinematic experience. With a focus on showcasing the latest and most buzzworthy films as soon as they hit theaters, Axyon ensures that film buffs can indulge in their passion without delay. The trendy ambiance, state-of-the-art technology, and comfortable seating create the perfect setting for friends to gather and enjoy an exceptional movie night.
Project overview
Project duration:
March 2024 to May 2024
The problem:
Users can’t order food & beverages with their tickets booking, they also find it difficult to understand the difference between the different versions & experiences
Project overview
The goal:
Design a smooth booking flow for Axyon considering food & beverages as well as clarifications on the experience and versions.
My role:
UX designer designing a booking flow for Axyon from conception to delivery.
Project overview
Responsibilities:
Conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.
Understanding
the user
User research: summary
I conducted interviews and created empathy maps to understand the users I’m �designing for and their needs. A primary user group identified through research �was young working adults and movie nerds who enjoy watching a movie with friends and family.
This user group confirmed initial assumptions about Axyon users, but research �also revealed that users would appreciate to pre order their food & beverages online to avoid queuing.
User research: pain points
Queuing
People wants to avoid queuing, they prefer to purchase everything in advance to avoid the wait.
Confusion
Most users often don’t understand the difference between the versions when purchasing a movie ticket.
Miss out on trends
Movie nerds are often afraid to miss out on the trends, or miss out a new movie going out.
1
2
3
Persona: Olivier
Problem statement:
Olivier is a working adult who likes to go out with his friends and needs to order his food & drinks while booking his movie tickets because he wants to avoid queuing.
User journey map
Image of user journey map
Mapping Zoey’s user journey revealed how helpful it would be for �users to be able to visualize where are the popular seat at the movie theater
Starting
the design
Sitemap
It was important for users to have a full look on the different offers and services that Axyon provides, so we added a Food & Beverage sections alongs with Special Offers.
Image of sitemap/IA
Paper wireframes
The paper wireframes allowed us to define the construction of the booking flow, it allowed us to highlight the users’ favourite features, like search bar, special offers and filters.
Paper wireframe
screen size variation(s)
[Your notes about goals and thought process]
Image of paper wireframe screen size variation(s)
Digital wireframes
Feedbacks showed us the importance for users to avoid queuing, that is why we added an easy access to food & beverage and easy booking flow.
Easy filter to locate a Cinema and correct showing, prioritising the location and timing closest to users
Highlights on food & beverage as a new feature to avoid queuing
Digital wireframe
screen size variation(s)
The tablet and mobile version were built with usage in mind, making the CTA more accessible in smaller screen, and easier access to the different sections.
Low-fidelity prototype
Using the completed set of digital wireframes, I created a low-fidelity prototype. The primary user flow I connected was booking the seats & preordering food and beverage, so the prototype could be used in a usability study.
View Axyon’s low-fidelity prototype
Usability study: parameters
Study type:
Moderated usability study
Location:
France / Belgium , remote
Participants:
5 participants
Length:
20-30 minutes
Usability study: findings
Insert a one to two sentence introduction to the findings shared below.
Users couldn’t easily find the different offers proposed by the Cinema
Special offers not visible
Missing a movie overview link
Highlight popular seats
Besides on the menu, the movie overview wasn’t easily reachable through homepage
Some users, missed the popular seats, and find it difficult to find the best seats in the theater.
1
2
3
Refining
the design
Mockups
Usability study showed that there was a missing CTA allowing easy access to all the movies playing now.
Mockup 1 before
Mockup 1 after
Before usability study
After usability study
Mockups
[Your notes about goals and thought process + how you responded to and implemented peer feedback]
Mockup 2 before
Mockup 2 after
Before usability study
After usability study
Mockups: Original screen size & Variations
Mockups: Screen size variations
Main mockup screen for different screen size variations
Main mockup screen for different screen size variations
Main mockup screen for different screen size variations
Main mockup screen for different screen size variations
High-fidelity�prototype
The final high-fidelity prototype presented cleaner user flows for booking a Cinema ticket. It also meet user needs for a preorder food & beverage, and explanation of the cinema experiences.
View the Axyon’s high-fidelity prototype
Accessibility considerations
Provided access �to users who are vision impaired through adding alt text to images for screen readers.
Used icons to �help make �navigation easier.
Reviewed carefully the contrast to make sure they all have AAA ratings and if not, that they have an alternative text for easier reading
1
2
3
Going forward
Takeaways
Impact:
The app makes users feel like Axyon really thinks about how to meet their needs.
One quote from peer feedback:
“Very complete, It is very easy to book your seats and preorder food & beverage. Well done!”
What I learned:
While designing the Axyon’s booking flow, I learned that the first ideas for the app are only the beginning of the process. Usability studies and peer feedback influenced each iteration of the app’s designs. There are always new insights which could help make the app better.
Next steps
Conduct another round of usability studies to validate whether the pain points users experienced have been effectively addressed.
Conduct more user research to determine any new areas of need.
Insert a few sentences summarizing the �next steps you would take with this project and why.
1
2
3
Let’s connect!
Insert a few sentences summarizing the next steps you would take with this project and why. Feel free to organize next steps in a bullet point list.
Thank you for your time reviewing my work on Axyon’s booking flow! If you’d like to�see more or get in touch, my contact information is provided on my website.
Website: christeleb.com