Teamfight Tactics - Instant UI

When gameplay meets UI.

tft set 1

One of TFT's best tricks is something I call Instant UI. Instant in the sense that every button press outputs its result immediately.

Take the Reroll button. When the Reroll button is pressed, your pool of champions refreshes.

You trigger the click, two gold gets deducted, and the current pool of champions gets replaced with 5 new ones.

No animations, no delays, no confirmation boxes.

It just happens instantly.

This lack of animations isn't because of some lack of budget or laziness on the part of the devs. Rather, it's a deliberate choice.

A choice to maximize responsiveness so that the game is never in the way of the Player's decision-making.

The Benefits of Animation

Now, it's not like animations aren't present elsewhere in the game.

Take the Interest mechanic. The way Interest works in TFT is that you generate +1 gold per round for every 10 gold you have. Interest caps at 50 gold for a total of +5 interest per round.

And the way this information is communicated is with these totems on the left side. The number of totems corresponds with how much interest you made for that round. They also immediately update whenever an interest threshold is reached.

At the beginning of every round, the totems jump excitedly and shoot up a coin animation above them with a satisfying ding. As they do so, your total money goes up, indicating that these totems are giving you these coins.

They're flashy, loud, and clearly communicate one of the fundamental and important mechanics of the game.

Even the interest cap is visually represented here. As there are only 5 slots available, this implies that interest caps at +5.

Here, the sounds, visuals, and animations work together to communicate a potentially complicated mechanic that would be much harder to explain otherwise.

Instead of requiring the Player to interpret the connection between their total money count and the interest generated, it's all there on the surface level. All this makes for a better learning experience for Players and spectators alike.

The Downsides of Animation

So then, why did the developers decide to not have any animations for the Reroll mechanic?

After all, the Reroll mechanic is arguably more important than the Interest mechanic. Understanding the Reroll mechanic is key to understanding what champions might be drawn next.

The Reroll mechanic is very complex. It may not look like it, but there is a cascade of calculations that go on behind the scenes of every Reroll.

So why decide to just swap out one set of pictures for another?

That's because adding animations to a mechanic is not a free action. There are tradeoffs involved.

For one, adding animations to an action makes them resolve more slowly. Animations need frames to play themselves out. They add inherent delay.

This isn't always an issue. From the Interest example from earlier, the animation's length isn't problematic because it happens once at the beginning of the round. More importantly, the animation plays during a phase where nobody else is trying to do many other actions.

Animation delay becomes a problem if it starts to block what the Player is trying to do. If it starts getting in the way of playing the game.

Put another way, animation delay can make games feel laggy.

This is made even worse if you're playing the animations back to back, so you have to wait for the previous animation to finish before starting the next one.

This is the tradeoff. Communication over responsiveness. Information over speed.

Other games like Slay the Spire even feature a 'fast mode' that speeds up animations. Streamers and experienced players don't need the redundant information that the animations provide, so the devs put in an option to let them opt for a more frictionless experience.

Why Rerolling Has No Animation

As for Teamfight Tactics...

The Reroll mechanic costs a mere two gold to use, and can potentially be used multiple times in a single turn. As every round in TFT is limited to 30 seconds, speed and responsiveness is emphasized over everything else.

A lategame turn can involve rolling down a Player's entire fortune, all while looking for key Champions to make the perfect composition.

Compared to the 'fast mode' of Slay the Spire, TFT opted to have no animations at all. After clicking the button, the bottom row flickers and immediately dishes out the next champions to evaluate. It happens instantly.

So the tradeoff here is apparant. Any information about how the Reroll mechanic works is deliberately given up to prioritize responsiveness.