Animation Demo Series 3

Download the demo game here. To play the demo, you will need a Glulx interpreter, such as Gargoyle, Windows Git, or Zoom (see links at right). Users of the Spatterlight interpreter are advised to upgrade to Gargoyle.

For Scourge of the Vampyr, the third installment of the Glimmr Canvas Animation demo series, I’ve finally prepared an example where the connection to familiar IF game mechanics is clear. Unlike Demo 1 (a UI mockup), or Demo 2 (a visualizer for eased movement), Demo 3 shows us a graphical map of a familiar adventure terrain–the crypt of a vampire, to be precise–using animation to provide movement and effects.

The player's avatar, headed east toward adventure (click for full screenshot)

This demo introduces a few more of the animation presets that are built into Glimmr Canvas Animation (more on GCA). First is the reel animation, which is the familiar flipbook-style swapping out of images to suggest change or movement. The Scourge of the Vampyr demo uses a simple four-image walk cycle to depict the player’s avatar moving from room to room.

Of course, there’s also the familiar motion preset, showcased in both Demos 1 & 2, which actually moves the sprite that represents the PC over the map. However, it’s deployed with a twist here: most of the time, the window framing is centered on the avatar, so the map appears to move while the character walks in place (ah, relativity!)

The demo also employs some other effects. If you look very closely as the character enters the crypt via the stairs, you will notice that the sprite increases in scale as it nears the bottom of the stairs, from 75% to 100% over 4 animation frames. The staircase is only a single 16 x 16 pixel tile, so the effect is subtle–look carefully!

Much less subtly, there’s are some fairly old school lighting effects when you light your lamp in the darkened room on the far right side of the map. This combines two other presets not seen in previous demos, the flicker preset and the fade preset. Basically, we “stack” these two animations together to create a single effect: we fade the room in, while randomly flickering the room out of sight entirely. (The fade effect, with a bit of easing, can be seen by itself by turning off the lamp again in the same room.)

A quick note on the images, all of which are CC-licensed: The sprite animations for the avatar, as well as most of the tiles used to construct the map, come from Sean Howard’s Free Pixel Project. The sarcophagus tile comes from David Gervais.

The Inform 7 source code for the demo can be found in the documentation section (still a stub) of the Glimmr Canvas Animation extension, available here for the time being.

Download Demo 3: The Scourge of the Vampyr. Comments welcome.