(TF)T-Minus Eighteen Weeks: The Story of TFT

image

What do you get when you add 12 devs, eight weeks, and League of Legends together? TFT, obviously.

Editorial note: Hey! Instead of dumping an absolute truckload of text on you, we decided to split this story into two-parts. The second part will be available tomorrow, 4/3, at 10:00am PT.

“Hey, have you tried Auto Chess?” There was no escaping this question at Riot in the first few months of 2019—either you were talking Auto Chess, or you risked being “ok boomer”ed by your team.

It didn’t take long for that question to become, “Wait, why don’t we make something like this?” We thought it was worth a try, but it needed to be done quickly because there was no way we were the only ones thinking this could be a big deal. Still, it didn’t make sense to take a bunch of League’s devs off their projects to pursue something we weren’t 100% sure about. So we kept the team small. Twelve people small.

Since we didn’t want to risk being left behind, we gave ourselves an... aggressive timeline. Eighteen weeks. Eight to see if we could make something fun and ten to actually do it. That left us with two questions: How do we even? And who’s dumb enough to try?

The devs you’ll be hearing from (who are just a small part of the initial TFT team):

image
image

18 Weeks Until Launch: The Countdown Begins

“We went through all the pitches for a League autobattler and formed a high-level outline,” says Meddler.

There were three goals: Improve the design (better controls and UI, faster rounds, etc.), apply our over 200 years of collective experience (read: balancing and adding features), and—arguably the most important—make it fun enough that the b o o m e r s who weren’t playing Auto Chess wanted to play.

“Once the core team was formed, we had eight weeks to identify whether it was even possible to build,” shares Riot Wrekz. “And we had to figure out if it was any good. We wanted it to be unique and fun, but still have that thing that drew us to the genre.”

image

“On day one I put a giant red doomsday clock on the wall,” laughs Riot Wittrock. “It was a little intimidating, but we kept it up as a constant reminder that we needed to remain focused.”

17 Weeks Until Launch: League of Prototypes

image

“We spent a lot of time the first few weeks figuring out how to get a prototype working. Which... was a challenge,” says Riot Wittrock.

The team started by using assets from League—which wasn’t always smooth sailing.

image

League’s game engine is custom-built for one thing: League of Legends. And while some things change (like the map, champions, and dragons), the number of players (generally) doesn’t.

“Because League’s so heavily hyper-optimized for a 10-player game and the 8-player version of TFT we envisioned loaded significantly more assets, we would actually have to run more servers to support the same number of players,” explains Riot Nullarbor. “It was quite taxing on the game client as well.”

On top of this, we wanted players to be able to recruit units (aka champions), place them strategically, and witness the ensuing battle—this “army commander” fantasy was one of the things we found so appealing about Auto Chess. But to do that, each player needed to field more than one champion at a time. And that wasn’t something the servers were built to handle.

That meant nearly every early game of TFT ended because of lag. There was no finish. No victory. Only lag.

image

Even in later versions of the prototype, lag wasn’t the only bug the team encountered. How do I hold all of these Rakans?

“There were nine units fighting nine other units, plus up to 10 champions sitting on each player’s bench,” says Riot Nullarbor. “There could be over 100 champions in the game at once, plus these crazy teamfights constantly going on. We had to remove a lot of things that weren’t necessary and then optimize the code. League’s got a much bigger map than we needed, so we were able to cut a lot of that out to get things running.”

15-12 Weeks Until Launch: The Gameplay

image

Riot’s open floor plan means that people are free to walk around, look at walls lined with art, awkwardly scan name tags to find the person who uses a photo of their dog as their Slack icon, and chat at peoples’ desks. It encourages collaboration and idea-sharing, but sometimes it’s counterproductive, especially if you’re trying to sprint to a finish line that could be in any direction.

“We spent most of the eight weeks of prototyping isolated from the rest of the company. We went as far as pushing ourselves into a corner and putting walls around the team so no one could come and talk to us,” Riot Nullarbor says.

“Yeah, Andrei sent out a bunch of emails basically asking other folks who were interested in what we were doing to not come share their ideas,” Riot Wrekz adds. “It was unusual for Riot and felt a little bit exclusionary, but it was important for efficiency.”

“And influence,” offers Kilmourz. “Leaders wanted us to explore on our own and not be too influenced by other games in the genre.”

So the team sat in a small corner and tried to figure out how the hell they were going to make TFT.

Week 14: Trains, Towns, and User Interface

image

“How do you buy units from the shop? Are they just part of the UI or did the models appear? Do you have an avatar to move around or is everything click and drag?” says Riot Wrekz. “There were a bunch of fundamental control schemes we needed to decide on early.”

There wasn’t really a UI at all at first, since most of the early efforts went to making the prototype run.

“In the beginning, we were trying to understand the game through a series of debug messages printed in chat,” says Riot Nullarbor.

“We just broke stuff if it wasn’t going to be used in the final version of TFT,” Riot Wrekz explains. “So when we did make UI changes... well, we didn’t actually make UI changes during the prototype. We just demolished the League of Legends UI and built what we wanted on top of the smoking wreckage.”

