UI/UX CASE STUDY: Popflix Movie Matching APP

Overview

PopFlix is a movie discussion app that matches people with movies they want to watch. This App allows you to watch movies with friends & strangers utilizing real-time chat while watching.

Role: UI/UX Designer
Scope: User Research, Analysis, User Flow, Wire-framing, Mock-up, Design system, Prototyping, and Usability Testing.
Timeline: 3 weeks
Tools: Figma, Google form, Miro, Zoom, Trello

The Process

This case study used a non-linear design approach to solving the user’s needs.

  • Empathize- Understand that our users require an application that encourages making connections with other like-minded individuals.
  • Conceptualize- Redefine the way users interact with each other through hosting a movie/chat platform.
  • Design- Hi-Fidelity Mobile iOS Prototype as the preferred method for providing the optimal experience for our busy and on-the-go users.

Problem

‍How might we help introverted moviegoers find like-minded individuals to virtually watch movies with, and discuss?

  • How can we minimize the search process?
  • How do people foster deeper connections?
  • How can we ensure safe matching based on age and preferences?

‍Background

‍In today’s times, life has gotten a bit busy and chaotic for people to maintain the activities they enjoy. Fortunately, a constant has always been watching movies. Whether it be going to the movie theatres, streaming it online or the odd time renting a movie. People love to wind down and watch a movie keen on their interests and discuss it with others.

However, over the years people have become overwhelmed with their day-to-day life, the plethora of choices, and struggle to find someone to watch a movie with. Oftentimes people end up watching a movie on their own in their homes and feeling secluded from interacting with others and discussing their thoughts on the movie they just watched.‍

Brainstorm

Empathize

Planning the Research

Objective - Build and launch an intuitive, modern-day mobile app that assists with matching people to movies they want to watch with a friend/stranger and discussing it while watching or afterwards.

  • Ensure the app is adapting to display new recommendations based on user likes and dislikes
  • Create an app convenient for a user to choose a movie and be matched with a person wanting to watch the same movie
  • Gain insights into the requirements that a conscientious person would need in order to choose a movie and plan to watch it with someone else in today’s busy times.

Method- Qualitative method by conducting in-depth interviews and surveys

Define

Conduct Research

‍User research was centred on understanding users' pain points, defining user needs, analyzing the problem, and ideating solutions for user problems.

From the research context, we knew users were faced with numerous issues such as:

  • Some feel reaching out to people to start a conversation was daunting.
  • Hard to decide what to watch as there are a plethora of choices!
  • Users are afraid to invest in watching a movie that may be a waste of time‍

We conducted (6) interviews and a survey with ideal participants. We established the targeted demographic to be the following.

  • Men and Women
  • Ages 18–55
  • Postgraduate and Employed
  • Watch TV as a hobby
  • Trying to find spaces in between their days to wind down and relax

Research Insights

‍Our interviews gave us a few insights into the common user and we began to understand customer wants, needs and expectations.

  • Although people are eager to make new friends and participate in social activities they are a bit reserved in engaging in such activities with someone they do not know.
  • Users want a lot of choices on movie selections based on their moods.
  • Users are eager to discuss movies with friends or strangers but want to ensure they are doing it in a safe environment.

User Persona

The following is our User based on the results of interviews conducted. A postgraduate living in a busy city and establishing their career while still having time to watch movies with friends.

User Persona

Competitor Analysis + The Divide

‍While keeping the above insights in mind, we analyzed the 4 most popular apps with movie matching/watching features.‍

Competitor Apps

‍We concluded that almost none of the competitors had the aspect of finding similar likes within a fixed region and matching people based on the movie they want to watch.

This became an opportunity for a solution.

Conceptualize

Design Process

‍After concluding user research PopFlix was conceptualized.

PopFlix is designed to unite movie lovers together who otherwise would spend time alone. Loneliness is a rising trend in today's society, and we are hoping this will allow people to go outside their comfort zone and watch movies with friends & strangers by utilizing real-time chat while watching.

User Journey Map

User Journey Map

User Flow

The first step in the wireframe stage is creating a user flow.

Here we created a user flow for Sign Up/Login, creating a profile, Viewing recommended Movies, Choosing a movie and viewing friends to watch, and Chat.

Sign Up

Sign Up/Log In User Flow

App Flow

App Flow User Flow

‍Design

The Style Guide

It was important we designed the app with a “cinema” experience in order to provide users with a feeling of being at the movies when they were not physically there.

We chose Yellow as the primary colour to relate users back to the thought of “buttery popcorn”. Components were created in order to make the design efficient and consistent.

Wireframe

The next step is to create wireframes based on the created user flow.

We collaborated as a team to simplify the UX; early paper wireframes had multiple layouts. Choosing a movie from the navigation bar and finding a friend to chat with had the most iterations upon discussions.

Early Paper Wireframe
Paper Wireframe
Paper Wireframe

Wireframe Fidelity

‍Our team tested​ our initial prototypes on 4 different users

Objective ​

  • Can users create a profile and upload their information?
  • Can users choose a friend after finding a movie they want to watch?

Tasks ​

  • Sign Up | Create a profile
  • Search and movie recommendations
  • Find a friend using filters and initiate a chat
  • Add movies to the watchlist

Mid-Fidelity Screens for PopFlix

Feedback

✓ — Testers were successfully able to create a profile with interests & likes
✓ — Testers successfully initiated a movie search and view details
✓ — Testers did not enjoy the option to have their contacts within PopFlix‍

‍With Feedback, we went back into our design and re-iterated it to provide improvements.

Final Fidelity

‍As user testing wrapped up, wireframes were updated and our design layout was finalized

Hi-Fidelity Screens for PopFlix

Figma Prototype

PopFlix Prototype

My Reflections + Future Plans

‍Overall, I hope to give users the flexibility to find friends and have multiple discussions on movies they watch.

Organize as much as you can. In the beginning stages of user research, there were many insights found and notes taken our FIGMA board became a mess of information- we ended up organizing our board plenty of times which could have been avoided had we started the project with a clean organized working file. Not to mention- filtering through information became a lot easier when everyone knew where they placed their findings

Focus more on communication with each direction. Although at first, our team knew our clear objective and goal, certain tasks were dropped when communication was not clear. We explored using task management software and daily catchups to ensure our work was on target and tradeoffs were accurate

‍If we had more time PopFlix has plans to include streaming services within the app which will provide users with the flexibility to watch and chat on one platform as well as introduce scheduling services to help users plan when to watch a movie with a friend

Thank you for reading! 😀

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store