Wildlife Kingdom — original browser zoo-management sim
- 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)
This commit is contained in:
@@ -0,0 +1,54 @@
|
||||
# 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).
|
||||
Reference in New Issue
Block a user