Senior QA lead Alex “Riot Ranger XIV” Sherrell showing off some very fancy new TFT UI.

Figuring out TFT’s basic UI forced the team to think about how champions even arrived at players’ boards. And some of the ideas were pretty... interesting.

“At some point we imagined that champions would arrive on trains,” Riot Nullarbor recalls. “We’d have a little train depot where it’d park with champions that you could purchase.”

Even though the image of Garen, Darius, and Warwick politely sitting side-by-side waiting to be purchased was oddly adorable, the idea quickly derailed. The re-rolling function would require the trains to arrive and depart quickly to keep games from taking too long. And while supersonic trains rolling in and out of your board would be a fun flex, the amount of resources it’d require to run and animate would be too taxing.

“We also explored having a town around the board that would level up and get bigger the further you progressed,” says Riot Wittrock. “Champions would sit on the left side of your board in a little shop, and you’d buy ’em by grabbing and throwing them onto the field.”

The team sadly ended up going for a different approach for practical reasons...

“League forces you to load into the game as something,” shares Riot Wittrock. “Early on we used Scuttle because it was native to League.”

Scuttle was a little crazy in the beginning. At one point, you could pick up other Scuttles with your own chad Scuttle and throw them around. Or you could pick champions up from your bench mid-battle and dump them into a Tahm Kench-shaped garbage can, showing your opponent exactly what you thought of their Assassin comp.

image

There was also a bug where Scuttle grew exponentially, eventually dwarfing Baron.

Although the crab-on-crab warfare went a little too far, it added a layer of fun and interaction that the team really liked, and thus Little Legends were (eventually) born.

Week 13: The Roster

image

“We viewed champions in TFT as little love letters to their League counterparts,” says Riot Wrekz. “We wanted to find a way to make the core thematic for each champion shine through, even though we couldn’t use every single one of their abilities.”

image

“We didn’t want to just use the ults for every champion,” adds Kilmourz. “Take Braum, for instance. You’d expect him to just do his ult, but the most iconic thing about Braum is probably his shield.”

The team generally had an easy time simplifying each champion, which sometimes meant using multiple abilities, like Lucian’s dash and double shot. But grouping champions into categories for traits was a bit more difficult.

“We’ve tried for so many years to make champions feel really unique,” Riot Wittrock explains. “Which is great for League of Legends! But we ran into problems when trying to group them for TFT.”

Factions and origins stood out as the obvious categories.

“When we started splitting champions up into their factions, we realized it didn’t always make perfect sense,” Riot Wrekz admits. “Garen is from Demacia, Darius is from Noxus, sure. But then you have champs like Janna... It’s not exactly clear that she’s from Zaun. We started to run into so many edge cases that just didn’t make a lot of sense.”

image
  1. The champions, synergies, and origins changed slightly every day to make everything feel more cohesive.

“An important learning moment was when we realized we could lean into League’s alternate universes,” says Riot Wittrock. “We ended up going with a pretty subtle approach, but exploring universes helped us make groupings that made more sense and felt thematically appropriate.”

Week 12: FIGHT!

image

“We really liked the buying and planning phases in autobattlers,” explains Riot Wittrock. “But the combat tended to be this zoomed-out view with a lot of spell effects going off, making things difficult to understand. We really wanted to improve on that.”

The plan? Make combat as exciting as possible without sacrificing clarity.

“We wanted it to feel like you’re observing a Bronze teamfight,” Riot Wittrock shares. “It’s a bunch of people casting their spells in a way that kind of makes sense, but it’s not like watching Diamond players. It feels like a League teamfight, just... a little wrong.”

“We wanted to avoid the cloud of visual effects and particles that we saw elsewhere,” says Riot MapleNectar. “At first, it was hard to see what was going on underneath 18 champions casting abilities, so we needed to spend time cleaning things up.”

In addition to cutting back on some of the VFX, the team found some other unique ways to increase visual clarity.

image

Initial animation speeds were a little too quick.

image

Slowed down animations.

“A lot of the animations in League are super fast,” explains Kilmourz. “Spellcasting is all about feeling responsive and satisfying. But it made it difficult to see what was happening in a 9v9 fight. So we had to slow everything way down.”

11 Weeks Until Launch: The Greenlight

image

After eight weeks of testing, optimizing, and lagging, the team had a prototype. And although it wasn’t exactly pretty, it was fun as f*&#$.

“At the start of the entire process, we kept promising that the prototype would be good,” reminisces Riot Wrekz. “And then when people finally got to play it, they agreed.”

Which meant phase one—make a fun thing—was complete. Up next? Throw out the entire prototype and actually build the game in 10 weeks.

Editorial note: Be sure to check back tomorrow, 4/3, at 10:00am PT for the rest of TFT’s story.

Related Articles

    91ae4d38883b482793fa53fd86725650
    image

    a15d797ac14e4d37bb032daa0987ae5d
    image