(TF)T-Minus Ten Weeks: The Story of TFT (Part 2)

Throwing away the prototype and starting fresh with 10 weeks to go.

Editorial note: This is the second of a two-part look back on TFT’s creation. To learn more about the first eight weeks, check out part one.

After eight weeks of testing, optimizing, and lagging, the team had a TFT prototype. And although it wasn’t exactly pretty, it was fun as f*&#$. 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.

“When we got the greenlight to move forward with production, we knew we needed a lot more people,” says Riot Wittrock. “Luckily, Meddler was able to get some other teams from League to move over and join us. And an R&D project had recently been canceled, so quite a few of them jumped on as well.”


Here are the devs you’ll be hearing from, who are just a small part of that early TFT team:


10 Weeks Until Launch: Leaping Off a Sinking Ship

01_10_Weeks_PDF.png

“We always knew the prototype was throw-away. It was really just a picture of what we could build, but not what we would actually build,” explains Riot Nullarbor. “So we reset and started to build again. Only we did it properly this time.”

“Properly” meant the team was no longer cobbling something together on Summoner’s Rift. It was time to bring in the engineers to develop scalable code. With the fundamental game design choices in place—like having a controllable avatar and purchasing units through the UI rather than physical models—the team was able to get started quickly.

But that doesn’t mean they stopped using the prototype build completely, as it was a great way to test ideas before the final build was ready.

“While the engineers were working, we needed to continue playtesting to adjust the roster, tweak the UI, test items and the shop, and all of that,” Riot Wittrock says. “So we continued to use the prototype while the shippable game was being built separately.”

02_Units_are_not_where_they_appear_to_be-(2).jpg

Eventually the team needed to face cold, hard reality and send their darling prototype to pasture.

“The prototype was really held together with duct tape and popsicle sticks,” jokes Riot Wrekz. “As we were progressing with the final build, we went from having one version of the game that worked (the prototype), to two versions of the game that didn’t work (the prototype and the final build), and then, ultimately, one version of the game that worked (the final build… hopefully).”

“I just remember hearing one day that there were all these bugs in the prototype we weren’t going to fix,” says Riot Stimhack. “There was a long list of bugs, but it wasn’t worth having someone go in to fix them anymore.”

“It was like leaping off a sinking ship,” laughs Riot Nullarbor.

7 Weeks Until Launch: Refining The Roster

03_7_Weeks_PDF.png

With seven weeks to PBE, it was time to lock down the initial roster of champions.

“League has a really wide universe,” shares Riot Wittrock. “We wanted to have a good breadth of what the League roster has to offer while still hitting on traditional fantasies. I wanted my ninjas, my dragons. That kind of stuff.”

As the team worked to narrow the roster down they realized that something was off.

“There were a lot of humans,” laughs Riot Stimhack. “It felt a little shallow. But it was also hard to tell the difference between all of the humans standing in a row.”

Luckily League has demons, Void creatures, vastaya, and... yordles.

“We cut things based on feedback from the whole team. So it didn’t really feel bad cutting some things we liked,” Riot Wittrock adds. “We knew we were going to make future sets, so we could add those champions later.”


So who almost made the first cut?

“Lux was a champion in Set 1 for a while,” Kilmourz offers.

“Oh yeah! The roster was completely different,” Riot Wittrock recalls. “We were playing with Lux, Lee Sin, and Bard for a really long time.”

“Ugh... Bard was the trolliest unit,” Riot Nullarbor interjects. “That ult. Half your team would just suddenly stop fighting.”

“It honestly doesn’t feel like it was that long ago that we had Bard in the game,” adds Meddler.

“Don’t worry,” Riot Wittrock smiles. “Bard will come back some day.”

With champions all but locked, the team focused on a different roster.

06_LL_Concept1.png

“Scuttle was really popular when we were testing it in the prototype, and we knew we wanted to make Little Legends,” Riot Wrekz says. “So we decided to run some ‘personalization’ tests when building the final version.”

“Yeah, people willingly gave their money to Riot Wrekz,” laughs Riot Wittrock.

“No! Well, not really. The entire system was run on sticky notes,” Riot Wrekz admits. “It was an honor system. If you won a playtest you could ‘purchase’ a sticky note with the skin you wanted. And then you were allowed to use that skin.”

“I remember that! It was so fun and motivational,” Riot Stimhack adds. “Everyone wanted those sticky notes.”

5 Weeks Until Launch: Sickness in the Convergence

07_5_Weeks_PDF.png

“We knew we wanted a PvP game where players would fight each other, but we had no idea how to actually get people to each others’ boards,” Riot Wrekz says.

