Gamasutra: The Art & Business of Making Gamesspacer
View All     RSS
May 25, 2017
arrowPress Releases






If you enjoy reading this site, you might also want to check out these UBM Tech sites:


 
The secret to designing the perfect level?
by Yowan Langlais on 10/07/15 12:16:00 pm   Featured Blogs

4 comments Share on Twitter Share on Facebook    RSS

The following blog post, unless otherwise noted, was written by a member of Gamasutra’s community.
The thoughts and opinions expressed are those of the writer and not Gamasutra or its parent company.

 

First of all, if you’ve never heard of the words “Toto Temple”, you'd better watch the following video because this article will be exclusively talking about this game.

Pretty intense, and chaotic wasn’t it? If you’d like a deeper understanding, or probably because you’re totally confused about what's going on in this game, you might want to read this article!

Great, now that your Toto Temple Deluxe 101 crash course is completed, we can get into how levels were designed for this weird little game.

Before I start though, don’t be afraid of the scroll bar length, it’s misleading... Sort of... Lots of big pictures in there. Yes, it will still be quite a read, BUT, the article can easily be split into small reading sessions. Here’s some quick links in case you need it!

  1. Creating my design setup
     
    1. My toolbox
    2. Starting from nothing
    3. Why grids?
    4. 1st level
    5. New gameplay direction
    6. New level
    7. Mini conclusion
  2. Designing all levels using the above
     
    1. Level 1: Toto Temple
    2. Level 2: Tiger Trap Tantrum
    3. Level 3: Mini Miney Moles
    4. Level 4: Canopy Contraptions
    5. Level 5: Bubble Babble
    6. Level 6: Giga Geysers
    7. Level 7: Rabid Bats
    8. Level 8: Goat Gate Galore
  3. Additional improvements
     
    1. Level 1: Toto Temple
    2. Level 3: Mini Miney Moles
  4. Conclusion or TL;DR or WTL;DR (Way Too Long; Didn’t Read)

 

Let’s get started

First of all, let’s go back to the very beginning, back during TOJam when Toto Temple was a simple platformer with no “Dash” ability. Wait, what’s a “Dash”?

Toto Dashing

See what that little guy is doing? That’s a “Dash”.
 

Back in that version, the game was all about collecting coins, consuming them to place traps then push other players into them to steal their belongings so you could place more traps and more and more!

As you can see, we were trying to make a 2D platformer. No problem, but where do I start?

Personally, I always begin with this one and only question: What tools do I have, and how can I exploit them best?

The answer is pretty straightforward in this case:

  • Move Left and Right.
  • Jump and Double Jump.
  • Push / Punch
  • Set traps.
    • Still unsure what they are yet, but trust me, they are important.

That’s it! Short list, this is going to be a piece of cake? Well, we’ll see about that.

 

Creating from scratch

Let’s get to the drawing board. First of all, I need to figure out how big the elements will be in this new world. Toto Temple is designed on a 16:9 aspect ratio so I usually start with a quick sketch of a possible level to have a slight idea of what I’d like the game to look like in term of sizes. I usually work with the other guys to make sure everyone has the same vision of the game. During this step, I do not focus on building an actual level. It is solely about getting a rough idea of the world.

mockup_01_380 mockup_02_380

Too big, not enough possibilities... And it’s too cramped in there...
 

mockup_03

Ok, before you say it, drawing is not my specialty, but I think I have something there.
 

Once I have a base that everybody agrees with (size wise), and since I can’t leave a masterpiece like that go to waste, I proceed to the next step, which is making a grid out of it! Yes, I love grids. Grids are amazing. To achieve the impossible, I use Adobe Flash’s grid system (don’t jump the gun, I’ll explain why in a moment). When doing this, I want to make sure the grid fits perfectly within the game ratio (in this case, the game was planned to be 1280x720) and that a single square size is close enough to the smallest element of the sketch, usually the edge of a platform. Once the grid is done, I just put the old drawing aside and make a clean version.

 

Never thought a masterpiece could become even better with a grid slapped over it didn’t you?
 

Then I realise that my grid is too big, preventing me from shaping the level the way I want, like you can see in the above. It’s similar, but not close enough. Next thing I know, my grid is now too small, making the level’s geometry too complex and tedious to build. So I basically scale it up or down over and over until I’m 99.99% satisfied with its size. I ended up with a grid of 40 pixels per 36 pixels by square. As you can see, it allows me to be much more accurate than the previous version.

If I had a clever quote to say about grids, this is where I would write it.

 

A grid? But why... Just why?

Having this grid allows me to apply some basic rules of design like defining the jump height. I wouldn’t want to make unreachable platforms without knowing it. I can also define the minimum space required between collisions to make sure players can comfortably move around. Doing symmetry is fairly easy as well because everything is placed pixel perfect. That way, everything I do is consistent (or at least, is supposed to)!

So many things not working in this design... Better delete it before someone sees it.
 

So yes, grids are that convenient, at least to me! But why do I use Adobe Flash for this? Well, here’s my top 4 reasons (nah, not going for the classic top 5 thing):

  • The grid is a snap to setup and adjust (I know, that was an excellent pun).
  • Creating temporary assets is easy.
  • The snap to the grid feature is very powerful (when you learn to work with it properly).
  • Scaling and moving assets according to the grid is very useful.

Oh, and since I’ve been working with Flash for quite some time now, I can almost say I know it like the back of my hand, allowing me to work really fast with it!

