Skip to content

Latest commit

ย 

History

5 Commits

Folders and files

NameName
Last commit message
Last commit date
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

๐Ÿถ Obi's Farm Adventure โ€” 3D

A charming 3D farm game where you catch Obi the dachshund before he catches the chickens!

Built with Three.js โ€” pure procedural 3D geometry, no external assets needed. Runs in any modern browser, desktop or mobile. Designed for ages 5+.


๐ŸŽฎ How to Play

Objective Detail
๐Ÿ† Win Tag Obi 3 times to catch him
๐Ÿ’€ Lose Don't let Obi catch 3 chickens
๐Ÿฆจ Evening hazard The skunk comes out at dusk โ€” get too close and you'll be sprayed!
โญ Score Points for surviving, tagging Obi, and keeping chickens safe

Controls

Platform Move Sprint Tag Obi
๐Ÿ–ฅ๏ธ Desktop WASD / Arrow Keys Shift Space (when near Obi)
๐Ÿ“ฑ Mobile Joystick (bottom-left) ๐Ÿ’จ button (bottom-right) Tap near Obi

๐ŸŒพ The Farm

A fully procedural 3D farm built entirely from Three.js primitives โ€” no image textures, no model files.

Environment

Feature Description
๐Ÿž๏ธ Terrain Vertex-colored grass field (120ร—120) with 4 blended green shades for natural variation
๐ŸŒธ Meadow Lighter green patch to the east with 80 wildflowers in 5 colors (yellow, pink, purple, white, orange)
๐Ÿ Maple trees Red-orange autumn maples lining both sides of the dirt road โ€” canopies sway in the wind
๐Ÿ›ค๏ธ Dirt road Runs along the north edge with a connecting path to the coop
๐Ÿ” Chicken coop Wood walls, sloped double roof, nesting boxes, ramp, weather vane โ€” detailed multi-part build
๐Ÿซ Blackberry rows 3 trellis rows with posts, wire, bush clusters, and ripe purple berries โ€” bushes sway in wind
๐ŸŒป Sunflowers 8 sunflowers near the coop with stems, petals, and centers
๐ŸŽƒ Pumpkins 5 pumpkins near the blackberry rows
๐ŸŒพ Hay bales 5 cylindrical bales as obstacles you can't walk through
๐Ÿชจ Rocks 6 scattered dodecahedron rocks
๐Ÿšง Wooden fence Post-and-rail fence enclosing the entire property
โ˜๏ธ Clouds 6 drifting cloud clusters made of overlapping spheres
๐Ÿ›๏ธ Farm entrance arch Wooden arch with "Obi's Farm" sign, vine decorations, positioned over the path from the road

Atmosphere

Feature Description
๐ŸŒ… Gradient sky dome Large inverted sphere with vertex-color gradient: deep blue at top โ†’ warm white at horizon (not a flat blue background)
๐ŸŒซ๏ธ Gradient-matched fog Fog color matches the sky horizon so distant objects fade naturally
๐Ÿ’ก Three-point cinematic lighting Warm key light (sun), cool fill light (sky bounce), warm rim light (backlight) โ€” Pixar-style lighting
โœจ Pollen motes 60 golden particles drifting through the air at 1-5 height, gently pulsing โ€” daytime ambience
๐ŸŒฌ๏ธ Wind sway All tree canopies and blackberry bushes sway with unique phase offsets โ€” the world feels alive
๐Ÿ Blob shadows Flat dark circles under every character โ€” always grounded, even when shadow maps blur at distance
โœ๏ธ Black outlines Comic-book edge outlines on all characters โ€” universal kid-language for "this is a character"

๐Ÿพ Characters

Obi the Dachshund ๐Ÿถ

  • Long brown body, floppy ears, red collar โ€” bigger for visibility
  • Floating red exclamation marker bobs above his head, visible from far away
  • AI state machine: wander โ†’ chase (nearest chicken) โ†’ flee (from player) โ†’ tagged (stunned)
  • Legs animate, tail wags, ears flap when running
  • Gets stunned for 4 seconds when tagged (tail still wags!)
  • Red ring on mini-map when chasing, yellow when fleeing, green check when tagged

