Panzer Dragoon 1k

gamedev js1k javascript canvas

This article introduces my journey into the JS1K world and a few tricks I've used for my entry "Panzer Dragoon 1k" (source).

Welcome to the world of hacks, tricks and getting-things-done-at-any-price. You will turn the worst JavaScript practices and ugliest JavaScript facts to your advantage. Welcome to the world where coding the bad way is satisfying!

Panzer Dragoon 1k

Panzer Dragoon Original Game

Promisify your games

gamedev promise Q ludumdare

One month ago was the LudumDare #28 gamejam theming "You Only Get One".

I submitted a mini-game which ranked 105th out of 2064 entries and also 26th in the "theme" category.

This is of-course a web game implemented in JavaScript and using HTML and CSS.

But actually, my main goal was not really making a game done but more about technically making a state-of-the-art Promise-based game.

I think Promises contains very interesting advantages in a game development design: Resource loading managment, game scenes chaining, animations... are some use-cases.

Functional Rendering

functional rendering GLSL

I've done a talk at Gamelier last Monday about how to think the rendering in a more functional way.


Most of today 2D graphics libraries restrict us to a set of primitive procedures (drawRect, drawCircle, drawImage,...) but when it comes to bring more interesting features you tends to be stuck with it. Let's see how we can just do things with a function of (Vec2 => Color).

This is the way (WebGL) GLSL has already took and the presentation examples will be built on it. Let's see what are the multiple benefits of taking that paradigm of rendering.


Open the slides

Checkout more presentations at Gamelier.org

Making a rhythm game with bleeding-edge web

js13k GLSL audio gamedev

While continuing to experiment with Web Audio API and GLSL, I've made a game called Timelapse for js13kgames (an HTML5 game competition where entries must be less than 13 kb zipped).

This article is a postmortem overview of my game development which will try to explain what was my game mecanism ideas and show you some interesting parts with screenshots, audios and source code snippets.

The Game

Open the game on js13kgames / github.

The game intends to work on Desktop and Mobile. However, Chrome is recommended (Firefox Aurora also supports it but audio is a bit wrong, but Mozilla devs should improve this soon). Today, it works on Android Chrome Beta on a Nexus 4, unfortunately with some clicks in the audio (Web Audio API is bleeding-edge).

Beez, WebRTC + Audio API

WebRTC audio hackday

Here is Beez, a web real-time audio experiment using smartphones as synthesizer effect controllers.

This is our second Web Audio API experiment made in one Hackday at Zenexity (now Zengularity).

This time, we were much more focused on having the best latency performance: we used the bleeding-edge WebRTC technology, which allows you to link clients in Peer-to-Peer instead of a classical Client-Server architecture.

Live demo of the Hackday application

Bonus for the one who recognizes the melody :-)

Frequency Modulation (FM) with Web Audio API

fm audio

The main principle of Frequency Modulation (FM) is to pipe an Oscillator (the Modulator) into the frequency of another Oscillator (the Carrier).

This article will explain to you how FM Synthesis works with interactive demos. In the meantime, all demos are implemented with the brand new Web Audio API, so feel free to hack the code for your own purpose.

This article will also introduce some Audio concepts like LFO, Envelope and Finetuning.

I've recently implemented a very first FM in ZOUND live - a HTML5 collaborative audio tracker, giving much more powerful Synthesizers (see in the following video).

(here is the implementation of that FM)

ZOUND live v1 in development

MIDI audio zound

Here is a preview video of the Work In Progress development of ZOUND live, the collaborative modular audio tracker built with bleeding edge web technologies: Web Audio API, Web MIDI API, WebSocket & Playframework.

N.B. In the video, I've used the nanoKONTROL2 for changing some properties in real time and using the MIDI API.

If you are interested by the project, fork it on Github.

More to come, stay tuned!