Warning: May cause motion sickness.

“At first we had this boat that you’d ride to travel between boards,” remembers Kilmourz. “You’d get on and sail from one board to the next. But it didn’t fade to black, and the camera would have to swing around to fix the board orientation.”

“Yeah, we had to rotate the camera 180 degrees, so the air ships would launch across the map and the camera would spin while you were traveling,” adds Riot Wrekz.

Pirate ships are all fun and games until someone gets seasick.

“Some of the most magical moments were flying through the mystical void on my ship and passing other people along the way. But then I’d hear people retching behind me because of the motion sickness. That broke the magic really quickly,” says Riot MapleNectar. “I still miss it though.”

To solve the motion sickness issue, the team sacrificed their seaworthy ships and used a vortex portal to travel between boards instead.

4 Weeks Until Launch: The Board

09_4_Weeks_PDF.png

“For the majority of TFT’s development the board was played left-to-right, rather than top-to-bottom,” explains Riot Nullarbor. “We changed a lot with the board quite late in the process.”

In the beginning, the team wanted to make sure that decision-making during the placement stage was important, so they started by making the board smaller. But when players began to give feedback, they realized it wasn’t having the desired effect.

10_Dead_People_(1).png

“The feedback was pretty much unanimous between experienced and inexperienced autobattler players: The boards were too cramped. So we were like, ‘Shit,’” Riot Wittrock laughs. “We needed to think about how we could add more space. At this point we had pretty much everything built out. There were textures, and the artists were already almost done with the boards.”

How could the team get more space without losing precious time completely re-designing, modeling, and skinning the boards?

“At some point we realized that if we flipped the boards from left-to-right to bottom-to-top we’d gain an extra column and the feeling of a larger board,” Riot MapleNectar explains. “It made perfect sense.”

It really did. The team delivered on the feeling of a larger board without actually making the board larger. And with such an aggressive timeline, it would be pure upsides. Right? ...Right?

“After we re-oriented the boards, we ran into the problem where it was almost impossible to see certain champions behind others,” says Kilmourz. “The characters were standing right behind one another, so you’d have giants like Mordekaiser occluding smaller units like Vayne. It made it impossible to see what was going on.”

But there wasn’t enough time to go back to the drawing board again and re-create the boards. They’d found one compromise with rotating the board but created new problems with clarity. So, what now?

The answer was simple: hexagons.

12_For_Brad.jpg

“We’d always considered hexes,” Riot Nullarbor recalls. “We were using squares for a long time, but hexes were never out of the question.”

Hexes have two great properties. Because they have more sides, they’re closer to circles, which makes AoE spells map better. They also distribute champions better and make it much easier to immediately recognize a champ’s silhouette.

“We were really interested in some of the strategic implications of the switch to hexagons, too,” says Riot Wittrock. “There’s an added layer of complexity, you know? There’s more variance in the specificity of positioning. And then you have the orientation of the hexes to think about. It’s just a huge array of design choices that’s really exciting.”


The hexagons also allowed for slightly more organic movement for the art team. Instead of harsh, right angle movements, they were able to keep more natural animations in place.

“We were really excited to leverage some of League’s unique environment art to make boards look awesome,” shares Riot Wrekz. “And the hexes allowed us to create board assets that weren’t perfectly rectangular. It really opened a lot more doors than we were expecting.”

2 Weeks Until Launch: The Finishing Touches

16_2_Weeks_PDF.png

“I’ll never forget the flip-flopping of emotions we all had during the entire process,” Riot MapleNectar remembers. “In the morning we’d come into the office full of hope. Then, by noon, we can’t f&*$#ing make it. After lunch, okay, we might be able to do this thing. And then at night, no, no we definitely can’t. And that was rinse and repeat daily.”

With two weeks left until launch, the team needed to hurry the hell up and finish the damn thing. And that meant adding the minor details.

“We had kind of put the visual effects on hold until we finished with the gameplay,” Kilmourz explains. “Then we had to make a strike team because the fights were too visually loud. You couldn’t tell what was going on between the visual effects, spells, and level ups. EVERYTHING was animating.”

17_Carousel_Gif_Bug.gif

“We had kind of put the visual effects on hold until we finished with the gameplay,” Kilmourz explains. “Then we had to make a strike team because the fights were too visually loud. You couldn’t tell what was going on between the visual effects, spells, and level ups. EVERYTHING was animating.”

18_VFX.jpg

In an effort to save time, the team brought a lot of the assets over from League, but it turns out they’d brought over a bit too much. So they went back and trimmed. And trimmed... And trimmed.