All these things allow me to prototype countless of levels in a blink of an eye, or two, but certainly not three! This is crucial to me as, even though the game currently only has eight levels, I made more than a hundred just to get these.

 

First level, here I come

Alright, back to level design now. With the preparations now completed, I can finally start to design the first real level, the one that was going to be used in the TOJam version of Toto Temple. I hope you remember the “tools” I mentioned earlier because this is where we need them. The first two are not that important as they are the basics of any 2D platformer but, the last one is what will inspire this whole level: Traps.

If I recall my golden rule, it would go something like: How can I exploit Traps best in this level?

When thinking about traps and 2D platforming, I imagine narrow passages and enclosed areas, the kind of places where it would feel natural and rewarding to place traps. Here’s some layout ideas I came up with:

 
 

See where I’m going?
 

I really liked the idea of having a big central area so I took the last one and refined it a bit. Believe me or not, I made THE best level ever created by mankind with it, period!

Looking forward to placing traps in there!
 

It might not look that amazing to your eyes, but wait, let me point out some specific places in this level design.

Explanations coming up!
 

  1. Big central area. Lots of room to place traps, making it a tough spot to control as there would be traps from all players.
  2. Small tunnels. You probably want to control at least one for safety reason.
  3. Top altar, a must as it’s the only way to cross to the other side from above.
  4. Narrow pits means higher chance to catch someone, making it a good place to set some traps.
  5. Falling from there would probably mean something bad as you would fall into the most trapped zone.
  6. Easy to avoid going there, but can also be a good escape route so it’s worth controlling these areas.
  7. Get pushed in there and it certainly means death, if a trap there is! Plus, it’s a narrow platform so you know what to do there.
  8. Not super important, but could be worth it, forcing a player falling from #4 to go down the big #1 central area.
  9. Enclosed area. Might or might not worth it, but if you manage to push someone in there, I’m pretty sure he’d fall into your trap.

There you have it. You might have some more questions about my design, like why did I create a 2x1 platform at #7 when I could have made it 3x1?

I decided to go with the 2x1 because I didn’t want players jumping from #9 toward #8 to bump their head on #7 and miss their jump. Lots of numbers sorry, hard to explain, but the image below will help.

 

Helpful drawings.
 

Another question would be: Why did I create an enclosed area at #9?

The answer is similar to the previous one. Most of the time, my decisions are based on the environment. Giving enough room to players so they can move comfortably is one of my top priority. Yes, I could have filled the dead end, making it inaccessible, but I thought it could create some funny scenarios if left open. I’m usually not a huge fan of dead end by the way, but sometime, I make small exceptions.

Anyway, what I’m trying to tell here is that when designing a level, it is all a matter of creating something in which players can make the best out of the tools you’re giving them. And would this level qualifies for these tools you ask? Let’s see:

  1. Move Left and Right.
    1. Yes. There’s enough room to move freely in the level.
  2. Jump and Double Jump.
    1. Yes. Platforms have been carefully placed, with an obstacle free path leading to them.
  3. Push / Punch
    1. Yes. There’s many opportunities to push / punch people off platforms and more.
  4. Set traps.
    1. Yes. Many crucial areas have been designed just for that!

I think we’re all set then. There might be some other issues that I did not see in the design, but we’ll have to play the level to discover them. It’s very rare to nail a level on the first iteration, unless you are a pure genius of course.

That said, if you still have questions unanswered about anything you’ve read so far, write them down so you can ask them later in the comments, once you are done reading the whole article!

 

Way too beautiful to be true

Just when I thought I had an amazingly well thought level, what was meant to happen happened [Dramatic music playing]. While developing and testing under pressure (remember we are in a game jam right now), we figured out that we were having fun just chasing each others and faking to punch us to the face (the punch feature wasn’t even implemented yet). To cut story short, this is when we deliberately changed the gameplay completely. Instead of placing traps and carefully navigating through the level, we added an infinite directional dash and a goat to carry (wut?) [Dramatic music stops playing]!

Hello, my name is Goat. I’m on a pole. Pay attention to me will you?
 

You might think that this is an insignificant change and it has nothing to do with level design, but guess what? Wrong. It actually changes the whole thing. Now, instead of carefully moving and jumping, you can recklessly dash across the level. That was not planned at all and time was running short. At this point, making major changes to the level was nearly impossible. A single modification would mean that JP, or illustrator, redraws parts of the backgrounds to match the new level layout. Worse, it could even mean starting all over.

As Mister Freeman says!
 

We did not have much of a choice but to leave it as it was. We ended up with a level in which it is a bit troublesome to navigate using the dash ability, but for the game jam version, we would have to stick with it (fortunately, it was not that bad of a problem). Here’s what the thing looked like in the end.

Get the Goat!
 

 

As you can see, pretty accurate!

 

TOJam is over, let’s make a new level

This time, I know exactly my tools: Move, Jump, Double Jump and Dash. I won’t be fooled anymore. This next level is going to be so much better, I can already feel it!

At the time, we had the privilege of having this excellent intern named Marion Esquian (go see her stuff seriously, she’s amazing!), and together we designed this new level that was going to make good use of this dash ability! Marion made many potential level layouts, but here’s the one that kept our attention, well, my attention!

tiger01

I see something there!
 

Let’s make some modifications so this level pair with my golden rule of thinking: How can I exploit Dash best in this level? ... Some moments later:

tiger02_compare

Dark green: Nothing changed.
Pale green: No more collision.
Black: New collision.
 

Fine, it might be hard to understand anything in the image above and why would I make all these changes, but rest assure, the answer lies within the next image.

