Making the Submarine Game

When I was a very young boy, I spent a great deal of time on my Amiga A500, marvelling at the rich parallax landscapes, colour palette tricks, and the early, early beginnings of the dawn of the era of computer generated, real-time 3D graphics. I was lucky enough to not only have a large collection…

When I was a very young boy, I spent a great deal of time on my Amiga A500, marvelling at the rich parallax landscapes, colour palette tricks, and the early, early beginnings of the dawn of the era of computer generated, real-time 3D graphics.

I was lucky enough to not only have a large collection of games, but to catch a glimpse of the demoscene of the day. Vivid, bright colours, text warping around the screen in ways that pushed the hardware to the absolute limit, bit blitting tricks that made the system do things it was never intended to, epic soundtracks were mandatory.

Almost none of these have aged well, but at the time it was awe inspiring, and motivated me to start learning AMOS and C at a very young age indeed with one sole focus – one day I would be a game programmer.

Eventually I would get my first PC, a 75MHz Pentium with a whopping 8MB of RAM. id software released Quake, and it shook the world.

Shortly after that, things really shifted gears for me when the internet became widely accessible, and I was able to take what I’d learned from the “C++ for dummies” books and start learning from game development articles, some of them cutting edge. I learned about spatial partitioning, procedural generation, inverse kinematics, vector and matrix math, and everything else that was all the rage of the day.

I never did realise my dream, at least not commercially, until this year.

It is with great pleasure that I present to you, on behalf of Yellow Sub Creative, the Submarine Game!

Traditional rainbow cycling colours, pixel font, moving text and of course, highscores.

This game brings together many techniques that I’ve picked up in my lifetime as a programmer.

This is my first go at a React based game, written in TypeScript. It uses React Three Fibre to connect THREE.js up with React. I couldn’t find a pseudo-random number generator that met my exact needs, so I built one based on this article. I wrote a shader to achieve the pixelation effect. GSAP is used to provide animation. Erin Catto’s legendary Box2D physics engine is responsible for collision detection and response, delivered via Kripken’s WASM compiled version of the engine. All this is then packaged up into a WordPress plugin, which uses WordPress’ REST API to deliver a highscores system to record highscores (and also to store replay data in case of any foul play ­čśë).

No retro style game would be complete without a soundtrack, so armed with a box full of composition tricks and sound design knowledge, Reaper DAW, Matt Tytel’s Vital Synth, BlueARP, Waves C6 multiband sidechain compressor, and Izotope’s Ozone 10, I composed the soundtrack and designed each of the instruments from scratch, imitating the bleeps and bloops I remember so fondly from my childhood.

Each of the instruments, including the percussion, is built from simple saw, square and triangle waves, with some use of white noise for the snare and cymbals. This produces the kind of sounds you’d expect to hear from a traditional Gameboy.

Final mix of the soundtrack in Reaper.

The soundtrack opens with diminished harmonic motion, but voiced with major arpeggios, this gives a whimsical sound but with a definite feeling of tension and build-up, complimented by the contrary motion of the arpeggios and bass line.

This diminished motion is used throughout the first half of the piece. The major quality of the introduction is retained by use of the Dorian mode, this gives a majestic and almost regal feel to the lead, whilst the rapidly arpeggiated rhythm in the background plays major chords to reinforce the happy and triumphant feel of the first part.

The lead line is used to modulate around keys in a diminished fashion, to give a feeling of motion, never allowing the listeners ear to fully settle on to any “home”.

This tension is then later resolved in the second part as the song modulates to a more traditional minor key in parallel with the opening tonal centre of the piece. A second lead instrument comes in and plays what sounds more like a guitar improvisation than the repeating motif of the first lead.

All in all it was a pleasure to build, it’s both frustrating and rewarding to play, and I’m overly pleased with it!

We have plans to potentially introduce some AI based features in the future, but for now, you can find the game on any error page of this site.

Happy submarining!

Live Life Yellow Insights

Take a deep dive into our philosophy, opinions and moments from our lives.

0