TWITCH

Duration: 5 hours     Team: 1 Designer     Tools: Sketch

Deliverable: High fidelity concept screens

My Role:  I was in charge of redesigning 3 different aspects of the Twitch app. 

What is Twitch? 

Founded in June 2011, Twitch is the world’s leading social video platform and community for gamers. Each month, more than 100 million community members gather to watch and talk about video games with more than 1.7 million broadcasters. Twitch’s live and video on demand platform caters to the entire video game industry, including game developers, publishers, media outlets, events, casual content creators, and the entire esports scene.

THE TASK: This was a personal project where I wanted to challenge myself to redesign 3 different parts of the Twitch app in 5 hours. 

THE PROBLEM: After some usability testing with the current Twitch app, I discovered that I could improve search, navigation, and the profile. 

THE SOLUTION: I redesigned search, navigation, and the profile in an attempt to create a more user-friendly interface. 

USABILITY TESTING

In order to pinpoint which 3 aspects of the app I wanted to redesign, I gave a task to someone who has knowledge of Twitch but does not use the app. I asked the user to search for a game, navigate to the profile, and find the chatroom. While on the profile page, I also asked them to explain what they thought the icons meant and I had asked them to find info and viewer count.

From the usability testing, I decided to redesign:

1. Search
2. Navigation
3. Profile

SEARCH

Before

Currently the only way to get to the search bar is through the hamburger menu in the left hand corner. When you tap "Search", you are redirected to another screen where you can search channels, people, and games. 

After

In my redesign, I decided to have a search button available in the top right corner. That way the search can be easily accessible no matter what screen you're on. When you click the search icon, you get a prompt to begin your search. When you click on the down arrow, you are given the option to search people, games, or channels. 

A Closer Look

Redesigning the search bar also gave me the opportunity to create a more visual experience. I wanted to create icons that would be easily recognizable by a Twitch user. For people, I created a person icon. For games, I created a video game controller icon. Lastly for channel, I created a television icon. Twitch is a place where people can broadcast their own video game sessions, so I figured a television icon would be the best way to express "channel". 

NAVIGATION

For a user who is an avid streamer, getting to your profile is one of the most important features. I wanted the profile to be much more apparent, so I decided to enlarge the user profile space. As you can see on the left, everything kind of blends together and it's not immediately apparent which page you are on. I went ahead and highlighted the current page to allow the user to clearly tell where they are in the app. I also changed the icons for Games and Channels. 

PROFILE

From the usability testing, I discovered that some of the icons at the top were not clear. For example, the 3rd icon is a "chat" icon while there is also a chat button on the profile page. Past broadcasts is the 2nd icon, which was not apparent as well. For consistency, I kept the icons at the top global (hamburger and search). I decided that it would be best to have a bottom navigation for this page, where you can easily access your profile, past broadcasts, and the chatroom. Also, instead of swiping left to view your info and followers/viewers, I decided that it would be best to condense all the information on one page at the top. 

DELIVERABLE

These are the final concept screens in a row.