Twitch’s mission is clear: “to provide the best shared social video experience created by our growing community where creators and communities can interact safely.” Twitch is where millions of people come together live every day to chat, interact and make their own entertainment together. To help Twitch improve engagement in the mobile app, Twitch wants to expand its social capabilities. For this project, I, alongside a team, designed a new social feature to help Twitch’s users connect with each other through private chat rooms.

 

Role: In a small team of 3, I was I was the Designer. My core responsibilities included, brainstorming concepts, sketching, wireframing, iterating based on feedback, and delivering final designs.

Methods Used: Competitive & Comparative Analysis, Business Analysis, User Interviews, Affinity Map, User Persona, User Flow, Problem Statement, Sketching & Design Workshop, Prototyping & Iterating, Usability Testing

Tools: Paper Sketching, Figma, Trello, Zoom

Timeline: 2-Week Sprint (November 2021)

Challenge

Twitch wanted to provide a convenient way for users to watch their favorite streamers and talk and connect with their friends - all in one app. Our team was tasked with the ambitious project of redesigning the Twitch app and including a new feature: private chat rooms.

These are concept designs for our student project during a User Experience Design Fully Immersive program at General Assembly.

Outcome

From the on-set of the project, our goal was to help users connect with others without the hassle of using any third party applications. Our team worked diligently to provide a solution that allows users to watch and support streams while also connecting with their friends.

Based on our last round of testing, we had earned the trust and confidence from users that we had hoped for! Users enjoyed our designs and said that it would be a feature that they would use often!

The Solution

Watching Twitch Together

We created a more unified experience that creates a sense of community among users by allowing them to watch streams with friends, all in the Twitch app.

Here’s what the redesigned Twitch app included:

My team and I were able to help Twitch users feel confident and connected while also focusing on Twitch’s business needs - but how exactly did we get there?

Read more about our research process below!

User Surveys

Research and Goal Setting

To better understand Twitch’s users, my team and I conducted user surveys. These surveys were taken by current Twitch users on the overall Twitch experience and what could be improved if anything.

My team and I had set clear goals prior to beginning the feature creation process. These goals cover both business goals as well as user goals.

Goal #1: Our goal was to create a new feature for Twitch that was based on what our users need.

Goal #2: We wanted to create a feature with the intent of increasing engagement with our platform and to cut out competitors.

Key Findings: To synthesize all the data my team and I received back from our user surveys, we created an affinity map, a method used to organize research findings, as a team and were able to find our key findings

  • Nearly all users expressed a desire to interact with their friends on Twitch’s platform.

  • Nearly all users expressed a desire for a private space to watch a stream with their friends on Twitch’s platform.

  • 9 out of 13 users or 70% of users said that they watch streams with other people.

  • Of those 9 users, 8 users or 90% watch streams with friends through a 3rd party application.

  • What matters most to Izzy?

    Community and being social

    • 25 years old

    • - Living in Boston, Massachusetts

    • - Works full time as a marketing coordinator at a well known retail company

    Behaviors

    • Enjoys playing video games in her free time

    • Loves connecting with the people who frequent the same streams she does

    • Enjoys watching her favorite streamers on Twitch as a way to disconnect from her full time job

    Frustrations and Needs

    • Likes watching streams with friends but can only do this through third party platforms

    • Needs a private space to watch a stream with their friends on Twitch’s platform

 

Understanding our Persona

Using what I learned from user surveys, I created a persona that accurately represented who I’m designing for. This persona helped both my team and I to quickly start empathizing with Twitch’s users. This persona also helped guide all my team and I’s design decisions throughout the design process. This ensured that the solution we were designing was centered on our user.

 
 

Sketching

Using everything I learned throughout this process, I then worked on sketching and creating low fidelity wireframes of different frames to make informed decisions on how to properly design these new screens to help user’s complete tasks and meet their goals.

 

Sketches to Prototype

In order to test the design decisions my team and I made and the usability of the design, I created a prototype to test on users.

Mid Fidelity Wireframes

Prototype

Following our wireframes, my team and I created a mid fidelity, limited functionality prototype, using Figma, that we would use for our usability testing.

Usability Test #1

Overview:

Method: Via Zoom, moderated usability testing

Participants: 5

Age: 18-30 years

Pain Points:

  • People were confused with the location of the settings menu  

  • Once people opened a new chat room, they couldn’t tell whether they were in their private chat or public chat

  • People felt that leaving the settings menu to get back to chat took too long

Insights:

  • Users got through tasks very quickly.

  • Users immediately could tell what the “plus button” did

  • Potentially limit the amount of Private chat rooms you could have.

  • “Gear” icon signifies settings on twitch

Priority Revisions

Using the information identified through testing, I started to make these revisions in the high-fidelity wireframes

  1. Change the location of the settings button.

  2. Add purple text and underlining to let users know what room they are currently in.

  3. Send users directly back to private chat room once a change has been made in the settings, rather than send them back to the settings page.

Usability Test #2

Overview:

  • Method: Via Zoom, moderated usability testing

  • Participants: 4

  • Age: 18-30 years

Insights:

  • Significantly more success with this design compared to 1st round of testing

  • Users were able to complete all tasks, and did so within goal time

  • All users reported that they had a positive experience using the feature

Reflection and Next Steps

Looking back on things

Next Steps

If I had more time to work on the designs, I’d love to:

  1. Add a Delete, Leave, Kick from Room feature

  2. Limit the amount of people who can speak at one time

  3. Local volume control that all users can use to change how loud each person is on their end.

Reflection

This project was the first group project that I have worked on as a UX apprentice. I faced new challenges as a designer and learned every step of the way.

Through this project, I learned the importance of really diving into studying the existing design, flow and features of the application to create a new feature that looks and feels like Twitch’s existing design. Here are somethings I learned that I’m grateful for:

Its ok to disagree

We were a team that was very passionate about the success of this project. We didn’t always see eye to eye on how to best accomplish this. I learned that it’s okay to disagree, and talk through those disagreements. I learned so much from my teammates and learned that I absolutely love working with a team.

Further explore the constraints and safety of private chat rooms and chat moderation.

I would love to speak to a developer about potential technological constraints as well as security concerns involved with private chat rooms.