[7 Days to Die] Twitch Integration

While working on 1.0 and Alpha 22, I was tasked with aiding Lathan Meadows (Senior Developer/Producer) and Zack Roberts (Software Developer) in providing UX and UI support for our upcoming Twitch Integration.

After researching what other games did for their integration, I used Adobe Photoshop to concept out how the interface should look. Photoshop Artboards are the method I'm most comfortable and familiar with, so I went to work making a few ideas. We went through a few prototypes and landed on a simple sharp look that could scale well at various sizes. The initial designs were built for Twitch.tv's panel system, but was later reworked into an overlay that goes ontop of the screen.

I provided detailed style guidelines, helped test how it was implemented, and advised on its responsive animations. I also worked closely with Zack Roberts to answer any questions and do quick mockups based on the project's needs (one example being the leaderboard, which was added later). I had a solid grasp on how he would need the information presented thanks to my history in HTML/CSS web design.

Beyond this, I was also tasked with making documentation explaining all the facts about the Integration. I worked with Lathan Meadows to understand the exact process and suss out how to best explain it to people completely new to the game.

Several variations (seperated via Adobe Artboards) showing :hover and different situations

Several variations (seperated via Adobe Artboards) showing :hover and different situations

A variety of icons built for the platform inside the game and outside of it

A variety of icons built for the platform inside the game and outside of it

How it looks live on a typical Twitch Stream!

How it looks live on a typical Twitch Stream!

https://7daystodie.com/wp-content/uploads/2023/10/twitch_documentation_rev_10_26_2023.pdf

I created the documentation for the Twich Integration as well, a quick guide with detailed set-up instructions and hyperlinking for navigation.

https://7daystodie.com/wp-content/uploads/2023/10/twitch_documentation_rev_10_26_2023.pdf

I created the documentation for the Twich Integration as well, a quick guide with detailed set-up instructions and hyperlinking for navigation.