The Chickens (6) ๐Ÿ”

Name Color Behavior
Henrietta White Wander โ†’ flee when Obi approaches
Buttercup Golden Wing flap animation when scared
Daisy Brown Bobbing walk with leg animation
Penny Cream Comb, beak, and tail feathers
Goldie Dark brown Random wander directions
Pecky Light buff Speed varies per individual
  • โค๏ธ Heart particles float above safe chickens (occasional + on tag)
  • ๐Ÿ˜ข Sad face icons appear above caught chickens
  • Caught chickens sit low with head down

The Skunk ๐Ÿฆจ

  • Black body with white stripe and bushy tail
  • Appears at evening from a random edge of the farm
  • Green stink cloud follows it โ€” gets bigger and denser when ready to spray
  • Raises tail straight up before spraying (warning!)
  • 3-second stun + score penalty if sprayed
  • 8-second cooldown between sprays
  • Wanders peacefully when player is far away

The Player ๐Ÿง’

  • Farm kid with straw hat, red shirt, blue overalls, brown boots
  • Third-person camera that smoothly follows with orbit-style positioning
  • Camera auto-rotates toward Obi when he's chasing and far away
  • Walking and running animations with arm/leg swing
  • Sprint dust trail particles when running
  • Yellow ring appears when close enough to tag Obi

โœจ Visual Effects

Effect When What It Looks Like
๐Ÿชถ Feather trail Obi chases a chicken White feather planes float up and spin near the scared chicken
โค๏ธ Heart particles Tag Obi or randomly for safe chickens Red hearts float up from chickens and fade
๐Ÿ˜ข Sad face icons Chicken caught Yellow sad-face billboards float above caught chickens, always face camera
๐Ÿ’จ Dust trail Player sprints Brown dust puffs behind the player
๐Ÿ’š Stink cloud Skunk is active Green particles around skunk, intensify before spraying
๐ŸŽ‰ Confetti burst Win! 80 multicolored confetti pieces explode from player position
๐ŸŒŸ Fireflies Evening 40 glowing yellow dots blink and drift through the dark farm
โœจ Pollen motes Daytime 60 golden particles drift in the air, fade out at evening

๐Ÿ”Š Sound Effects

All sounds are procedurally generated with Web Audio oscillators โ€” no audio files needed.

Sound When What
๐Ÿ• Bark Obi chases a chicken Sawtooth wave bark every 2-4 seconds
๐Ÿ” Cluck Chickens are scared 3-note square wave cluck
๐Ÿ˜„ Giggle Tag Obi Rising sine wave giggle (4 notes)
๐Ÿฆจ๐Ÿ’จ Spray Skunk sprays player Filtered noise burst (pssst!)
๐ŸŽต Win fanfare Victory C-E-G-C triangle wave ascending
๐Ÿ˜ข Sad Chicken caught or lose Descending sine wave
๐ŸŒ… Evening tone Evening begins Soft descending sunset tone

๐Ÿ—บ๏ธ Mini-Map

A 2D radar canvas in the bottom-right corner showing:

Icon Entity
๐Ÿ”ต Blue triangle Player
๐ŸŸค Brown dot Obi (with state ring: red=chase, yellow=flee, green=tagged)
๐ŸŸก Yellow dot Safe chicken
๐ŸŸ  Orange dot Scared chicken
๐Ÿ”ด Red dot Caught chicken
โฌ› Black dot + white stripe Skunk (when active)
๐ŸŸซ Brown square Chicken coop

๐ŸŒ… Day/Evening Cycle

Phase Game Time What Happens
โ˜€๏ธ Morning 0โ€“20s Bright sky, pollen motes drifting, Obi chases chickens
๐ŸŒค๏ธ Afternoon 20โ€“45s Same gameplay, sun moves across sky
๐ŸŒ… Evening 45s+ Sky turns orange-purple, fireflies appear, pollen fades, animated "๐Ÿฆจ Skunk Alert!" banner slides in, skunk enters from random edge