Dash anywhere you want whenever you want, well, essentially!
 

Pretty clever isn’t it? You can go anywhere you want without even having to walk or jump! Yes I know, this is amazing, you can thank Marion and me later for that one.

Well, the answer is: Again, NO. In fact, it’s not really making a difference to players. In the end, even though the level was designed around this new dash ability, nobody ever uses these conveniences. But why? Does that mean your golden rule is worthless Dom (that ”Dom” is me btw)?

I wouldn’t say “worthless”, but it sure was misleading this time. But why is that?

There’s one thing I did not take in consideration when thinking about the level design overall, and that is: The goat carrier. Yes, players are especially focused on chasing the goat carrier and stealing its precious as soon as they can. They don’t fool around scanning the environment for an optimized dashing path. Ain’t nobody got time for that. Plus, there’s no way you can chase something moving in an unpredictable manner using defined paths. What you end up doing is basically run, jump and dash straight to your target and NOT use the cleverly designed level.

 

So much thinking going to waste...
 

Yep... What a bummer... All this thinking for not much in the end. Well, not necessarily. It made us realise quite a few things actually. Things like designing a level according to a single rule is not the way to go. Speaking of which, did I update my toolbox correctly when I removed the traps to add the dash? Seems like I did not. I clearly forgot to add the goat carrier in it while I was there and it really needed to be taken in consideration.

I’m a tool (according to someone)!
 

It also made us realise that having multiple level layouts would not add much to the game. What we really needed was much more than that. We needed unique elements that would make every single level memorable!

 

Time to improve the experience

Well, now that we know revolving levels around the dash was not the best direction to take, it was time to think about new elements to improve the experience. God knows we thought and tested lots and lots of ideas and kept only a small amount of them.

 

! WARNING !

If you’ve already had enough of this article, NOW might be a good time to stop! Else, there’s no coming back...

I’m going to go through all the design process we went for each level presently in Toto Temple Deluxe, at least, from the best I can remember.

Yes, I’m serious. All of them.
 

Alright, here we go then, no backing out now!

Are you prepared?

 

First Level: Toto Temple

First of all, we have Toto Temple (yes, that’s how the level is named), made during TOJam. We wanted to keep this level as it was, for the sake of those who played it during the game jam and would recognise it, remembering all the amazing time they had back then. That said, we only made a minor adjustment to the layout to fix a problematic area, but nothing really extravagant.

 

Can you spot the difference? I’m talking solely level layout here, not players, not goats and certainly not colors.

Yep, that small tunnel down there, that’s what we changed. It was changed for two reasons.

First, because it was just long and narrow enough that going in there would, most of the time, means getting your beloved goat stolen.

Second, for some reason, people had some difficulties getting inside without first bumping their head on the top corner, losing some precious time in the process.

 

Things people do under pressure...

And lastly, if for some reason you’re that one guy who loves to dash using the environment, it also gives you more direction opportunities!

 

So many new possibilities!

That’s it for now, but don’t be so disappointed, keep reading and who knows, you might discover great surprises later on!

 

Second Level: Tiger Trap Tantrum

We knew we wanted to implement moving platforms in the game, so we looked into implementing them in the second level (and only other one anyway) we made. Lucky us, we happened to have the perfect spot for that. We would make a trap out of the middle zone! With pretty much no change at all, we gave life to three little blocks!

 

Sophisticated stuff going on...
 

The trap opens and closes in a random order so you never really know how it’s going to behave. There’s a hint though. Just before moving, a stone block will shake so you can sort of predict the order if your eagle eye is sharp enough.

There were only one annoying thing left. When the trap was fully closed, jumping above this huge pile of rocks could prove a challenge for some people.

U bad designer... Y u do dis?
 

We trimmed the thing a bit and it helped, but it’s still not perfect as newer players can have difficulties jumping on it. Nevertheless, I’m happy with the result and hope you are as well!

I know you barely recognise it but believe me, this IS the same level.
 

One last protip before we talk about the next level, you usually don’t want to get caught up in the trap, unless you’re carrying the goat and are skilled enough to make it alone in there. Free points guaranteed while people are waiting outside powerlessly!

Can’t touch this!
 

Here’s what the level looks like after JP, our amazing artist put some colors in there:

 

The tiger and its trap, ready to throw a tantrum!

 

Third Level: Mini Miney Moles

New level featuring breakable blocks! What’s amazing (ok, maybe not that amazing, still, I think it’s pretty cool) with a level filled with things you can break is that the level configuration changes each time you play in it, as players won’t necessarily take the same paths and break the same blocks.

At first, we experimented with small, fragile blocks and bigger, stronger ones. Yes, these brownish blocks can be destroyed just by dashing into them.

Looking promising! But are you sure it’s gonna work?
 

You know what? Small and big blocks do not pair well at all in Toto Temple Deluxe. Breaking a small block creates a narrow passage that hardly allows you to go through, and prevents you completely from going in when carrying the goat (because you get bigger). You know the feeling you get when you’re pretty sure you can go somewhere but the game won’t let you? Very frustrating if you ask me. Easy fix, we got rid of the small blocks before you can say Jack Robinson (found this one on Google, still not really sure who this M. Robinson is, but I’m sure he was a nice guy full of talents).

Much better, but...
 

Now that we only have big blocks, the narrow passages are pretty much gone. Just need to be careful on how they are placed. Don’t worry, narrow passages on the vertical does not pose problem. Let’s try some more layout ideas.

 
 

