Droplet

droplet-large-case
Client
Platform
Genre,
Released8th August 2012

Code by Richard Davey

Graphics and Music by Ilija Melentijević

PLAY
Trouble playing this game?

About

Droplets is a simple little game based on the range of vinyl toys created by Jam Factory. Just get the 5 droplets home, collect as many hearts as you can on the way, and avoid contact with pretty much everything else! The mobile version differs from the Flash one in that you slide left/right and have a lot of bounce – if you aren’t too careful you can end up ricocheting around the place like a pinball. Get home to the factory at the end to complete the level.

Simple, but still quite fun :) And I’m very happy with the way it resizes intelligently on most devices. I’ve tested it on a variety of phones and tablets, from an iPhone 3 up to a Nexus 7, and it ran ok on most of them. Some (like the Samsung Galaxy S3) don’t cope with the canvas scaling too well and thus the frame rate suffers, but on the whole it’s about all that the ImpactJS engine can handle.

Point your mobile browser at http://gametest.mobi/droplets/ to play.

HTML5 Flash Remake

At the time the original Flash game was made I had the pleasure of working with the extremely talented designer Gavin Strange. He releases his personal work under the label Jam Factory. You can often find him giving presentations in Apple stores, interviews with design mags or creating new vinyl toys. And the vinyl toys are the reason this game even exists.

A few years ago he created a range of vinyl toys called Droplets. Produced by Crazy Label they were quite a success, and people seemed to love their cheeky innocent playfulness. A few months back he started work designing Series 2 – and today (6th of February 2010) is the official launch date, accompanied by a big party at a store here in Bristol, UK.

As part of the launch he sent out loads of “plain” Droplets to artist friends. The idea being they customised them and sent them back, for display in the gallery at the launch party. Gav asked everyone in the our department at work to do their own “custom” too.

Not being very good at real-world “creative” things I opted to do what I do best – make a game. It could serve two purposes: To be a fun little entry in the Droplet family tree. And to serve as a wider promotional tool for the Droplets themselves. So I enlisted the help of my pixel partner in crime iLKke, and this is what we created …

Development Trivia

The game was built using Flixel. Flixel is an AS3 game framework created by Adam Atomic. It has a lot of “retro” functions built in, such as volume control, a single event loop system and tile mapping. It’s bitmap to the core, and it fitted what Ilija and I wanted to achieve with the game.

Like all frameworks it’s designed to be extended as you need. And boy, did I need to do that a lot! Once I had grasped the overall structure I set about rewriting a few of the internal methods, and expanding upon others. In the past Flixel had always struck me as being a framework that grew from a game, rather than the opposite. I.e. there are various bits of somewhat clunky legacy code in there, that worked well for their original intended situation, but fell over when pushed outside the comfort zone.

We had a very short deadline to get the game finished in (approx. 2 weeks of evenings only) so we made sure to pick a simple theme / concept, and it just grew from there. We always knew we had to have 5 levels (one per Droplet in the new series). But we also knew we didn’t have time for each to be graphically distinct, so Ilija created a set of tiles that would stretch across 5 levels without them all getting too “samey”.

The first level eases the player in. The second ramps it up a notch, and it doesn’t let-up from there. The final level is quite evil if I say so myself.

We created the level layouts using Mappy split across 2 layers. Using a custom export one layer became the “foreground”, and the other the background. Key tiles were detected in the level data and converted to collision sprites, some of which then animated (the birds fly for example).

Basically we kept adding and tweaking the game as time allowed. Lots of late nights were involved :)

Party Time

The Droplet 2 launch party was a complete success. Loads of people flocked to see it, and while they were in the store or gallery they could see a video up on the screens. The video was a slide show of concept work, photos and lots of footage of the game :) It was really nice seeing people react to it so positively. It was also released to Twitter and on the Droplet Facebook page, and the response was pretty favourable to say the least.

I think we captured the essence of the Droplets as playful characters, and gave them a nice little world in which to explore. I do think that they also probably have quite a devious streak to them, so who knows.. maybe they will return?

How to play our HTML5 games

While all of our games work in both mobile and desktop browsers a lot of the sites they are embedded in are mobile only.

To get around this either make sure you play our game using a mobile web browser or install a User Agent spoofing extension. We recommend the User-Agent Switcher for Chrome.

If you run into problems playing one of our games please contact us, we'll be only too happy to help.


Make yourself heard