Interactive Wildlife
A British wildlife site where the animals follow your pointer: 93 animals drawn in code across twelve habitats, with facts, real photos, a quiz and a spotter's list.
About the project
Interactive Wildlife is my own project, published under my Follow Me Creations name. It began as a single ladybird that followed your pointer down a page, and grew into a full learning site about British wildlife for curious people of all ages: garden bugs and birds, pond, river and seashore life, woodland, meadow, moorland, farmland and town.
What the site needed to do
Most wildlife pages are a photo and a block of text. I wanted one you play with first and read second, so the facts arrive while you are already interested. It also had to stay quick on a phone, be easy to find your way around with nearly a hundred animals in it, and work as a plain, readable page for anyone who prefers no movement.
What I built
- 93 animals drawn in code rather than loaded as pictures, each with its own way of moving: walking, hopping, swimming, hovering or soaring after your pointer or finger
- Twelve habitat pages plus a magnifying-glass page for creatures too small to see, each with fact cards, a who's who and a month-by-month chart of when to look
- A page for every animal, with real photographs (credited to their photographers), where and when to find it, and how to help it
- A live weather strip: the real weather in Macclesfield changes the page and how the animals behave
- A spotter's list to tick off what you have seen for real, with badges for every habitat, kept privately on your own device
- A quiz that asks you to name an animal from its shadow, with a new set of questions every time
- An A to Z of every animal, a menu that stays put as you scroll, and its own preview image for every one of its 111 pages
- No database and nothing to log in to, so there is very little to go wrong and pages load fast
How it works
Because the animals are drawn by the page itself, the whole cast weighs less than a single large photograph. That is why a page with a deer, an eagle and an adder on it still opens quickly on a phone.
Every page works without the animation too. If your device is set to reduce motion, the animals sit still and everything else reads as normal.
The same approach suits any business with something to explain: a product, a place, a process. Give people something to play with and they stay, and they remember it.
Other recent sites
Need something similar?
Tell me about your business — I'll suggest the simplest thing that does the job.