Enough, I choose you, but not as you are right now!
 

You might be wondering why there is so much white space the more these designs progress? Well, when designing the level, I had to keep in mind two important things.

First, if you remember some of your Toto Temple Deluxe 101 crash course, you know that carrying the goat also means you CAN’T dash anymore, which, in this level, prevents you from digging at the same time (no good). And trust me, in 1vs1 match, players are more focus on stealing the goat than digging around, leading to watching two players battle in a small corridor the whole time... Not so exciting. So yeah, not much of a choice but to make some space.

Second, we already knew what theme the level was going to be, a mine, so we had to put some hidden coins in there! Digging/breaking blocks to get riches, sounds pretty cool right? Indeed, but we also wanted to place 4 big golden coins in there so I needed to leave room for them as well.

OMG, HIDDEN COINSSSSsssss!!!1! Hope you can spot them?
 

Considering all of these, I needed to design something that would strike a good balance between leaving some room for the goat carrier to escape and enough blocks to feel like players have an actual impact on the layout. Easier said than done, but I managed to get something like:

Blue = Golden coins!

We were pretty happy about it, but not sure about the coins placement though. At first, we wanted the central area to feel like a big treasure room so it was logical to set them up like that, but after some tests and thoughts, we concluded that it was a bad idea. And there is many reasons why, such as the lack of possibility:

What, only two possibilities?

  1. Fastest way to the goat, with an extra coin and two if you’re lucky or fast enough. This is the best option. You should always do that.
  2. You might think you will get the same rewards as path #1 and more, but it’s 99.99% positive that someone else will get the goat before you reach it as there’s more blocks in your way, so you basically only get a coin. No goat for you. Unless you’re playing against very very bad people!
  3. Nothing else matter.

Here’s what this setup actually meant: Get the goat and fight within the area that you’ve created doing so. There’s not much interest to dig around as there’s nothing really worth it anywhere else.

Which leads us to the new setup:

Woahhh! So many possibilities!

  1. This is the longest path to take so it’s would be absurd to choose it, unless you really want that specific coin.
  2. Fastest way to the goat, but no golden coin.
  3. A small detour to get a coin before the goat, but by the time you do that, someone probably took path #2 and already has the goat for him.

Personally, I’d always choose #2 because the goat will give more points long-term, so better have it as soon as possible. Plus, it is not said anywhere, but the first one to pick up the goat is rewarded with a 250 points bonus! So yeah, the only reason I would choose path #3 would be because I messed up somewhere and know someone else will get the goat before me. And I would never go with path #1... Unless I really really messed up badly!

BUT, what’s cool with having the coins split up left and right like that is they will tempt players after the initial goat race. Which mean they will most likely go grab them, digging the level in the process and making more room for the fight (plus, you are rewarded for your hard work so might as well do it)!

That said, maybe you’re still thinking that we did not add real new possibilities to go get the goat in the end as path #2 is always the way to go, but keep on reading. We have more coming up concerning this!

 

Time to get rich!

 

Fourth Level: Canopy Contraptions

For the next level, we were trying to find something that would allow players to stop their pursuers from chasing them and get away with the goat. What came to our mind? A door system! We started experimenting with that and turns out it was pretty effective! The way it works is once a player crosses a specific zone, a door closes right behind him and stays closed for a certain time, then automatically reopens.

Later alligator (my aunt used to say that a lot when I was younger)!
 

Our first test was to split the level in half vertically, having a door at the top and another one at the bottom, so blocking a player was worth it and not just a small detour. We already pictured the whole thing with a big tree in the middle (well Alex did). We were clearly going with a forest / jungle theme there.

Nailed it! Lol sure...
 

It did not take long before we saw the big flaw in this design. Only having two doors setup like that, which were the only way to cross to the other side, brought a huge issue when playing 1vs1.

Here’s what happened:

The goat carrier passes through the top door, which closes right behind him and prevent his pursuer from following him. He then stays still, leaving his pursuer with two choices:

  1. The pursuer takes the detour and go for the bottom door, but by the time he does that, the top door is about to reopen. One well-timed shield coming from the goat carrier and he can safely cross on the other side and and escape danger, over and over, till he wins.
  2. The pursuer waits patiently for the door to reopens, but by the time he’s waiting, the goat carrier starts moving toward the middle of the level. Depending on the pursuer’s next move, the goat carrier takes the opposite path and once again, he’s most likely safe.

That means, apart from the goat carrier, this is not fun at all. We needed to be careful on how to set up these doors to prevent situations like that.

We went back to the drawing board and made and tested different layouts. I won’t go in details with all of them, but, as usually, the reason I would drop a level is simply because it is not fun to play in or is just not really working well.

 
 

Getting somewhere, I guess...
 

This last one was sort of fun, but we decided to make some additional adjustments. Considering the theme we went with, we wanted players to play more in the upper part of the level. We decided to move the “bottom cage like thing” to the top and add a little something to spice things up, as if things were not already hard enough.

What’s that down there?
 

There we go, now it feels more like you should play above the ground! Especially thanks to that thing down there we called “The Pusher”. It keeps moving to each sides of the level, dragging anyone who dare to stand in its path along with it! Now you’re asking why did we add something that looks this unpleasant? I thought you knew us better. Yes, this thing can push you somewhere you don’t want to go, but you can also use it as a vehicle to get a free ride to one side or the other if you’re well timed that is!

Beware though, Canopy Contraptions is hard to play and master. All its design involve precise and tricky jumping, as you can see:

