The Scene Club
Cinema mobile app. Freelance project, 2017.
- Business context: cinema festival in Dubai.
- Client: Tigerspike.
- My role: manage and execute the whole project.
- Target audience: independent movie lovers of any age.
This is a short project for The Scene Club, currently a relatively small festival with ambitious plans for it to increase in scale over the next few years. Also a non-profit film club that showcases the best of world independent cinema twice a month in Dubai. Further info here.
The project aims to create an Android native mobile app that streamlines the exploration, selection, purchase, and check-in process (B2C). Its main goal is to increase mobile checkout conversions.
A competitor analysis was conducted through a brief selection of cinema mobile apps in the global market (Sundance, Toronto, Berlin, Cannes, etc.), both Android and iOS. Each one provides its own data sheet (brief description, rating scale, and website).
User scenario. Anywhere, anytime: while taking a stroll around the streets of Dubai, when going to work by the Dubai Metro or when travelling with Emirates Airline connected via in-flight wifi, for instance.
User personas: Fatima and Amélie. Both are coworkers in the same digital magazine company, and decided to check out a movie at the festival. With no time to print out tickets, they used their accounts on the mobile app to download them.
Qualitative research would have provided richer info on what customers are saying, suggesting UserTesting for unmoderated sessions and face-to-face interviews for moderated ones. Quantitative data through Google Analytics or Crazy Egg would have provided richer info on what customers are doing.
This stage displays several guidelines regarding not only to the visual style, but also the digital experience: 1. Information architecture; 2. Design guidelines: metrics and keylines of Google Design Guidelines.
Team brainstorming within a squad, multidisciplinary small team would have helped reward more ideas and maximize productivity.
In addition, these design guidelines include corporate colours to keep brand consistency as well as the sans-serif typeface family developed by Google as the system font for its mobile operating system Android (Roboto).
The solution. I start with ideas that come to life faster through paper wireframes. I also take notes to untangle my thoughts and let them all flow onto paper.
After making low-fidelity wireframes in Sketch, several mockups were used to provide visual details such as colours, imagery and typography. The user flow displayed below goes through Ticketing, once this section is selected on the sidebar menu.
The landing page provides an annual membership subscription when registering. Not a member? A gift voucher can be exchanged for 2 tickets.
Explore allows to browse through playlists, genres, directors, and featured films. A version of iOS according to the iOS Human Interface Guidelines is also displayed.
Ticketing allows to get into the movie without printing tickets. There are two layout versions: 1. Cards: default view; 2. Grid: used when there is a high number of movies. The second step launchs a quick 1-2 minute preview of a movie that includes info and synopsis, besides social sharing options.
A seating map allows to click and drag, zoom in or out, along with three different prices: member card, voucher code, default price.
The checkout confirmation should include the 3-D Secure system or similar to validate the identity of the card owner before making a payment.
Finally, users can share or download the online ticket, receiving a copy by email automatically. The user journey follows the story behind Fatima and Amélie, who are already members of the club once provided their bank details to register.
As a result, they can preview their online tickets on the screen of the mobile app and download a copy in PDF which includes bar code or QR scanning. Below, animated example of this journey: it’s Showtime!
In conclusion, a simple prototype in Marvel / InVision or a high-fidelity one in Axure to test the app could potentially enrich the design stage. On the other hand, sharing wireframes in Sketch with developers via Zeplin would improve team collaboration.
I didn’t have the budget and time to completely address this challenge, but in the future, I could revisit the project and focus on collaborative aspects of task management.