- Procedural canvas art: 15 species × 4 poses, 15 buildings, modular terrain, UI icons - Habitat enclosure detection, biome suitability, staff/guest AI pathfinding - Economy: tickets, shops, wages, star rating, research tiers, 15 missions - Day/night cycle, particles, WebAudio soundtrack & synth SFX - Mouse + touch controls, responsive UI, localStorage autosave - Verified: 31/31 logic tests (test/smoke.js) · 12/12 render audits (test/qa.html)
2.5 KiB
2.5 KiB
Wildlife Kingdom — Art Direction
The in-code "master graphic prompt": every sprite follows these rules.
Perspective & Camera
- Top-down / slightly isometric, 2:1 diamond grid (64×32 px tiles), camera reading as a ~45° look-down — the classic premium zoo-builder view.
- Painter's-algorithm depth (
x+y), consistent across terrain, fences, objects, buildings, animals and visitors.
Shape Language
- Everything is built from rounded blobs and soft prisms. No straight harsh edges.
- Animals: chunky bodies ≈ 2× tall as legs, oversized heads, big glossy eyes with a single white shine pixel, rosy blush, tiny smiles.
- Buildings: extruded iso boxes with three-tone wall shading (top +8%, left 0%, right −10%) and one playful roof feature each (swirl cone, wave dome, mesh aviary, boulder roof, scalloped awning, flag archway).
Color Palette (natural zoo)
| Role | Hex |
|---|---|
| Fresh greens | #7cc653 · #63b34c · #4d9a37 |
| Warm yellows | #ffd23c · #ffc93c · #f0c05c |
| Sky blues | #69c3ef · #6ec6ea · #3796cf |
| Earth browns | #a9743f · #c99b62 · #8a5a34 |
| Soft oranges | #ff9d47 · #e8823c |
| UI cream | #fdf6e7 · #f6ead1, ink #43362a |
Accents (red #e85d5d, pink #ff8aa8) used sparingly for signs, awnings, hearts.
Lighting Rules
- One sun, upper-left: highlights top-left of every blob, shade lower-right.
- Contact shadows: soft translucent ellipses under every entity; buildings cast a footprint shadow.
- Day/night: sky gradient lerps
#7ec8f5→#2c3e66; night adds indigo tint + warm radial lamp glows.
Animation Feel
- Idle = slow breathing bob + tail/ear sway; walk = sinusoidal leg swing with body bounce; eat = head dip + chew cycle; happy = hop squash-stretch + sparkle/hearts.
- Visitors waddle (leg phase + lane offsets); kids at 0.68 scale; balloons drift on their own sine.
- Water breathes via moving highlight arcs; swimmers clip at the waterline with ripple rings.
Sprite Hygiene
- Transparent backgrounds, clean readable silhouettes at 40 px (icons) to full size.
- Consistent scale ratios between species (elephant 1.22 × zebra 0.95 × penguin 0.68).
- No text, logos or watermark noise inside world sprites.
UI Identity
- Cream paper panels, 18–20 px radii, 2 px warm borders, soft drop shadows.
- Pill HUD stats with hand-drawn icons (coin paw-print, flask, star…).
- Chunky rounded buttons that depress on click; orange = selection, green = money, red = danger/demolish. Typography: Baloo 2 (rounded, friendly).