A UX Case Study: Designing a paper prototype mobile app to combine media streaming services through user research and testing

Roshni Ghedia
8 min readMay 23, 2020

UX Concept Project | 4 days | Individual

The below case study showcases a summary of the project. To read my full UX process please click here.

Overview

This app makes it easier to discover super tailored recommendations of shows to watch, without needing to browse through all your streaming services.

I created this concept project as part of General Assembly’s UX design course, whereby I needed to solve a problem for a classmate by creating a simple mobile app. This project undertook a lean UX method of working and focused on rapid prototyping, with end deliverables of a paper prototype and a final presentation.

Research Methods + Deliverables

  • User interviews
  • Experience mapping, storyboarding, user flow
  • Ideation, low fidelity screens, usability tests and a paper prototype.

Software

Marvel for prototyping the paper screens.

Highlights + Challenges

My favourite part of this project was thinking out of the box to conceptualise an array of ideas to help address my user’s problem, from famous soundtracks to gamification. My original idea of creating a survey-based solution had a complicated user flow that would have taken days to build. Although it answered my user’s frustrations and would have technically worked well, I had to sadly let the idea go due to the short time span of the project.

Constraints

Considering this was a 4-day project, I had to find a quick and easily implementable solution to the problem — which was my classmate, Ciaran, not being able to find something suitable to watch across his streaming services. Any idea which would take more than a day to map out and prototype couldn’t be used.

Understanding the problem through exploratory research

After conducting two interviews with Ciaran, I absorbed his frustrations about his movie watching habits which were difficult for him to shake off. He feels like he watches the same movies and shows repeatedly because it’s easy to — he would love to watch new shows, but to find one that he really liked would take a big chunk of time from his evening.

I also understood his plea for wanting a more streamlined searching experience when looking for recommendations, with suggestions that were actually relevant to him. He felt like he was wasting his time most nights just browsing through all his subscribed streaming services to find something new to watch.

While this exploratory research uncovered a variety of Ciaran’s needs, I focused on the three main takeaways.

  1. He can’t keep track of all the streaming services he’s subscribed to.
  2. He comes home from work and watches the same movies and series over again — therefore, he wants to be inspired.
  3. He spends a large chunk of time scrolling through irrelevant recommendations when what he really wants to do is find something quickly to watch while he eats dinner, knowing that he has a high chance of enjoying it.

Lastly, a point that wasn’t crucial but worth noting, was that movies directed by certain trusted film directors are important to him.

In order to consolidate all my findings, I created different versions of a problem statement which I could refer back to. After thinking about the most pressing problem at hand, I refined it.

Ciaran needs a way to find more tailored recommendations of shows among the services he has, because he wants to watch shows that are suited to his tastes.

I created an experience map to pinpoint the times when he would use the app on an average day. This helped me generate the most suitable design solutions that fit his lifestyle.

This map draws out the key point at which the app would be used — in the evening when he wants to watch something while he eats. At this point he’s bored of re-watching shows and needs some much needed help. It’s also worth noting that he generally watches shows alone, so there would be very little influence from anyone else in deciding what to watch.

An experience map indicating when the app would be used

Now that I understood when the app would be used, I wanted to delve deeper into the context of use and how the app would be integrated into his evening

I focused on the situation he would be in, the precise problem he would face, the solution to this specific problem and how he would feel after it’s solved — ecstatic!

A storyboard outlining the specific context of use

Conceptualising the ideas through detailed sketches allowed me to understand the functionalities of each potential solution

I spent many hours conceptualising all the ideas I had. Some of them were based on gamification and others tapped into his love of arthouse films. In the end, I came up with 6 viable ideas which needed to be explored in more detail.

A snapshot of 6 potential app ideas

I admittedly became attached to a survey-based idea and convinced myself that it was the greatest idea I had come up with for the day. It effectively required continual user feedback to provide refined movie suggestions over time. It would eventually provide such great suggestions that it would trump those given by streaming services. Ciaran could use the survey function during his commutes and the recommendation function just before he watched a movie.

I created a user flow for this idea, but only then realised how complicated the app would be — it was definitely one which would take more than a week to build out. The main learning for me here was that by mapping out the exact user flow for my idea as early as possible, I was able to foresee how long each screen would take to build and if I could realistically deliver the prototype within the set timeframe — the answer was no!

The user flow for the survey-based app idea had a complex flow.

I revisited all my ideas and focused my attention on answering two questions:

  1. Is the idea an answer to the problem statement?
  2. Could I deliver the idea in the given timeframe?

My solution: I decided to pursue Idea #3, an idea I initially thought of while storyboarding

This is an app where Ciaran could sync his desired streaming services, create a profile, and generate a super tailored movie to watch for that evening according to his exact preferences. This would be all be done through an algorithm, so there’s an assumption that this technology already exists.

The final solution for development.

Outlining Ciaran’s “happy path” user flow confirmed that the app functioned correctly

The main focus of this user flow was to get Ciaran to his end goal — watching a new movie he’s found through his personal preferences and taking all his subscriptions into account in order to do so.

The app’s main user flow depicting a happy path.

I converted the user flow into app screens, thereby creating a wireflow for the app. I now had a base from which I could conduct the usability tests

The layout of each screen was designed according to what I thought was clearest way possible to communicate the actions the user needed to take.

Key app screens

I conducted three usability tests online with different participants. They brought up some very insightful points which were not immediately evident to me when I designed the screens.

Although I received a breadth of suggestions, I focused on the majority of features the participants were confused by and what actions they would have wanted to take. I also placed importance on the time it would take to make the changes within the timeframe.

“Wait, does this button sync all my streaming services? But I’ve just selected the ones I want.”

“Where can I save this movie? I don’t want to watch it right now.”

“How do I get out of here and go back to the previous screen?”

“How can I generate another suggestion? I want it to surprise me again.”

I changed the sync all button to say sync selected.

This will make it clear that the user only needs to sync the services they want to.

I added a save for later option.
The user can have more time to make a decision.

I added an option to exit. The user can have more flexibility to go back to the previous screen.

I added a refresh button. The user can now generate more movie suggestions.

The paper prototype incorporated key pieces of feedback received from the usability tests and provided solutions for Ciaran’s main frustrations

He said that he could not keep track of all his streaming services, so the sync feature in the app will combine all his services into one and conduct a search through them all. He also wants to be inspired and find more tailored movie recommendations. Creating a personalised profile will allow him to express his personal choices in more detail so the algorithm can find a suitable movie for him to watch. Please note that not all features are functional within the prototype.

Next steps

The next steps for this project would be to conduct more usability tests using the paper prototype to build out the app and add more relevant features. After that, the mid-fidelity prototype would be built, taking more testing into consideration.

Learnings

The main takeaways from this project for me was the importance of focusing on answering Ciaran’s pain points throughout the concept designs and staying focused on the problems at hand. I pre-empted the time it would take to develop an idea by sketching out user flows as early as possible to ensure I did not go off track. Design thinking definitely involves making compromises and decisions that are right for both the user and the available timeframe.

--

--