Streamline

Search less, Stream More!

Image alt tag

Creating a personalized streaming experience with more user input and interaction.

This student project gave us an opportunity to create interactive quiz forms, watch party features and user interest surveys to personalize their streaming experience . My role was integrated into all aspects of research, interviewing, wire framing, prototyping and testing. This development challenged our ability to organize a complex navigation into a user friendly interface allowing users to customize their streaming preferences with an interactive quiz and user preferences.

Image alt tag

Problem

After conducting user research, we found that many users struggle with using multiple streaming services to find personalized recommendations, which is inefficient and frustrating.

How might we improve the search process so that users can have a faster and more personalized viewing experience?

Image alt tag

Solution

With a platform allowing users more input opportunities they are able to get personalized recommendations and start watching what they wanted within minutes, without endless scrolling.

Users take an interactive quiz, input their preferences and invite friends and family to join interactive watch parties, all in one app!

Tools

  • Miro

  • Figma

  • Trello

Team

  • 4 UX designers and researchers

My Role

  • UX design

  • UX research

  • UI development

Timeline

  • Overall: 4+ weeks

  • Discovery & Research: 2+ weeks

  • Design & testing: 2 weeks

StreamLine

All competitors provide recommendations and have a search function.

None have an input for users to provide information about their personal interests or moods!

Competitor Analysis

We identified two direct and two indirect competitors and conducted a feature analysis.

Based on this matrix we determined the features not included with these services that would allow us to rise above the competition include increased user input and more direct interaction through watch parties.

StreamLine

Takeaway: Users want a quick and simple way to get personalized recommendations.

Survey

During the initial ideation phase of the project, we conducted user interviews and surveys to build new proto-personas to inform the design. Together with the team, we prepared an online survey with 8 questions, focusing on our target audiences’ streaming habits, motivations, and preferences. Over the course of 5 days, we recruited and surveyed 27 users remotely. From this survey we identified common pain points and goals shared by our participants. We referenced the user interview findings throughout the rest of the design process.

Survey Response Quotes:

  • "Recommendations on platforms were not catered to my interests"

  • "Nowhere to input my tastes, mood etc."

  • "I often spend more than five minutes searching"

StreamLine

Based on our survey, persona and our competitor analysis our team began to explore the options and features that may help improve the experience for the user. This allowed us to identify the features users were most interested in, their pain points and types of interaction that users would benefit most from.

Proto-Persona

In order to form a deeper understanding of our users' goals, needs, experiences, and behaviors we created a persona representing a compilation of the feedback we received through our survey. We referenced the pain points, goals and behaviors voiced in our survey feedback to develop a persona that represented our users.

Our persona helped guide our decisions and we referenced this continually as we gathered more data. This allowed us to keep the user in forefront and helped to develop our design without our own biases.

StreamLine

A "viewing party" and interactive "quiz" could be valuable feature as illustrated with the storyboard.

Story Board

With our persona, Sally, in mind, we created a story board to illustrate how our user would discover and benefit from our solution. The story board was a quick way to align the teams vision and addressed questions about how to reach our goal of creating a personalized viewing experience through user input.

It was during our discussion about the storyboard that we determined a viewing party option would be a valuable asset based on our personas' goals and pain-points about not being able to easily watch in person with friends and family.

User Flow

We mapped the user flow to build a better understanding of how customers get on board and navigate to their "happy path".

This allowed us to visualize the users actions and make any changes to the process before starting with the wire framing.

We paid special attention to how the process for new users just signing up would differ from returning users. We also wanted to make sure return users could resume their previous activities quickly and intuitively by allowing them to skip certain steps if they wanted.

StreamLine

We developed a path for users to take a short quiz and enter personal interests while providing a streamlined onboarding process! This user flow allowed us to visualize all of the steps for the user to get to our "Happy Path" efficiently and with a little bit of fun!

StreamLine

Our wireframes allowed us to test and troubleshoot the complex features of the quiz and watch party effectively with no confusion.

Wireframes and Prototype

Using Figma, we developed our user flow into low-fidelity wireframes. We used these low fidelity mock-ups to determine our basic interface structure. Based on 5 tests, we made a two iterations and ensured the user flow brought our participants to their happy path.

Usability Testing

Once we had our wireframes built we began user testing to get feedback from participants who best reflected our persona. We conducted five usability tests on the first round and then two more after making changes to the issues identified by the testing . Our main pain point was in the watch party feature:

issue 01

Watch party setup was too confusing....

While the quiz was easy for users to complete, the watch party set up proved to be confusing to users. Testers also had issue with allowing the app to access their contact list as was originally proposed for inviting other to join watch party.

solution 01

Make it personal!

Our solution was to create a different type of input for users to manually type in their contacts to invite others to join. Based on user feedback, a message feature was created as well to increase interaction and engagement with others while participating through the site.

StreamLine

Usability Testing

issue 02

What if I want to restart the quiz or just jump to a movie?

Three out of the five testers had issues if they wanted to easily jump from one section to the other. Such as if they wanted to restart the quiz or jump directly to recommendations or movies they have already chosen

Get them there!

Create a navigation bar

We created a navigation bar for the footer of the app. From here users can easily navigate to different features for a more fluid experience with a high level of engagement

StreamLine

The addition of a footer navigation proved to be beneficial to testers who stated they enjoyed the option of navigating freely from one feature to another.

A full low fidelity prototype was developed for testing and was determined to be a pleasurable experience for testers. The ability to see how the quiz would work as well as the personalization features worked was a key part of this prototype

StreamLine

Further adaptation of a high-fidelity interface is the goal for this project in the future.

UI Design

Once the usability issues were resolved, I moved on to design more high fidelity screens in Figma. Since this project was primarily to develop low fidelity wireframe navigation, we did not have the time during class to develop a high fidelity version of this site. My goal is to create a visual interface that is inviting, easy to navigate and can be used in low light while streaming. I am using the visual cues from movie theaters and quiz shows to convey a fun and inviting interaction.

Next steps

I will continue to develop a comprehensive high-fidelity protoype which will resemble the vision of the final product. I would also like to explore how the quiz will continually update and change as the user interacts with it more. Perhaps using stored answers from previous sessions to help inform new dialog for each session. The watch party feature seemed to generate some great feedback from users who miss the "water cooler" moments from when friends and family would watch programs together or at the same time. It would also be interesting to add features such as trivia and "watch next" content based on viewers habits similar to features on existing platforms.

Learnings

Through this project I learned a great deal about how complex interactions such as quizzes and watch parties can be to build. Making sure that the time to complete the quiz matches the desired outcome before becoming to cumbersome was a key takeaway. This interaction of a "quiz" is meant to gamify the experience and make the interaction fun with a purpose. Most testers enjoyed the idea and even wanted more customization which could come in the form of more questions or another method such as

Thank you for reading my case study!

Want to work with me? Feel free to contact me!
...or just say hello on my social media.