GameMakersToolkit
patreon
Mind Over Magnet Devlog - November 28th
🕑 Added 2023-11-28 08:25:21 +0000 UTCHey 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
Comments
SHAMANWOLF 1594
So cool!!
Benoît DAMBRUN
I love the details in the pipe exit, gives so much sense to the whole game
robert hickman
Given that the effect in a CRT would be caused by bending the cathode rays more towards the point where the magnet is, I'd guess you could simulate the effect by rendering the scene to a texture. Then use a shader to render that to a full screen quad, taking the X and Y coords plus an influence bending the lookup towards the center of where the 'magnet' is with some falloff. It would probably be a bit more complicated as the magnet may bend the beams between the aperture grille / shadow mask and phosphors, causing the cathode rays to hit the wrong phosphor colors. There are a ton of CRT emulation shaders in the console emulator space, so presumably someone has researched such things.
Nate Bell
It's fun to see the themes and polish coming together! Are there any security cameras or themes around being observed in the game? I ask because that CRT style pause screen immediately made me think of someone watching through security camera feeds.
asbo
I also felt like the dripping/splash animations aren't fluid enough in contrast to the water along the bottom of the pipe. Especially because they end up in the same part of the frame, there needs to be a few more frames of the drop falling and of the droplets coming out of the splash to feel consistent.
Dalen W. Brauner
THAT'S what was bugging me about those!! Didn't say anything because I couldn't put my finger on it... seems super obvious now.
Ryan (ShadowDx) Sullivan
This rules. Really inspiring work Mark!
andreilsero
Cool! 😍 thank you!
Eric Peterson
Less about this video specifically (though it highlights it) but just wanted to say how continually impressed I am with your commitment to the level of polish and quality you’ve put into this project. A lot of people’s first games (very reasonably) make some concessions on polish in order to successfully ship but you’ve kept a really dense level of polish throughout. Super inspiring and well done. You should be very proud!
Game Maker's Toolkit
Yeah, I hope to show a bit more off in future eps of Developing!
Alan Vitek
Mark, always so inspiring to watch someone else on their gamedev journey. Sound effects have always been a struggle for me but the idea to use video editing software like premiere to experiment with timing is an awesome idea! Best of luck with world 1 :)
andreilsero
Hi Mark! Looks super nice, great work so far! Quick question (don’t know if maybe someone else already asked it before): would it be possible to have a glimpse or a quick look at how The Plan™ looks in detail? I mean, I get how you’ve planned it out from your video, but maybe just actually see it can be useful and inspiring for those of us that are getting on the same journey :)
Matt Kimmich
Yeah, that was my idea too. The kind of effects you got on old monitors that made it necessary to degauss them. Not sure it'd fit with the overall aesthetic of the game, but it would be a great fit for the magnet theme, so a less extreme version (like the thing you suggest) could be nice. Says the guy who wouldn't have to code it. ;-)
Kevin Vognar
Looks nice! Shouldn't the drops make sound when they hit the water instead of when they start falling?
Game Maker's Toolkit
I like that idea! I'll put it under my "if I can find time" polishing list: :P
Willhart
I think the logo could stay up half a second longer, so you have time to read it. I always try to take into account the slower readers (font makes it harder to read).
Tobias V. Langhoff
Love the subtle effect on the pause screen. Have you ever seen how a magnet interacts with a CRT? It makes for a trippy effect, maybe a little too trippy for a pause screen, but it'd be fun if the chromatic abberation was stronger near the mouse cursor or something, as if your mouse was a magnet passing over the CRT...
