A redesign of the Twitch.tv mobile application. With powerful tools like channel metrics and follower information for streamers, and easy navigation to your favorite channels and clips for viewers.
Dedicated Streamer Mode
Channel metrics, alert history, and broadcast tools are just a few features.
Dedicated Viewer Mode
Easy access to your favorite channels, videos, and clips.
Login and Dashboard pages that feature a clean and modern UI
Channel Metrics Pages
Real-time channel metrics and alerts
Viewer mode makes it easy to watch what you want, when you want
Homepage & Menus
UI is clean, modern, and consistent with Twitch branding
Streamer? Viewer? Both? The app has something for you
Your ticket to all the great streaming content on Twitch.tv.
I'm a big fan of Twitch.tv and wanted a chance to redesign their app. As both a streamer and a regular viewer I feel there are needs that each user-base has that are unique and need to be addressed. Things like channel metrics, donation information, replays, and chat features for streamers and an easy to navigate interface for watching favorited and new channels/clips for viewers were something that could take place in the same application. With the large amount of content and users on Twitch.tv it was important to focus on getting the users to the information they wanted while also encouraging growth in exploration of new channels. The application also allows for either mode (Streamer, Viewer) to be turned off and work independently of each other.
Streamer Mode: Streamer mode takes care of all the things a streamer would need which frees them (and their monitors) up to just do what they do best. Live stream previews and full on chat mode (for single monitor streamers) allow the streamer to fine tune their channel experiences, while channel metrics on viewers, followers, and donations give a powerful view of a channel's current health.
Viewer Mode: Viewer mode aims to provide the best streaming experience to users. The viewer dashboard gives access to the users' favorite live channels instantly with broadcast information, while also using the lower portion of the screen to recommend new channels (both currently live and offline) to encourage site and user growth. Videos, clips, and highlights have also been considered and have an easily navigated UI for accessing a channels content, or browsing for new and current global highlights.
Balsamiq Mockup wireframes and Invision Mobile Prototype (in development) available upon request.
Want a closer look at the app?
Check out these high resolution versions.
Services GiftedPixel Can Provide
Design and usability are important factors in any project. Getting things right in the architecture stage is key to success.
Good web design is understanding the devices that use a website and ensuring everyone can access content equally.
Establishing grids and visual hierarchies are important factors in good design. They help the flow of information which leads to better understanding.
Not everything has to be made with traditional paint and canvas. Digital illustrations can tell a story and be very complex as well.
Wireframe & Concept Design
How you got to the final product is as important as the product itself. Wireframing and prototyping are important steps in the journey.
Branding & Identity
People remember brands, and lots of design tools help make up those brands. Colors, logos, and fonts are all important items to consider.
Experience in live film, broadcast, and post-production. In a high def world it's important to get your message out there.
Making sure people can find you on the internet is crucial. Optimizing your site for search engines is a step everyone should consider.