The Global Game Jam (GGJ) is the world's largest yearly game jam event. It is a challenge for 'game creators' from around the world, to get together and build a game, from scratch, based on a common theme, all is just 48 hours.
Though we didn't officially register with GGJ and sign in at one of their venues, a bunch of us thought it would be fun to take up the challenge from home. So Casper (developer), Daan (artist), Samantha (artist) and I got together and camped out at Casper's to see what we could hash out in one weekend.

We started late on a Friday evening and the first (and smartest) thing we did was to finalise our game concept before calling it a night. This year's theme was WAVES. So began the brain storming... a lot of ideas started flying about! Some good, some mediocre, some impossible, but one stuck and evolved into something we felt would be super fun to build and play. And so we came up with..

A MULTIPLAYER WIZARD BRAWLER IN OUTTER SPACE!

Ok, right. I know it doesn't look like much yet, but this is just a quick hashed out paper prototype. But here is what we had after two insane days of work.

In this game, every player is a wizard who must defend their crystal tower, while trying to destroy their opponent's by draining it's energy. If a player's tower is destroyed, it's game over for them. If this sounds easy enough, you'd be right. That's why we created a treacherous and unstable arena of revolving stones and falling platforms. Still easy? Yeah, that's why we added the ominous black hole at the core. Go too close to it and be prepared to be stringified into oblivion.

May the best Wizard win!

Besides maneuvering around an unstable platform, the players can do the following three actions: heal their own crystal tower to survive, drain their opponent's crystal tower to defeat them, and use a super power called shock-wave to shove each other of the platform or into the deadly black hole at the core!

We spent a good 48 hours mashing away at our laptops, taking breaks only to sleep or get something to eat (and watch an episode of Rick & Morty). The best part was that even though I only met Daan and Samantha for the first time that weekend (I knew Casper from a previous game jam), we had chemistry and made a great team, keeping each other motivated right to the end.

Being my first game jam, I'm proud that I got to make some valuable contributions to it. I programmed the character movement, calculating which platforms they were on and if they were in motion, stable or falling into the depths of nowhere. I also build the shock-wave superpower that blasts each other around. Finally, I also tweaked the variables of the game, calculating the chance and dynamics of the game to make it "feel just right".

It's always a bit tricky building features that revolve around chance, because it's so subjective. Some find it too fast, other's too slow or too easy, etc. In the end however, with a lot of team play-testing, we struck a good balance making the game not just playable, but fun and addictive.

If you have Unity and a few compatible XInput controllers, you can grab the source code from https://github.com/noahdecoco/ggj2017 and play the build yourself. Hard as we worked, there wasn't enough time to implement a menu system, so you have to restart the game in Unity after every battle.

Over that weekend, I documented our progress so that I could put it all in a montage. It's always fun to see the evolution of a project. Hope you enjoy it!

The Diabetes Foundation launched an exhibition in Central Amsterdam to raise awareness about sugar consumption in the Netherlands. But how do we make this a fun experience, one that's engaging with their audience? Their creative agency (Lemz) proposed an educational interactive mirror that could 'x-ray' your body, test your knowledge about sugar levels in foods and highlight the internal organs most affected by sugar and diabetes.
And we at Magic Bullet, we turned this idea to reality.

The technology behind this magic is Microsoft Kinect + Unreal Engine + one giant screen! Given that I had little experience in Unreal and had to launch this project in 4 weeks, I dove straight into the deep end and learnt on job.

This intensive crash course I plunged into was a great opportunity. Unreal Engine is something I always wanted to play with but never found the time to, and this project required me to cover a lot of ground including:

• Lighting
• Audio cueing and synching
• Camera and Perspective
• Materials, Textures and Shading
• World and Relative Transformations
• Skeletal Meshes, Rigging and Sockets
• Trigger Collisions
• UI Widgets and Animations
• Events, Functions and Macros
• Blueprints and a bit of C++

It took me a while to get comfortable programming in Blueprints. I'm more of a 'code needs to be written' kinda guy, but surprisingly found dragging and connecting nodes to be quite satisfying too. Blueprints made it easy to start playing around in Unreal without having to know C++.

I used the Kinect4Unreal plugin by Opaque Media, which made integrating the Kinect with Unreal a breeze. Their team was also very helpful whenever I had questions, a great service specially when considering they give away this plugin for FREE.
I plan to write a tutorial showing how easy it is to animate a skeletal mesh using their plugin, but for now, it's important to know three things:

• The plugin works with the latest version of Unreal (4.13 at the time of writing this)
• Use the Kinect Interface component (rather than the Kinect Player Controller thats deprecated)
• Unfortunately, the 'mirror' option for the meshes doesn't work out of the box and requires a lot of manual joint rotation tweaking, but giving the skeletal mesh a -1 on the y-scale is an easy solution to this issue

The exhibit was covered by the media on several websites and TV channels like RTLXL, RTL Nieuws, Parool, Binnenland, and radio stations Radio 1, 538 Nieuws, ANP, Q-Music & BNR, with the Interactive Mirror being a regular highlight of the show. The famous and animated chef and food TV presenter, Pierre Wind, almost got run over by a tram in his excitement while filming his piece on our exhibition.

This was a really awesome project to work on, mainly because I finally had the chance to fool around with Unreal. Now I'm keen to learn and do more things with it! If you're in Amsterdam from the 7th to the 13th of November'16, check out the exhibition at Leidsestraat 46, 1017 PC Amsterdam.

Tetris might seem like a simple enough game upfront. It's easy to understand and simple to play, but that's exactly what makes it challenging to build. There are many nuances to consider that only come to light when actually building the game. The most challenging part I faced was making sure that the pieces don't go off screen or overlap other 'fixed pieces' when rotating.

Each piece, or sigil as I like to call them, is made of a 4x4 grid. The green cells that are 'solid' and have a value of '1'. The cells with the value '0' don't get rendered in the final production, but I've coloured them a translucent grey to demonstrate the grid concept in these gifs. Below is the code for the mirrored "L" piece in the first gif above.

[
    [0],[0],[1],[0],
    [0],[0],[1],[0],
    [0],[1],[1],[0],
    [0],[0],[0],[0]
]

To add my own twist to the game, I made a 'bomb' sigil which explodes and destroys other blocks in a 1 cell radius. This made the gameplay more interesting than I imagined. Sometimes they helpfully get you out of a sticky situation, but sometimes, they force you to demolish what you tried to carefully build making it harder to clear rows.

Below we have code that rotates the sigil. It might seem a bit daunting at first, but all it does is just shift the 1's and 0's around. Well, first it checks if the sigil is a bomb. Since bombs are only 1x1, we don't want to rotate it. Then, it creates a temporary sigil (tempSigil) to calculate where the real sigil (_currSigil) would be AFTER it's rotated. And if calculations return that the temporary sigil isn't restricted by other fixed blocks, we set the real sigil to the temporary one.

var _rotate = function() {
    if(_bomb) return; // Do not rotate if it's a bomb
    var tempSigil = [];
    var i = 0;
    tempSigil.length = _currSigil.length;
    
    for (i = 0; i < _currSigil.length; i++) {
        var x = i % _row;
        var y = Math.floor(i/_row);
        var newX = _row - y - 1;
        var newY = x;
        var newIndex = newY * _row + newX;
        tempSigil[newIndex] = _currSigil[i];
    }
        
    // Only rotate if the sigil has space to rotate
    if(_hasSpaceToBe(tempSigil)) {
        _currSigil = tempSigil;
    }
};

While I learnt a lot from this exercise, like the proper way to build a game-loop, handle multiple scenes and build a Finite State Machine, my initial main aim of building a Tetris clone was to improve my understanding of various design patterns, decoupling and abstraction in Javascript. I built the game in a highly decoupled way, where every 'module' or piece of the game only knows about each other and a 'game core'. Here's where the Observer and Interface pattern come in handy. The modules never talk with each other, so if any one of them break, the rest stay intact, making it easy to debug and also to extend the functionality of the game. I won't go into those details in this article, but you can get the sourecode on Github.
To all junior developers serious about improving their code skills in any Object Oriented Language, I highly recommend

• watching Nicholas Zakas's presentation, Scalable JavaScript Application Architecture,
• reading Addy Osmani's book, Learning JavaScript Design Patterns
• as well as Bob Nystrom's book, Game Programming Patterns.

All of them are available online for free and have immense amounts of information about building large scale applications and games. These articles made a big impact on my skills as a junior developer and I'm greatly thankful to them for it.

Alright, time to PLAY THE GAME. Enjoy!

This is my third blog that I've tried to maintain. Or is it the fourth? Somehow, they never seem to last.

Oh well, maybe this time...