Tower Duel: Developing a real-time game mode in Trivia Crack 2

Nicolás Laurito
etermax technology
Published in
4 min readJul 30, 2019

--

With the release of Trivia Crack 2 last year, we wanted to introduce a new gameplay experience, something different from the turn-based game mode that our players already loved.

Our intention was to create a game that was fast-paced and no more than a few minutes long. And, above all else, a game that made users feel more connected to their opponent. The fact that it is real-time means that you will both be playing simultaneously, and this opened up a whole new range of possibilities.

Since we are using Unity as our development platform, we have plenty of flexibility when it comes to introducing animations. This way, we get to inform the player about how the game is going and what their opponent is doing. Developing this part of the product brought its own set of challenges, but first let’s take a look at the finished game.

Gameplay!

The game mechanics are the following:

  • 1v1 game, 6 minute time limit, 7 chances per player.
  • Spend a chance by picking a category. Answer as many questions as possible in a row correctly.
  • The player that answers more questions in a particular category wins that category’s character.
  • Win more characters than your opponent to win the game.

First challenge: Chaining the animations together

As the game unfolds, you can see the characters moving around. They run from the player’s tower to the opponent’s or vice versa, depending on that category’s score. If the category is tied, the character hides in the category button.

The creative team provided us with separate animations, and we had to show them in the correct order. By using reactive programming, we were able to chain asynchronous events in a breeze! We ended up with a view interface like this:

Each of these methods triggers a different animation and returns an Observable that emits once the animation is completed. This way, for example, if the science category is tied and we score some points, we chain the following animation sequence:

If, after a while, the opponent answers more science questions than we did, they will steal our character. This is how we show it:

This was working rather well, but now we were facing a usability issue.

Second challenge: What happened while I was answering?

It turns out that for the most part the players spent time in the question screen instead of doing so in the towers screen. This meant that we would remain oblivious of the progress the opponent made while we were answering questions. When going back to the towers screen, we would sometimes be surprised to find the game in a whole different status than the last time we saw it.

This was even worse when the opponent picked the same category as we did and answered more questions than us. Just before going back to the towers screen, we would be expecting to find that we had won that category, but we would find that we had lost it instead.

To overcome this communication issue, we took the following approach:

  • When the player picks a category, we save the last game state they saw locally.
  • When they come back, we first show them a transition between what they last saw, and what they’ve just answered.
  • After that transition, we show them another one between that temporal state and the new real game state provided by the server.

Let’s take a look at this example:

So, what just happened? Let’s see it from Analia’s perspective, at the right side of the screen. She is losing in the History category 1 to 0, so she decides to answer questions from that category. She manages to answer two questions correctly, so she believes she’ll win that category 2 to 1. What she doesn’t know, is that her opponent actually earned two more points while she was answering, and now she’s actually losing 3 to 2. To avoid confusing the player, this is what she will see when she goes back to the towers screen:

  • We first show her the status she knew the game was in prior to her last turn, that is, 1 to 0 down.
  • Then, we transition to the updated status of the game considering the questions she has just answered: Winning 2 to 1.
  • After that, we transition to the game’s actual result, 3 to 2 down.

This way nothing gets past the player’s sight, and everything that happens in the game is clearly displayed using transitions.

Conclusions

The development of the Tower Duel has been challenging and really exciting. We managed to wrap it right for the game’s global launch date, and it took a little over a month to develop.

After launch, we continued to improve the game mode based on metrics and the results of the A/B tests we conducted. It became the basis of the competitive ranking, with an ELO and matchmaking system that greatly improved the quality of the matches. But this is material for another post!

That’s all for now, we hope you have as much fun playing Tower Duel as we had making it :D

Haven’t you joined the fun yet? Start now at http://triviacrack2.com/

--

--