Some numbers and sketches.
 

  1. Getting pushed to one side and jumping through the tiny gap without missing without bumping your head and falling back to the ground.
  2. Jumping too early and hitting your head, making you fall down, vulnerable to the pusher.
  3. Doing a double jump in both directions, left then right, or the other way around (some people have trouble doing that).
  4. Jumping in zigzag all the way to the top.
  5. Getting to the platform without missing. It’s pretty tight so if you’re not carrying the goat, better use a dash to get there.

Anyhow, once mastered, I’m sure you will love this level!

 

Such splendid canopy!

 

Fifth Level: Bubble Babble

Get ready for a headache because designing this next level surely gave us one. We’ve been through so much trying to find something fun for everyone that I barely wants to remember it at all. Alex talked about an important aspect in his article Odyssey of a Bubble, which is the “bubble”.

I’m not going to go over it once again, so I’ll just get to the two most important parts of it.

  1. When designing hazards, anything that makes you lose control over your character deliberately is NOT going to be fun.
  2. Turns out the punitive “mine/ball/bubble/whatever it’s been” became a vigorous fish, allowing you to ride it in its belly, changing the way you navigate around in a positive way!

We wanted all players to experiment this new and revolutionary transportation system so we figured it would be a good idea to hook it up with the goat and that’s what we did. Getting the goat also meant getting into the fish! Crazy stuff I know.

What are you waiting for, get aboard you young colorful fellows!
 

Let’s talk about the level now. Navigating with this fish was going to require space. Certainly not a maze of walls. I’ve always had this idea about making huge portions of a level move at once to force players to temporarily battle in a restricted area and now was the time to put it in action. Plus, getting pushed around by big walls while being inside a fish sounded fun so it was a good opportunity to test it all.

After a lot of thoughts, tests, time, trial and error, other tests, other errors, other others, I finally came up with this overkill idea. A level based on a giant face, that would change expression depending on which side of the level is collapsed. It’s a bit hard to understand simply reading these words, but don’t you worry about a thing because I also made these high tech images that will allow you to easily picture the whole thing... Maybe...

 
 

Wooooaaa, such beautiful... Black blocks.
 

Ok, it might not be so evident just by looking at the aboves, but wait until you see the result with some colors on it. Obviously, you already knew about the fish being an important asset of this level, so the theme is not hard to guess. Underwater it is! So, lots and lots (and lots (and lots (and very lots?))) of tweaking later, here’s the result:

 
 

You see, I told you about the expressions!
 

Since there is a lot of void space in Bubble Babble, platforms are somehow hard to reach only using jumps. You will need to dash a lot in there, else you’ll be in trouble. The most troublesome zone is probably the nose though. (In the following images, on the left, what people should do. On the right, what people actually do.)

 

It’s all about timing, and skills.
 

Instead of successfully jumping through the gap, players miss it, bumping their head in the wall. They then dash in the opposite direction but miss it again, and again, and again till they abandon and take another route.

 

Yeah yeah, just timing and skills.
 

Dashing directly through it can also be troublesome as most of the time, players will be slightly off the target, resulting in a fail.

I guess I could have changed the layout to prevent this, but, like I said somewhere earlier in the article, it can be tedious to make everything works well together in a level. Especially in this one since so many things happen all the time, causing lots of issues.

Now be ready for some amazing gif action pack!

OMG, is this for real??? Yes!
 

If you’re curious to watch how JP, our illustrator, drew this complexe level, well, it is your lucky day because he recorded himself doing just that! Watch it right here!

 

Sixth Level: Giga Geysers

Scorching lava! Scorching Explosion! Scorching Geysers! Scorching Fire! Scorching Devils! Scorching Red! Scorching Scorches!

There you go, you should know what this level is all about now? A Scorching Volcano! Pretty much all the credit for this one goes to Alex, our amazing programmer. Did you know that this guy not only is THE best programmer we know, he’s also outstanding at coming up with all sort of crazy gameplay ideas? Well, if you didn’t, now you know!

Let’s start with the first idea he had, rising lava. It was this idea where lava would slowly flood the level. Touching it meant you having a bad time so you definitely wanted to avoid all contact with it at all time. The only way to control this flood was by activating some switches scattered around the level. When done correctly, which mean everyone coordinating and activating them all at once (yes, we were that crazy), the lava would get drained for some time. But wait, we’re not done yet. In case players would fail to do this in time, the volcano would erupt and hurt everyone! Mwahaha!

 

It’s getting hot in here!
 

SOOoooo awesome! Can’t wait to play this crazy level! So yeah, since this whole idea was kind of going nut and, thanks to the good ol’ rule we came up with when developing Bubble Babble, we dropped it with the least of hesitation. Meanwhile, there was this other idea about geysers...

Hi, I’m a geyser. A Giga Geyser!
 

Wait, this is the final product, but trust me, at first, they were something totally different. So different that you can’t even imagine what it used to be. There something really hard to overcome when testing a new idea in a game and that is ugly/unclear placeholder art. It might seems weird to hear, but believe me, when playing with something that you’re not quite sure how it works and you have zero feedback to help you understand it, it’s so arduous to see all the potential and fun in it.

Yes, this is a geyser, why are you asking? Looks undoubtedly clear to me.
 

Yes, what you see here are the inactive and active stances of the geyser. Self-explanatory I must admit. So, like you just understood in the gif above, in order to use a geyser, it needs to be in its active stance. Once it is, you can dash right into it to make it burst, sending you flying all the way across the level at insane speed, passing through collisions!

