Movies have long been interwoven into the social fabric of our culture, but in the age of streaming, it has undoubtedly become easier to choose anything you’d like from the comfort of your home. On the other hand, Otherside is an argument for the importance of local cinema as a hub for community building, education, and entertainment.
Otherside is a directory of every film you can see in your area, curated for you, all in one place. It focuses on connecting fans to the physical spaces that show films. Movies have long been a throughline in the social fabric of our culture, but in the age of streaming, it has undoubtedly become more accessible to choose anything you’d like from the comfort of your home. On the other hand, there is an argument that films are meant to be seen with an audience, on the big screen, with snacks in hand, and above all - without distraction. It’s like nothing else to see something for the first time or see a favorite film of yours with an audience of people who share the feeling. The experience can be electrifying, inspiring, and, above all, builds community by bringing people together and sharing the cinema experience. Otherside is a resource that will provide users with all the information about film screenings, programming, and events while allowing them to purchase tickets conveniently in one place.
I was challenged to approach this design, focusing on community and promoting the cinema as a hub for socializing for the broadest range of patrons. Local independent theaters and nationwide cinema chains need more interconnectedness to provide patrons with resources to discover all of the films available. With Otherside, I would like to bridge this gap with a centralized directory that connects users with the physical spaces showing films and allows them to purchase tickets to any cinema near them in one place
Research Phase
To better understand how people find movie showtimes in their area and what informs their viewing decisions. Specifically, we are focusing on what features could be developed to provide a better source of localized information and a streamlined ticket-buying experience for users.
Ticketing platforms like Fandango, Atom Tickets, movietickets.com, and even a Google search of “movies near me” will provide users with nearby showtimes. This format is disjointed and excludes the ability of theaters that run programs, repertory screenings, and special events to provide information about events to patrons. You would need to open three independent theater sites to determine what repertory screenings I could attend today.
I conducted four interviews with people aged 20 - 30 who visit the cinema in varying capacities to understand better the user’s preferences, habits, frustrations, and needs surrounding finding movie showtimes and purchasing tickets.
These three key themes became apparent:
Accessibility - Users all desired to have easier access to movie events and showtime information
Socialization - All of the participants harkened back to a time when they either saw a film with a close friend or family member and desired to replicate that experience.
Edification - Users were eager to participate in experiences that felt exclusive and limited in their engagement reach, while simultaneously providing a feeling of education through what they see on screen.
Meet our primary personas, Norman, The Barista Who Paints and Francine, Writer By Day, Cinephile By Night. By empathizing with the needs and frustrations of research particpants, I was able to define who the primary user of our product is. I kept these two in mind at every step of the design process.
Ideation Phase
My research of Otherside’s competition space and user interviews signaled room for potential user engagement by developing a directory of all available showtimes, along with an integrated ticket purchasing feature. These features would create a space for users to stay engaged with their local cinemas while simultaneously using Otherside as their primary ticketing marketplace.
After refining what user's needed from Otherside, I developed a sitemap of how those features would be organized with the app. This outline was the first step in visualizing what Otherside would feel like in the hands of users.
I explored what it would be like for a user to utilize these proposed features by creating task flows. Working through these helped me empathize with the user and how they would complete the proposed tasks.
These critical flows were to be tested:
Onboarding a new user
Purchasing a ticket to an upcoming showtime
Viewing saved content on 'My List'
Interaction Design
I used low-fidelity sketching to translate what these task flows would look like for users. These sketches are the groundwork of the entire design stage and serve as an outline for the remainder of the project. This stage of designing rudimentary sketches feels like it unlocks a design's potential, visually giving a glimpse of what the product will become as we continue development.
From there, I took these sketches and reworked them into a mid-fidelity outline that I could use in Figma to build upon for the high-fidelity screens of Otherside. These mid-fidelity wireframes are critical in going from the spark of an idea in the sketching stage, to building a strong outline that will become the prototype of Otherside.
User onboarding flow:
Design & Branding
In developing the visual style of Otherside, I found inspiration at the core of the product - getting users to the movie theater. The theater at the base level provides a comfortable chair, refreshments, and a large screen in a dark room to give patrons the best possible viewing experience. I kept the idea of a distraction-free viewing experience in mind at every design stage. In doing so, I kept with a simple black and white color scheme, a simple but effective logo, and minimal design to keep the user’s attention focused on the films at hand, as they are the focus of the app.
Iterations of rudimentary sketching provided me with a solid outline from which to work as I started building high-fidelity screens for Otherside. Market research and familiarization with current movie ticketing apps such as AMC, Fandango, and Atom Tickets were massive in mapping out the functionality of Otherside, but not so much the visual style. These apps were visually overwhelming, so instead, they drew inspiration from museum ticketing flows by institutions like LACMA, SFMOMA, and MFA Boston. The melding of the usability of popular ticketing services with the graceful, uncluttered visual style of a museum’s ticketing flow were the intentions that I held while building the prototype of Otherside.
Usability Testing & Iteration
After creating a prototype from the high-fidelity designs, I moved forward with usability testing to see how four potential users would use the application and receive feedback from them to be used for a round of priority iterations. I conducted the interviews virtually and in person. They were asked to perform these three tasks:
Create an account as a new user who just downloaded Otherside.
Purchase a ticket to an upcoming film.
View your saved tickets and alerts in the “my list” feature.
There was a 100% completion rate. All participants were able to successfully create an account, purchase a ticket to an upcoming showtime, and view the ticket they had purchased. Their feedback immensely helped shift my perspective and view the design objectively as something created for the potential user, not for me as the designer. I made the following priority iterations as a result:
Three out of four participants noted the inconsistency of some language used throughout the design. Inconsistency in language was taking them out of the experience and needing to be corrected not to distract users.
Three out of four participants indicate they felt that confusion over the onboarding questionnaire. It was imperative to make this section easier to digest, as to not push the user away so early in their journey.
Further developing the ‘articles’, alerts and customization features of the app that users were given a glimpse of in this initial prototype.
Conduct another round of usability testing with new and existing users to further provide feedback on new iterations of Otherside. Further testing will validate that changes made throughout the iterations continue to serve the user experience and concerns.
Create a roadmap for how Otherside would function in a local sense. Outlining a plan for localized content would require researching and receiving feedback from regional theaters to create a user experience that covers the whole gamut of cinema, both as a patron and provider.
Otherside was rooted in a desire to bring the joy of cinema to the masses. Through this design process, it became abundantly clear that information needs to be as accessible as possible to impact users. The problem is that the cinema landscape is currently scattered and difficult to navigate. Otherside, at this stage, validates that there is a need for a centralized digital space to bring users into physical cinemas. It would be fantastic to someday grow this idea into a more realized, functional platform.
Related projects
