Trailer for the Roguelike Celebration 2018

The Roguelike Celebration is happening again this year, October 6 and 7. I will be flying to SanFran to assist and also give a talk about the History of Roguelikes.

Had an idea running on my head for a while to make a “trailer” for the event (no one asked me for it). At first, I thought of creating a playable classic roguelike using my JSRL roguelike template. I actually did create the foundations for it (as in walk in a predefined map), but it lacked the cinematic potential for a short trailer. In any case, I integrated the “torch” effect from the unicodetiles.js example into JSRL, which may be useful. You can check out the integration here.

Screen Shot 2018-08-10 at 7.30.17 AM

Then I had another idea and I just couldn’t be at peace until I implemented it. I think it occurred to me a day while driving and listening to the Mega Man III OST. I thought I had found the perfect tune for it. So, even in a busy week with lots of work, I just had to do it.

The trailer features the awesome speakers’ lineup in a “robot-masters” NES Megaman stage selected style.

I implemented it using JavaScript and Phaser, you can check the source code here and the demo running live here

Of course, there’s little structure to the project since it was meant to be a quick job (and is also pretty simple). Most of the relevant logic can be found in a single Object, the Game state. I set up a stage with a black background and the gray strip, as well a Sprite object for the character and 4 text fields. I used a Megaman 10 font (I had found another one for Megaman 2 but for some reason, it could not be loaded as a web font), I performed a simple centering function based on each line’s character count to keep the characters as sprites in the grid (thus getting a bit close to being a NES “background sprite”?).

There was also a simple “particle” animation in the background, instead of stars they were small @ signs because, you know, roguelike. I used the same color palette used on the Roguelike Celebration logo for them.

Of course, the most fun part was doing the pixel art for the speakers. I used a bunch of Mega Man 2 robot masters as a base and then I proceeded on tweaking them for each speaker. The ones I know in person where easier, for the others I had to do a bit of stalki Internet research, I hope I managed to capture their likeness.

Finally, I reused the “Retro TV with scanlines” from Cat Cafe.

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s