It took some time to get everything right, but it was all worth it in the end! Furthermore, what’s cool with these geysers is that, once activated, they will burst fire for a while, sending anyone touching it flying away. If you are wise enough, you can stand still next to it while carrying the goat and use your shield ability to make it burst, tricking people into the fire while you wave them goodbye!

Burn baby burn! Burnin'! To mass fires, yes!
 

Alright, enough of the geyser thing, let’s get to the actual level itself. To make good use of this mechanic, we needed to set them in an advantageous manner. We came up with a couple of layout like these.

 
 

Faces, faces everywhere!
 

Lots of good ideas indeed, but harder to put in action than we thought. Most of the time, it was nearly impossible to come up with a good balance between geysers and level layout efficiency.

The main problem with splitting the level in two or four is that if you miss the train, in this case, the geyser propulsion across the level, you are kind of stuck there for a while. Your only options are to wait for the geyser to reactivate, or to just get out of there. In both cases, it can be tricky to catch back up to the goat carrier.

 

Catch me if you can.
 

As seen above, the blue player is long gone before the red one can reach him. Since dashes are hard to perform due to the abundance of obstacles (collisions), it is too hard to chase the goat carrier. There is just too many possibilities where everyone can go.

Anyway, to cut story short, we ended up choosing the last one and, with a couple adjustments, we got something pretty fun that looked like:

Burn baby burn! Burnin'! To mass fires, yes!
 

Did you know that Alex used to call this level something like “Panda of destruction”? I guess some of us can see the face of a panda in this design... Anyway, this “panda” soon disappeared when JP drew over it!

 

Looks dangerous, and hot!
 

One last thing required our attention. How could we teach players how to use these geysers? I mean, they could be seen as pure aesthetic right? I know it’s not always right to force people to do things, but once again, we went overboard and made this big butt setup. We covered the whole level with an extra layer of rocks, only leaving a path to a single geyser, pointing toward the goat, who is enclosed and inaccessible area, only reachable using this specific geyser. Lost already? Here’s what I mean:

 

I see what you did there...
 

So yes, we are forcing players to understand the geysers mechanic, but since this is part of the race to get the goat, I wouldn’t call it forcing it in a bad way. Plus, there’s a small surprise awaiting when you get the goat, which I’m not going to spoil. You’ll have to see it by yourself!

Got some more time you don’t know what to do with? Watch the making of by JP right here!

 

Seventh Level: Rabid Bats

This next level has been created in two distinct parts. One comes from Alex (yep, Alex again, told you he is incredible), and the other one from me.

Let’s go with Alex first. This time, he proposed something about eggs and nests, where the point is to get the eggs and bring them back to the nest for delicious extra points! Pretty straightforward, and fairly easy to understand, if you omit the part where you can only collect eggs while you’re carrying the goat (sorry, no explanation for that one yet).

Omelette du Fromage?
 

And no need to cover them, they hatch as soon as you lay your feet on the nest. Pretty effective I know! In total, there were 5 eggs scattered around the level, and, if you could catch all 5 of them and bring them altogether to the nest, you would make tons of points. Don’t worry, after they’ve hatched, eggs would grow back at their respective positions (sorry, no explanation to why eggs would grow back either... We live in such a strange world...).

It was really fun to watch a player carrying plenty of eggs behind him, similar to Yoshi Island!

 

Ahhh, so many good memories.
 

But then came the inevitable. Problems. Lots of ’em. First, stealing the goat also meant stealing the eggs. Sounds awesome when I say it like that, but with a single nest to bring them back to, no need to be a genius to know exactly your next move, thus, making you an easy target. And what’s worst? Losing the goat while having all the eggs and seeing the thief get all the credit for your hard work... Almost makes you wanna cry inside, or hit your friend to the face (in real life).

Well, what if we add some more nests then? Not good, it made the whole thing lost all its excitement as nobody would risk picking up all the 5 eggs at once. Only solution left was to remove all nests, which is what we did. So how do you make these eggs hatch now you ask? We came up with a really outstanding idea where, upon losing the goat to someone else, all your eggs would hatch, and, base on how many you were carrying, you would make points accordingly!

All your eggs are belong to you.
 

We stuck with this for a while, but something was still off. I hated the way you thought you were disputing a close match when, all of a sudden, you manage to steal the goat just to see all these eggs hatch into a “great quantity” of points, which sets your rival way ahead of you... Worst, sometime, stealing the goat meant certain defeat because of these extra “unexpected” points. We had to do something about this, but the solution was slow to come. We didn’t want to get rid of the way you carried the eggs behind you as it was both satisfying to watch and a great indicator of how many eggs were left to pick up, thus, building up the urge to stop the goat carrier from picking the ones left.

It’s been heartbreaking, but, for the sake of the game, we dropped the egg trail. Sorry Yoshi. We came up with a new way to reward points for taking the eggs. Instead of following the player, they would instantly hatch into points as you touch them, then the left ones would grow bigger and bigger each time to indicated they were worth more points. With this, we kept the feeling of urgency to stop the goat carrier from collecting all the eggs, as well as avoiding the issue with the enormous burst of points coming from hatching 5 eggs at the same time. Wow, that was quite a journey! And I did not even talk about the part where we decided to completely swap the goat itself for a giant egg.

Wut?
 

Let’s get to my part now. This is something I’ve had on my mind since the very beginning, well, almost. The main idea was to have a level switch between two configurations each 15 seconds or so. I had these things I called “phasing” blocks. They are basically just blocks that periodically disappear and reappear. I made some layouts with them as you can see right below:

 

