NEON — The Next Interface

Technology should feel alive.

An experimental AI-device launch told as one continuous camera move. A single scene director runs ahead of every other frame callback, eases a story clock from 0 to 7 across seven chapters and 21 screen-heights of scroll, and sets the camera position, orbit and field of view from it — so the device, the particles and the type all answer to one number instead of a stack of unrelated triggers. The device is procedural, with no models and no textures: a glowing core, three counter-rotating rings of instanced beads, and five modules — Core, Memory, Vision, Voice, Motion — that fly apart into an exploded engineering view with live technical labels. It dissolves into a 16,000-particle neural structure that follows the cursor, flies the camera through floating shader-lit panels, bursts into a full-spectrum colour chapter, and reassembles for the final shot. Bloom, ACES tone mapping and chromatic aberration that grows with scroll velocity; phones drop to 5,000 particles and a lighter effects chain. Sound is wired as named story events and never autoplays.

How to run this

Works the same on Windows, macOS and Linux. No prior setup beyond Node.js, and nothing to configure — the pack runs as-is.

Built with: Vite 8
Requires: Node.js 20 or newer
Opens at: http://localhost:5190

✦ Or let an AI agent set it up for you

Already using Claude Code, Antigravity, Cursor or Windsurf? Unzip the pack, open the folder as a project, and just ask:

Install the dependencies and run this project, then give me the URL

It reads the README included in the pack, runs the right commands for this project, and sorts out anything that trips along the way. You still need Node.js installed (step 1 below) — everything after that it can handle.

Or run it yourself

1
Install Node.js, if you don't have it
Download the LTS build from nodejs.org and run the installer — on Windows and Mac it handles everything. Mac users with Homebrew can run brew install node instead.
To check it worked, run node --version. It should print a number like v22.11.0.
2
Unzip the pack, then open a terminal inside the folder
Windows: open the unzipped folder in File Explorer, click the address bar, type powershell and press Enter.
Mac: press Cmd+Space, type terminal, press Enter. Then type cd (with a trailing space) and drag the unzipped folder onto the terminal window — it fills in the path for you. Press Enter.
3
Install the dependencies
Run npm install
One-time, and takes roughly 30–60 seconds. It creates a node_modules folder — that's expected, and it's why the zip doesn't ship one.
4
Start it
Run npm run dev
Then open http://localhost:5190 in your browser. Leave the terminal open while you use it — closing it stops the site. Press Ctrl+C in the terminal to stop.
5
Optional — build for production
When you're ready to deploy, npm run build produces the optimised output. The pack deploys to Vercel, Netlify or any Node host with no changes.

+ If something goes wrong

“npm is not recognised” / “command not found: npm”: Node.js isn’t installed, or the terminal was open before you installed it. Close the terminal, open a new one, and try again.
“Port 5190 is already in use”: Something else is running there — often a previous copy of this site. Close the other terminal, or stop it with Ctrl+C.
The page loads but images or video are missing: Make sure you ran the command from inside the unzipped NEON — The Next Interface folder itself, not the folder containing it.
npm install shows warnings: Warnings (as opposed to errors) are normal and safe to ignore. Only a message starting with ERR! needs attention.

Still stuck? Email us and we'll get it running with you.

Prompt $5.99 · Source $15.99 · or All-Access

What's included

✦The complete build brief, verbatim — seven chapters, six wow moments, and the motion, performance and responsive rules, written so a coding agent can take it end to end
✦The scene director: one story clock, eased once per frame ahead of every other callback, driving the camera, orbit, FOV and every chapter — and why that beats stacking dozens of ScrollTriggers
✦A procedural device with no models or textures: instanced bead rings, five modules with assembled and exploded positions, and technical labels projected from 3D into the page
✦A 16,000-particle neural structure (5,000 on phones) and a velocity-reactive effects chain — bloom, ACES tone mapping, and chromatic aberration that grows the faster you scroll
✦Sound wired as named narrative events — explode, reveal, colour, reconstruct — silent by default, one line to hook audio in
✦Complete Vite + React Three Fiber source — no assets to download, it runs from npm install

Unlock NEON — The Next Interface

Buy just the prompt, the full source, or get All-Access for every design in the store.

Or get All-Access →

A prompt is a starting point, not a build script. AI models land differently on every run, so expect to refine the result — spacing, timing and copy — before it feels like the preview. The source pack is that preview, finished and running.

NEON — The Next Interface

How to run this

More like this

BR-Buds — Hear the Impossible

BR Tracker — Spatial Tracking Device

BR-Skins — The Anatomy of Glow

Vitrine — Hardware Showcase