Web System
BOP
A 3D character landing page: a glossy head that follows the cursor, drags with inertia and turns as you scroll, plus a seven-face character index.
Verified rebuild score
Claude Code 100 · Framer 99
Access
Pro
Included
Live demo · Agent prompt for Claude Code and Codex (Vite + TypeScript, model-viewer) · Framer Agent prompt with three code components · Visual kit: the 3D head and 14 portraits from the Toy Faces collection
About
What you are rebuilding
A quiet, premium character study for a fictional studio mascot. A glossy 3D head floats over a giant PRESENCE wordmark and pays attention to the visitor: it follows the pointer within a restrained range, can be grabbed and spun with a short glide, turns as you scroll and settles back to rest when you stop. Below, a behavior table, a system spec grid and a bento index of seven characters that switch from mood A to mood B on hover. Warm neutrals, black type, fine rules and one signal-orange accent.
Prompts
Get the prompt for your tool
Claude Code · Codex
Agent prompt
Rebuilds the site in code with the same sections, motion and media. Open an empty folder, start Claude Code or Codex and paste the prompt.
Framer Agent
Framer prompt
Builds the page with native Framer layers, text styles and breakpoints, plus small code components only where Framer has no native option. Open a new Framer project, start Framer Agent and paste the prompt.