This is going to be amazing!
 

That’s a good start, but there was this one annoying issue I was trying to figure out how to work around. Since there’s no death in the game, a block phasing back to solid collision could trap a player within it, and since they don’t phase that often, spending 10 seconds or so trapped wasn’t such a good idea. We had a couple of solutions like seeing a halo of yourself through the block to let you figure out how to get out of there, but it didn’t felt really right. Another one would have been to postpone the block’s apparition until nobody was colliding with it’s spawn area, and to be honest, that one could have worked, but we did not test it. Anyway, we tried other ideas, and sort of abandoned the thing, or so I thought!

Later during development, I tried again using the good old moving blocks. I set them up so they came out of outer wall, making it impossible to crush players in some weird ways. It was just a matter of timing!

I then decided to merge Alex’s egg idea with this new level and BOOM! New level layouts!

 
 

It’s a shame for the phasing blocks, but sometimes we gotta do what we gotta do you know.
 

Okay, it’s not really shown in these designs above, but the blue blocks all alternate between two configurations. The hardest part with getting a good dual layout level is making sure both layouts are fun to play in. Most of the time, you end up with a good start, then, when the level shifts, it become mediocre... Or it just don’t work as you end up creating collisions that crush players in some way that you did not foresee. That said, it took some tries, but we got something with potential that looked like that:

 

Cool, all done then?
 

The first configuration was acceptable. There seemed to be enough room and possibilities to move around easily , but if you look closely, you notice that there’s not much to do in the upper area.

Then, when the second configuration comes, pretty much all the bottom half of the level is dead end, as shown in the images below.

 

Why didn’t you see that at first?
 

Fortunately, only small modifications were needed to make everything right. It does not concerns the layout specifically, but only the position where some “blue collision blocks” start. The dual layout now looks like this:

 

More possibilities = better!

As you can see, this is now much more balanced between the two configurations. The big dead ends in the four corners are still there, but they are meant to be like that. As the goat carrier, you need to be careful not to venture in there and get trapped in while trying to snatch the eggs. Better wait when it’s open and safe or about to!

To illustrate better how they switch between the two configurations, here’s another astonishing gif!

Ta-da! Now you get it don’t you?
 

You might be wondering where did the eggs go? Well, we changed them for shiny gems instead, that turn the color of the current goat carrier, letting him know he’s the only one who can collect them. Pretty clever isn’t it? And if ask about the theme, I think it just, you know, kind of came out of the blue? Or I'll have to ask the guys about it.

Grow my gems, grow!
 

That’s been a long journey, but it was all worth it in the end. Rabid bats is a fun level to play and eggs/gems add a lot to the excitement! And wait till you hear the music for this one.

 
 

Bats, bats everywhere!
 

Oh, and before going on to the next level, here’s what carrying the gems à la Yoshi looked like:

I know, it looks and it was pretty fun but we had to do what we had to do...

 

Eighth Level: Goat Gate Galore

There’s one last level to talk about. Hope you’re ready cause here I go. I’m not going to surprise you by saying that once again, the whole idea came from Alex am I? This time he proposed portals. I think Alex really dig portals. Everytime we make a game, he talks about portals! I don’t think we’ve ever used them in all of our previous game, so I guess it was about time we grant him his wish.

First thing that came to our little mind was Pac Man’s portals but we don’t think it was the best way to make good use of them.

Too classic (and cramped).
 

We then thought about isolated zones, accessible with color coded portals, even if usually, we tend to avoid color coded stuff as a member of our team suffers from color blindness and he’s certainly not the only one on earth! I still went ahead and made some tests to see if I could come up with something functional.

Hummm, maybe, maybe not, who knows (but too cramped)?
 

As you can see, it’s kind of problematic to obtain something not too cramped. And again, same problem as Giga Geysers, splitting a level in half is NOT a good thing to do.

Plus having multiple portals doesn’t add much, except for more confusion in the heat of the fight. So, what if all portals would lead to the same place instead? It wouldn’t be too hard to understand and you would not get lost as you would know exactly where you’re supposed to reappear.

 
 

We are getting there, I can feel it...
 

So we decided to go with a single central portal and I lied a little about the “not getting lost” thing. We added one last modification to the portal system that makes it somehow confusing. The middle portal will rotate clockwise each time someone comes out, so you need to pay attention to its current orientation otherwise you might lose track of your character for a second or two. Especially when two players get in almost simultaneously as they come out in two totally different direction.

Insane stuff I know!
 

That was getting pretty fun, especially to trick people into the portals! BUT we were not done though. We also had this idea about force fields. You know, the kind of things that allows you to go through from one side but not the other? Well, our force fields don’t work like that, but I guess they are pretty similar. Once you pass through an “activator” while carrying the goat, a lazer-ish light of your color appears right behind you (okay, I also lied about the color thing).

Woah, is THAT what you call a “forcefield”? Lame...
 

So, a force field sharing the same color as you are will not allow you to pass through it, which happens to prevent you from backtracking. Yes, that’s how they work so plan you way ahead if you don’t want to corner yourself too soon.

As you may have already noticed, this level seems pretty futuristic style, and that’s pretty much why we decided to go with an alien-ish ambiance as the theme (I think so). It does not make that much sense with our universe but whatever, I guess!

Here’s the final design by the way:

Yellows-ish means force fields.
 

