How to Create a Twitch Chat Game with Unity

Learn to integrate the Twitch Chat API into your Unity game, so viewers can interact with the game during streaming. By Harrison Hutcheon.

4.7 (3) · 3 Reviews

Download materials
Save for later
Share
You are currently viewing page 3 of 6 of this article. Click here to view the first page.

Testing Commands

In RW/Scripts/Battle, create a script called Vote. This command will print incoming !vote commands to the console so you can test if your Twitch integration works.

Attach Vote to the GameManager object in the scene hierarchy. GameManager only uses commands attached to the same GameObject.

Have Vote implement IGameCommand, and add the following public fields:

public class Vote : MonoBehaviour, IGameCommand
{
    public string CommandString => "!vote";
    public string ShortString => "!v";
}

IGameCommand fields CommandString and ShortString are set to !vote and !v, respectively.

Finally, implement method the Execute method from IGameCommand, that takes the required arguments and prints the message:

public bool Execute(string username, List<string> arguments, GameManager gm = null)
{
    print(username + " sent the !vote command");
    return true;
}

Since Execute needs to return a boolean, return true for now.

Open TwitchChat again. In Update, remove the call to ReadChat(). Now, Vote's Execute takes care of this.

Return to Unity and Play the app. Enter the !vote and !v commands into your Twitch chat and watch the console in Unity reflect these messages.

Testing vote command, with a message appearing in the Unity console

Congratulations! You now have Commands from Twitch being recognised by your Unity game. But how should you use them?

Your Twitch Audience and You

The first thing you need to decide when designing a game for Twitch is how the audience will interact with the game, the player/streamer, or both!

Audience vs Audience

Audience vs Audience games pit viewers against one another. One popular example is Marbles on Stream, where viewers claim a marble that races down a custom track.

Marbles on Stream being played

Marbles on Stream doesn't have any viewer interaction beyond a viewer joining the race, but that doesn't mean games like that can't exist! After completing this tutorial, you'll get the tools and assets you need to create your own Audience vs Audience mini-putt style game.

Audience vs Game

Popularized by Twitch Plays Pokemon, Audience vs Game experiences have become the most common type of stream game on Twitch. In AvG games, all viewers can control the player character and work cooperatively to beat the game.

Some AvG games use voting mechanics to choose the next action. In contrast, others allow a complete free-for-all, executing every command submitted to the chat for a hilariously chaotic experience.

Twitch Plays Pokemon being played

Audience vs Streamer

In Audience vs Streamer games, viewers use commands to help or hinder the streamer's progress in a single-player game. Shockingly, AvS games seem to be the least popular style of stream game, which may be due to the challenges that come with Audience-to-streamer interaction, such as delay. However, there are quite a few AvS games available on online marketplaces with overall positive reviews.

Common Design Challenges

While there are a variety of stream games, all are subject to some common challenges. These challenges are unique to Twitch Chat games, so you may not have considered them before now.

Delay

Nearly all live streams suffer from some form of delay between what the streamer does and what the viewer sees. When designing a game with audience interaction, it's important to take delay into account so the experience is fair and balanced for most viewers. The delay viewers experience can vary depending on their internet speeds or geographical locations.

On a similar note, Twitch has an automatic spam filter to prevent users from sending the same message twice in a short time. Unfortunately, there's no way to turn this feature off, so you must give your audience multiple ways to send the same command.

Audience Interaction

The more interaction you include in your game, the more challenges you have to consider. Games like Marbles on Stream have limited viewer interaction, which prevents delay-related issues.

Twitch Plays Pokemon started as a complete free-for-all. Eventually, it became so popular its developers had to implement a voting system so viewers could make progress in the game. Audience interaction can be tough to design effectively, but if done well, it makes viewers feel more engaged in the experience.

Streamer Interaction

Commonly, streamers take on the role of the commentator, describing what's happening on screen in an entertaining way. However, if you plan to create an Audience vs Streamer experience, you'll need to consider how complex the streamer's role needs to be to make the game entertaining to play and watch.

Where's the Fun?

When making any game, the first question you should ask is, "Where's the fun?" What aspect of your game do viewers find entertaining?

Twitch Plays Pokemon was fun because of a shared story that anyone could be a part of. Marbles on Stream is fun because it's similar to watching a sport and rooting for your favorite team.

The fun in a game should be simple and easy to describe in a few sentences. If you find yourself explaining your game at length, or having to provide a lot of context to describe your idea, consider simplifying your game until you can identify a short and satisfying gameplay loop.

In this tutorial, you'll focus on the Audience vs Game style of stream game, in the form of a simplified Pokémon-like Battle scene.

Exploring the Sample Scene

Battle Scene Screenshot

If you're familiar with the Pokémon video game franchise, your first thought might be, "Wow, this looks almost identical to Pokémon. Like, basically a complete ripoff of the battle sequence from Pokémon Fire Red".

However, if you thought this, you'd be WRONG. It is, in fact, a complete ripoff of the battle sequence from Pokémon Leaf Green.

Of course, there are a few major differences between this scene and Pokémon, aside from Aknee and Bubblesnek.

You'll find the moves at the bottom of the screen. They all have a green label with a number symbol on the left and a red label on the right.

Screenshot of an attack option from the Battle scene

The green label displays the option number of the attack, which viewers use to vote for their preferred option. The red label shows the current number of votes for that option.

VoteTimer is another critical UI element. It's the text box in the center of the scene.

Screenshot of the text box shown in the center of the Battle scene

The text box tells viewers to decide the next move using the command !vote followed by an option number.

It also displays a timer counting down to the end of voting. Then it uses the move with the most votes against the opponent. You'll see all moves announced in the description box on the bottom right in classic Pokémon style.

After the audience makes their move, the opponent attacks. Two health bars show how much damage the audience or the opponent takes: top left for the opponent and bottom right for the audience.

If Bubblesnek still has some health left after the opponent attacks, another vote triggers.