“With nine champions on each team doing stuff at the same time... It was a lot,” laughs Riot Stimhack.

The art team had another challenge to undertake, although it was much... littler in scale.

“Typically, all of our splashes are hand painted digitally by illustrators. But we didn’t really have the time to do that for the Little Legends,” says Kilmourz. “So, instead, we had to render them in Maya and then painted over that to match League splashes.”

Meanwhile...

“I was in so many meetings with publishing folks where they’d ask if we were on track for the launch, and I just said yes with confidence,” laughs Riot MapleNectar. “Meanwhile back in the pit nothing was working. I mean, we were making progress, but the build was broken. And that was within 10 days of launch. I had faith in the team.”

20_widdle_gwffie.gif

1 Week Until Launch: Internal Playtests

21_1_Week_PDF.png

With a week left until PBE, it was time to get feedback from players. Was TFT actually any fun? Did the games feel exciting? Which Little Legend was best? The important stuff. So they turned to the only place they could: Rioters.

“I still don’t know who made the call, but we held an open internal playtest. We set TFT up and sent out an email,” shares Riot Wittrock. “I don’t know if I fully realized it was even happening. All of these people just started giving us feedback, engaging with the game, and they were having fun. I won’t forget that moment. It felt really good.”

Officially, the playtest was for performance and load testing—basically to get as many people playing as possible. And boy, did it exceed expectations.

“For a really long time we were trying to convince people to come to our desks at 5pm and play on our computers,” Riot Wittrock recalls. “It was crazy going from that to suddenly having tons of people queue up for a live game.”

“Yeah, there were games at 2am,” Riot Wrekz laughs.

“That was one of the most incredible moments,” Riot MapleNectar adds. “I remember waking up really early in the morning and there were two Rioters from Russia asking if anyone wanted to play. And then three people from Australia joined. And a few minutes later some from Japan. And just... Suddenly we’d shipped this fledgling game to the world of Riot. And people from around the world were playing together. All of the team’s hard work felt so validated.”

Launch Day

22_0_Weeks_PDF.png

“I’m pretty sure the day we went to PBE was the happiest day of my career,” says Riot MapleNectar. “It was like, we turned on the queue at 1pm. And then someone said we had 1,000 players in-game. And we all started clapping and cheering. It was like we’d launched a missile into space. The four months leading up to that moment... It was just like, ‘F&*$% it. We did it.’”

“When you say, ‘We all started clapping and cheering,” what exactly do you mean?” Meddler asks.

“I mean, like, everyone in our pit and the game modes team,” answers Riot MapleNectar.

“Because that cheer made it all around the office,” Meddler responds. “At least in our area.”

“What? Really? I didn’t know that!” Riot MapleNectar smiles.

“I remember the cheer moment,” Riot Stimhack adds.

“No one wanted to get left out,” laughs Riot Wrekz. “Some people had no idea what was going on, but they were like, ‘Yeahhhhhh!’ And clapping.”

“I just remember being surprised because the PBE normally seems to be massively over-provisioned for what it needs,” Riot Nullarbor shares. “On a normal day the PBE is running at about 10% capacity. But then on TFT launch day it was at 100% with a really, really long queue.”

“When we saw the queue a bunch of us were just sitting around hitting F5 and watching the Twitch viewer count go up,” Meddler laughs. “‘Oh, 20,000! Now it’s 50,000! I wonder how high it’ll go!’ And eventually it culminated in Riot MapleNectar running around and high-fiving everyone. It was kind of adorable.”

23_tft_map2.jpg


And Now?

“I’m just really excited for the future,” shares Riot Wittrock. “The creation and launch were just two of the many steps of—what I hope is—a game for years to come. I’m excited thinking back on everything, but I really think it’s just one of the checkpoints in the history of TFT.”

The team accomplished something that had, really, never been done at Riot: They made something for players from scratch in only a few months. From janky prototype on Summoner’s Rift to full-blown game mode.

“I think, genuinely, it was the coolest to work on a team of incredibly talented and passionate people. Everyone was running in the same direction, and that’s what let us get this done so quickly,” says Riot MapleNectar. “Literally every single person was pivotal to making TFT. There wasn’t a single person we could have done without. And I can only hope to get a similar experience in the future. Because this feels incredibly unique. I think it’s a once in a lifetime thing.”

In just 18 weeks TFT went live to players around the world. Now we’re nearly a year in and on Set 3 (Galaxies!), and the team is still optimistic about what’s to come. So here’s to them, and to you. Thank you for giving us the opportunity to make TFT. And thank you for playing.