Screenshot of Tiger Territory game. A tiger hunting boar, tapir and deer in a forest and learning about itself

Tiger Territory the game

Tiger Territory is a top-down, two-mode (adventure/arcade) game I made for the Zoological Society of London using JavaScript, HTML and CSS.

Play at www.zsl.org/tigergame

Tiger Territory is a two-mode top-down adventure/arcade game focused on the life of a Sumatran tiger in Indonesia. I made it using ImpactJS (with artwork and animation by my colleague Alasdair Davies). I made a bit of music for it as well.

The game is full screen, hopefully works on most desktop and tablet browsers and can be controlled with keys, mouse and touch. I’m still working on a properly small-screen mobile friendly version as it doesn’t scale down that far yet very well.

As with most such things I would have probably done a lot of things differently if starting today (it’s been a giant learning experience) but the game has quite a few fun features.

Features

Mouse, keyboard or touch joystick controlled tiger (I made my own simple touch joystick using Microsoft’s new pointer events standard and hand.js as a filler for nonsupporting browsers)

Tiger movements include running (with energy bar), walking, prowling, swimming, sleeping and sniffing

Tiger can hide from prey under trees (almost invisible to prey when prowling)

Prey is tapir, deer and boar and each have their own little AI personality traits including sight range/angle, hearing range and speed.

The world also includes snares which can catch tigers, camera traps which take photos of them and electric fences which hurt.

Adventure mode contains 12 achievements the player has to unlock.

Spoiler: On adventure mode you can find another tiger that follows you around.

Arcade mode is a race against time to get as many points as possible. Mostly through 14 bonus/combo types. There’s a MongoDB powered scoreboard for this too.

There are two maps, one ridiculously huge one for desktop and one smaller one for tablets.

Every game activity is logged using Google Analytics events so we can track exactly what’s working and what isn’t and hopefully do some live visualisations eventually.

Colours?!

Random colour palette via the Colourlovers API. This one's called Go Ahead!! and is by Halifax

Hard to read? Refresh for another or turn on and default to black and white mode.

Black and white setting is stored in a black and white cookie.

Close this box.