SpongeBobSquarePants

An unofficial, playable Three.js fan project: explore a small Bikini Bottom neighborhood and walk through five furnished rooms inside SpongeBob’s pineapple. Includes a procedural character, walking animation, synthesized audio, and a character studio with a downloadable animated GLB.

Run locally

Use Node.js 22.13 or newer and npm.

npm ci
npm run dev

Open the local URL printed by Vite. No API keys, account, database, or external model downloads are required. The character gallery uses Google Fonts; the game geometry and audio are generated locally.

npm run build
npm start

The build produces static files in dist/ using Vite and React. npm start previews those files locally. Deploy the contents of dist/ to a static web host at the site root; the character viewer is available at /character/. No backend or hosting-provider SDK is required.

Character studio

Open /character for the interactive viewer or /spongebob/index.html for model captures, the animated GLB, and synthesized footstep WAVs. /?play=spongebob starts gameplay directly. The viewer supports camera presets, pace, pause, and audio.

Rebuild the exports with:

npx tsx scripts/export-character.ts

The export script reimports and samples the GLB to validate it. The exported model uses unlit colors; the live viewer adds toon lighting, outlines, and synchronized sound. No Blender installation is needed.

Scope and source

The neighborhood includes the pineapple, neighboring houses, paths, road, and vegetation. The pineapple has a living room, kitchen, bedroom, bathroom, and library connected by two staircases. Neighboring houses are exterior scenery. This is a small fan reconstruction, not a completed open-world game or an exact production-art replica. There are no quests or wider town to explore.

• app/: game interface and character viewer pages.
• game/: procedural geometry, materials, navigation, collision, cameras, animation, and synthesized audio.
• components/ui/: slider and popover used by the settings interface.
• scripts/: character export and validation.
• tests/: navigation, geometry, character, camera, vegetation, and audio checks.
• public/spongebob/: gallery, model captures, and generated exports.

Validation

npm run check
npm run lint
npm run build
npm audit

check runs TypeScript and the Node test suite. Tests cover room traversal, stairs, collisions, entrance clearance, finite geometry, animation seams, camera obstructions, vegetation, and audio settings. They do not establish visual fidelity or replace browser playtesting. GitHub Actions runs check, lint, build, and audit.

License and attribution

Original source code and documentation are MIT licensed; see LICENSE. SpongeBob SquarePants and associated characters and settings belong to their respective rights holders. This project is unofficial and is not endorsed by them. The code license grants no rights to underlying third-party IP depicted by models or screenshots. See THIRD_PARTY_NOTICES.md.

Reference stills are excluded from the repository and public gallery. Reference sources include SpongePedia and United SpongeBob’s house tour.