I worked as a product designer at MUBYZ for four months in 2022. I designed an IOS mobile application that enables users to look at movie showtimes, locate cinemas, and buy movie tickets online in different languages. This involved three stages of wireframing, prototyping, and testing. Within 3 months, I was able to deliver a set of UI / UX designs, establish a design system, and collaborate with PMs and engineers to successfully launch the product.
Many people use different apps to look at movie showtimes, locate cinemas and buy tickets online. For those living abroad, accomplishing these tasks can be extremely difficult.
I created the MUBYZ app, which enables users to see movie showtimes, locate cinemas and purchase tickets online all in one app, regardless of their language proficiency.
To understand the problem better, I developed an app and created both paper and digital wireframes. I made a low-fidelity prototype and conducted usability tests with seven participants. Later I gathered the Feedback and incorporated it into the design, resulting in an 80% satisfaction rate. After that, I made a high-fidelity prototype and conducted further testing, leading to iterations of the app's design.
I conducted interviews and developed empathy maps to gain insights into the needs of the users I was designing for. Through research, I identified a primary user group - young adults who enjoy spending their free time watching movies.
According to the user group, people use various map apps to locate cinemas. Some purchase tickets directly at the box office, while others prefer using an app associated with a particular cinema. Research showed that users desire an all-in-one app that enables them to both locate a cinema and purchase tickets online. However, for users like Mark, who do not speak the local language, finding cinemas and buying tickets can be a significant obstacle.
Mapping Mark’s user journey revealed how helpful it is for users to have a one-stop movie tickets app that supports different languages.
Taking the time to sketch out multiple versions of each app screen on paper ensured that the final digital wireframes effectively addressed user pain points. My design for the home screen is simple and intuitive, allowing users to easily search for movies or cinemas.
I started by designing digital wireframes and then creating a low-fidelity prototype. The user flow I incorporated enabled users to search for movies and cinemas, select their preferred time and seats, verify the information and price, make payments, and view their online tickets. It's worth noting that users can switch the app's language at any stage of the process for their convenience.
I conducted two rounds of usability studies, took notes, and made affinity diagrams to understand the feedback. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining.
I made four significant changes to my product based on the feedback gathered during usability testing sessions. I carefully considered all user comments and suggestions to optimize the user experience. My goal was to design a product that was intuitive, efficient, and enjoyable to use. To achieve this, I closely analyzed the feedback and made modifications accordingly.
After our first usability test, I added a “Location” bar above the cinema list to make it more convenient for users to find the nearest cinemas to them.
I worked on improving the language menu design, making it more clear by adding labels to the available languages.
After our second usability test, we decided to make the app more intuitive by adding a navigation bar to allow users to go back to the homepage, view their tickets, change the language and even switch to dark mode.
After our second usability test, I decided to make the “order” page more transparent by adding the detailed bill to pay and instructions on using the online tickets.
The final design has an improved user flow, it is more intuitive, clear, and attractive, this iteration features a navigation bar that provides easy access to the homepage, tickets, language, and dark mode, it also has animations for every interaction. This improved the user experience and gained 10K+ user interest.
Throughout my time working with MUBYZ, I've learned the importance of gathering as much user feedback in the early phase of a project. In this project, we started to gather user feedback a few weeks after we started the project, which provided strong first-hand evidence on design decision-making.