๐ŸŽ‰ Victory Dance

When you win (tag Obi 3 times), the game doesn't just show a screen โ€” it celebrates:

  1. ๐ŸŽต Win fanfare plays (C-E-G-C)
  2. ๐ŸŽ‰ 80 confetti particles burst from the player position
  3. ๐Ÿ” All safe chickens hop up and down
  4. ๐Ÿถ Obi rolls over (spinning animation)
  5. โค๏ธ Heart particles float from chickens
  6. ๐Ÿ† Win screen appears after 2.5 seconds with score, chickens saved, and time

๐Ÿ› ๏ธ Tech Stack

Component Technology
3D engine Three.js r169
Build tool Vite 5
Language JavaScript (ES modules)
Audio Web Audio API (procedural oscillators)
Particles Three.js primitives (no external particle system)
Assets Zero external assets โ€” everything is code-generated geometry
Bundle size ~548 KB (140 KB gzipped)

๐Ÿ“ฆ Build & Run

npm install
npm run dev      # dev server at localhost:5173
npm run build    # production build to dist/
npm run preview  # preview production build

๐Ÿ“ Project Structure

obi-farm-3d/
โ”œโ”€โ”€ src/
โ”‚   โ”œโ”€โ”€ main.js       # Game loop, states, HUD, day/evening cycle, all integrations
โ”‚   โ”œโ”€โ”€ World.js      # Farm environment (terrain, trees, coop, fence, arch, decor)
โ”‚   โ”œโ”€โ”€ Player.js     # Farm kid character + third-person camera + controls
โ”‚   โ”œโ”€โ”€ Obi.js        # Dachshund AI (wander/chase/flee/tagged) + exclamation marker
โ”‚   โ”œโ”€โ”€ Chicken.js    # 6 chickens with wandering/fleeing behavior + names
โ”‚   โ”œโ”€โ”€ Skunk.js      # Skunk with evening appearance + spray mechanic
โ”‚   โ”œโ”€โ”€ Sound.js      # Procedural Web Audio sound effects (7 sounds)
โ”‚   โ”œโ”€โ”€ Effects.js    # 7 particle systems (feathers, hearts, sad faces, stink, dust, confetti, fireflies)
โ”‚   โ”œโ”€โ”€ MiniMap.js    # 2D radar canvas with entity tracking
โ”‚   โ””โ”€โ”€ Visual.js     # Visual polish: toon gradient, sky dome, blob shadows, outlines, pollen, wind
โ”œโ”€โ”€ index.html        # Game UI, HUD, touch controls, overlays
โ”œโ”€โ”€ package.json
โ””โ”€โ”€ vite.config.js

๐ŸŽฏ Game Design Notes

  • Target audience: Ages 5+ โ€” simple controls, bright colors, friendly characters
  • Session length: ~2 minutes per round (20s morning + 25s afternoon + evening)
  • Win condition: Tag Obi 3 times
  • Lose condition: Obi catches 3 chickens
  • Skunk adds evening tension โ€” player must balance chasing Obi with avoiding the skunk
  • No violence, no scary content โ€” Obi gets stunned, chickens sit down sadly, skunk sprays with comedic effect
  • Mobile-first touch controls โ€” joystick, sprint button, tap-to-tag
  • Everything is procedural โ€” no downloads, no asset loading, instant play

๐Ÿ“ธ Screenshots

Screenshots are in the screenshots/ directory, captured via Playwright headless Chromium with SwiftShader WebGL2.


Built 2026-06-19 โ€” A 3D farm adventure for young players. v1.0.0: Core game ยท v2.0.0: 10 GUI improvements ยท v3.0.0: 10 visual polish upgrades

About

3D farm game where you catch Obi the dachshund before he catches the chickens. Three.js, pure procedural geometry, ages 5+.

Topics

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages