itch.io is community of indie game creators and players

Devlogs

Impossible mechanic in 16 hours | Global Game Jam Recap

Tale of Bagua
A browser game made in HTML5

View the project on nickydu.net.

Introduction

Tale of Bagua is a 4D puzzle game developed by a team of three, in which the player overlays portals to access different times in the past. Portal effects are multiplied in the overlapped area, creating a kaleidoscope of historical events. Its idea was sparked on Global Game Jam 2023 and its demo was designed from scratch in 16 hours.

Seemingly Impossible Mechanic Design: “Portal kaleidoscoping”

The idea is simple. The player moves a window on the screen. The window reveals the view of another world, and the player can walk between the two worlds freely through this window.

If world A has an obstacle, simply switch to world B where that obstacle doesn’t exist, walk to your target position, and switch back to world A.

What’s more, one can overlap these portals, creating a new portal in the overlapped area, containing a new level.

To achieve this mechanic in-game, we need to overcome these problems:

  • Visuals: The portals and their overlaps should display different scenes (and lighting) accordingly.
  • Colliders: A portal should cut colliders with its edge.
  • No-Clips: When switching worlds, one might get no-clipped into a wall and get stuck in there. One might also get squished into a wall when the portal moves.

With a team effort, we managed to achieve the same mechanic with a slightly different technical approach using Unity’s stencil feature. As a Level Designer, here’s the solutions I came up with:

  • Visuals - Using one directional light for the daytime levels and baking the nighttime levels individually.
  • Colliders - Only one set of colliders is up at one point.
    • Logic: If the player is overlapped with X portals, activate the colliders of Level X+1
    • Example: The player is standing in 2 portals, meaning they should be on Level 3. Activate the corresponding colliders.
  • No-Clips - Making the moving portal “push” and “pull” the player to a place that won’t no-clip.
    • Logic: When not activated, the colliders of each level turn into triggers. Make a portal itself a ring-shaped collider.
      • To prevent getting stuck in the next level’s collider: If the player touches any trigger of the next level, the ring-shaped colliders on the portals cannot be entered. This will result in the portal pushing the player until they get out of that no-clip hazard.
      • The prevent getting stuck in the previous level’s collider: If the player touches a trigger of the previous level, the ring cannot be exited. This will result in the portal pulling the player until they are at a place that won’t no-clip.

Level Design: Making intricated puzzles with 5 overlapping mazes

Now that the core mechanics are done, how to make this “switch world, pass obstacle” trick complex and fun? As a Level Designer, these are the directions I’m going for:

  • More switches and deeper switches. To collect the heirloom in each level, a player needs to switch multiple times. The deepest ones go across multiple levels.
  • More walking and no sitting-still solution. The player has to explore the entirety of a new level before, on top of switching worlds, in order to get the heirloom.

And these are the solutions I applied:

  • 3 shared spaces with neighboring levels. A level should share at least 3 spaces with the previous and following levels. These 2 sets of shares spaces should avoid overlapping.
  • No shared space with 4 levels in a row. For example, level 1-4 can’t share the same vacant space.
  • Avoid large vacant spaces. Use long alleyways and small spots.
  • Each level has a distinct color pallet. The deeper a level is, the simpler and more monotonic its visuals are.
Level 1 and 2, sharing 6 spaces and requiring 3 switches

What went well

  • Mechanic Design-wise, we fully achieved what we wanted to have in the game.
  • Level Design and difficulty-wise, we created intricate puzzles that took our players over 30 minutes to complete. For a 16-hour project, it’s more than enough.
  • Our focus on whiteboxing paid us back with an almost bugless prototype.
  • The concept and narrative fit extremely well with the Game Jam’s theme “roots”, telling a story of a Chinese kid who uses his family heirloom “Ba Gua Mirror” to travel back in time, searching for his ancestors.

What went wrong

  • As a producer, I focused too much on playability and didn’t manage the 3D art tasks effectively enough, leading to many last-minute visual problems.
  • As a level designer, I went all in to design the most sophisticated puzzles and didn’t care about making a tutorial. This results in the new players not knowing the basics.
  • It’s almost impossible to see anything when the player is at the final level. It’s an actual kaleidoscope with 20+ sections. Only one of them shows level 5, and you need to peek through that tiny hole to find your way.
  • The ending of the narrative is rushed and didn’t reveal the plot well enough.

What next

We want to make a whole series of games with this mechanic because of how brilliant and refreshing it is. Here’s what we will do.

  • Mechanic Design
    • Make the portals easier to control. More UI elements to indicate the layering. Add responsive animations.
    • Add a fullscreen option that expands selected portals to cover the whole screen, so that you won’t be peeking through a tiny slit when you’re 5 levels deep.
    • Add conversations and other narratively beneficial things to increase story density.
    • Add mini puzzles to increase overall variety.
  • Level Design
    • Playtest multiple times to re-adjust the difficulty curve.
    • Add a tutorial level. Make the first chapter easier, at about 15 minutes avg playing time.
    • When everything is set, we are ready to make chapter two.
  • Visuals
    • Bake each level individually.
    • Optimize assets and palettes. Make sure every part of a level is equally recognizable on first glance.
  • Narratives
    • Add more motives to the main character’s actions.
    • Explain more about the heirlooms: what is a Ba Gua mirror? How is it related to Ying Yang and Chinese history? Why can it bring us back in time?

Summary

Tale of Bagua is a success for 16 hours of work in a 2-day game jam. We want to push the idea further by finishing other aspects. Our short-term goal: make one interesting, polished, and visually stunning chapter to pitch our game for potential investments.

Download Tale of Bagua
Leave a comment