Like in Giga Geyser, there was one thing left to teach the player: What are these flashy things and what are you talking about with your portals? As clever as we are, we surrounded the goat by force fields from all colors, blocking the easy way to reaching it and forcing people to take a portal on either sides to get inside. You know what they say, if you only have one stone, kill two birds with it! Or was it something else? Anyway, nevermind...

Disco inferngoat!
 

This is probably the most complex and sophisticated level we’ve created in Toto Temple Deluxe so far!

 
 

No, there’s no dead birds in there...

 

Conclusion? Not yet!

Now that you’ve read all these things, you might be thinking: There’s nothing I don’t know about Toto Temple Deluxe’s levels, mwahaha! Guess what? I’m not done! We made some improvements here and there so don’t quit already, keep reading, you’re almost done, I swear, it’s true this time.

 

Revisiting: Toto Temple, with a chest

After longs long discussions around leaving this level as it was or adding a small touch that would make it a bit more memorable, the second choice won, which I’m very happy about cause I’m the one who started it!

Sure, Toto Temple is the only basic level in the game. No gimmick or unpredictable feature thrown at you, which makes it a premium choice for beginners. They already have their hands full with this egg-laying goat anyway. Still, I wanted to add a little something to spice things up. Not in an obtrusive way though. I had this big chest idea that, at a random moment during a match, would unleash its riches, ready to be collected for easy extra points!

Wow Dom, talk about an impressive chest...
 

Wait, there’s more to this chest, it can move around, like magic! Isn’t it magnificent? So during the match, it will wander around and because it blends well in the background, you don’t really notice it. Yes, we did that on purpose so it would stay unobtrusive for new players. Then, at a given moment, the god down there will wake up and activate the chest (he just screams at it, don’t ask me why), making it turn golden and spread tons of coins around. Be quick and grab them!

Now THAT is an impressive chest!
 

Secret note #1: Chest spreading coins around + golden magnet can be ultra powerful. Secret note #2: But wait till you see what happens with black magnets! Quite the spectacle.

 

Revisiting: Mini Miney Moles, with hard blocks

Like usual, there was this one thing left that annoyed me with this level. Most of the time, players would find themselves breaking all the blocks from the bottom row and simply successively steal the goat from one another until the match was over, which was really painful to watch as there is much more to this level.

Please no more of that...

I decided to attempt the impossible and dared to bring modifications to the layout to maybe fix this problem. I came up with two not too terrible possibilities:

#1
 

#2
 

It was a tough choice, but, following rigorous tests, #2 won. Now I feel way better for not seeing too many people spend the whole game fighting on the ground.

One last thing, do you remember how the main idea of this level was that every match would create different layouts due to players taking different paths? Well, in the end it was pretty much always the same with 4 players... No block left, which kind of ruins the whole point.To reinforce the original idea, we thought of adding “hard to break” blocks. These blocks are simply harder to break, thus, increasing the probability that every match is different as they should last longer. I created some patterns (yes, with my two little hands) to make sure things were not unfair and the result was actually pretty satisfying I must say.

 
 
 
 

Trust me, these hard to break blocks are wonderful!

Even more, theses new blocks change how you start a match for real this time. Remember the premium path #2 (it was the only way to go back then)? Well, now everything is different as each time the level starts, you must figure out the best path to get the goat. Trying to pass through hard to break blocks will certainly delay you enough to lose the race so don’t do that! 

So yeah, even though there might still be two real viable paths to get the goat, the fun comes from finding them first, right before the match starts!

 

Cool stuff Dom, can’t wait to hear more!

Not to disappoint you, but I’m done. This is it, I told you everything I can remember about designing the levels for Toto Temple Deluxe! I could keep going, but that would be pointless as other things are really just simple adjustments here and there that did not have any major impact on anything, or maybe I’ve just forgotten...

Conclusion (TL;DR)?

After all this read, you’re probably still wondering what IS this secret to designing the perfect level aren’t you? If so, you will be devastated to hear that there is no such thing as a “perfect” level in a game if you ask me. There will always be something to improve. Something that can be done better or in another way.

What you ultimately want to give to players though, is an ideal environment in which they can enjoy whatever you’d like them to experiment at its finest. Whether it is breakable blocks, fishes, portals, geysers, special events or anything else, your goal is to build levels that will make the best out of them and ease players into them!

And remember that you will probably end up creating way too many iterations of way too many levels until you get something that satisfies you (if not, you truly are a genius and I’d like to meet you). There is a lot of trial and error involved and bringing new mechanics will inevitably make you start over from the beginning, but hey, that’s part of the creation process, might as well get use to it!

Obviously, everything I wrote in this article comes from my personal experience as a designer (which I have no scholarship for so all advice are more than welcome). It is mostly specific to Toto Temple and might not translate wholly to other games. It is certainly NOT the absolute way of design so don’t only swear on this. I know I will probably stumble upon this article later in my life and tell myself: God, what an idiot I was back then...

Hope you enjoyed this way too long article. That said, if you have any questions or advice or comments or even insults for me concerning Toto Temple Deluxe or how I approach design, please let me know in the comments.


Related Jobs

YAGER Development GmbH
YAGER Development GmbH — Berlin, Germany
[05.24.17]

Content Producer (f/m)
Square Enix Co., Ltd.
Square Enix Co., Ltd. — Tokyo, Japan
[05.23.17]

Experienced Game Developer
Gameloft
Gameloft — Barcelona, Spain
[05.22.17]

Senior Producer
Playwing
Playwing — Montreal, Quebec, Canada
[05.18.17]

Gameplay Programmer





Loading Comments

loader image