Mind Over Magnet Devlog - November 28th

Hey Patrons! Me again, with the second Mind Over Magnet update post.

In the last post I showed the game’s new options menu and UI. There was some great feedback in the Patreon comments which I’ve implemented. And I also just spent a lot of time testing that it all works properly. Hours and hours of pressing buttons and doing stuff in a weird order to try and find bugs and awkward interactions.

The next thing I wanted to improve was the pause screen.

So I really like this thing in the game Tunic where, when you pause the game, it turns the current screen into a super pixelated, CRT-filtered, retro-style version of the game. And so I wanted to do something similar for my game.

Here’s how it works. When you pause the game, it instantly takes a screenshot of the level and puts that image on a canvas that’s sandwiched between the game and the pause menu. Now I can apply a shader to that image to add effects.

I initially experimented with a pixelation effect. This didn’t work very well for the, in retrospect, obvious reason that the game is already pixelated, so making it more pixelated just looks weird. It would make sense for a 3D game (hence: Tunic), but not mine.

I also tried making it look like it was on an old CRT monitor - with scan lines, grain, a bright reflective bloom effect - but I think it looks a little too realistic for a pixel art game. Again, works for other games (it definitely has a Her Story vibe), but not mine.

Always a good lesson - it's fine to copy stuff, but make sure your vision is aligned with the game you're aping!

So in the end I went for something more subtle. It has scanlines, which darkens the image (to make the buttons pop) and makes it look retro. There’s a bit of a vignette effect. And I put on a subtle bit of chromatic aberration (where the red, blue and green colours are offset slightly) to give it a distressed, broken TV look.

Here’s the shader graph for the chromatic effect. It samples the image, offsets it slightly, tints it red, and then blends on top of the original image. Do the same with blue and you’re done. (I didn’t need green, in the end, for the effect to work).

Okay. Enough UI nonsense! Let’s get back to making the actual game.

My next goal was to make the very first level in the game - the opening cutscene. The level begins in a large sewer pipe. I showed it briefly in the last devlog, but here it is with lights, details, and whatnot.

And here it is in the context of the rest of the level. After you take control of the robot you can move along the pipe and pop out the end… to appear in the sewer itself. And then exit through the door to start solving puzzles!

Now to build the cutscene itself. Thankfully, I had built a pretty robust cutscene system just before I went to GDC. It was initially just for having conversations between the robot and the magnets, but with a little tweaking I made it work for any type of cutscene.

Here’s how it works. There’s a cutscene manager, which has all of the steps for the cutscene - and goes through them, one by one. The steps themselves are little scripts called “Dialogue Chunks”. A chunk can be a bit of dialogue, a delay, or - the new thing I added this week - a Unity event.

So for example in the image below, there’s a delay of one second, then it triggers an event (which shows the game’s logo), then it triggers another event (which makes some particles play, and a sound effect).

It’s a simple system… but super powerful! I can easily build, tweak, and re-time cutscenes just by dragging scripts around or changing a few numbers. And so in a short period of time, I had made the cutscene which you can see at the top of this post. It’s not perfect, and the game still needs a final soundtrack, but it’s almost there!

One final thing I did was replace the basic square end-of-level door, with a sort of sewer-style pipe. This better matches the way the game uses pipes to move from level to level - now everything is more unified.

I also did the sound effects for it. I figured out a new way of doing sound design. I basically recorded a video of the animation playing in Unity. Then loaded that video up in Premiere. Now I can play with sound effects to my hearts content - overlaying sounds, changing the timing, playing with EQs and effects - and can instantly see how it lines up to the final game. Then I just export the sound and have it play as soon the animation does! Nice.

Okay. We're getting closer now. My grand plan is to have World 1 finished before the year is done. Then I can have a nice Christmas break… before starting on the rest of the game.

Ta-ra

Mark