Reduce motion is on · previews stay still
All effects Cinematic animations Quiet Timber Studio Lobby Quiet Timber Studio Lobby Quiet Timber Studio Lobby is a published Three.js prompt by @MengTo. It has source credit and no verified 3dmotion rebuild.
by @MengTo on GitHub
Result by @MengTo Prompt by @MengTo. Copies include source credit.
Original prompt Free · 2,711 characters Create a responsive, single-file portfolio for a fictional digital studio. The experience should feel like entering a place before reading a case-study index: tactile, cinematic, slightly strange, and still usable. ## Experience - Start…
Create a responsive, single-file portfolio for a fictional digital studio. The experience should feel like entering a place before reading a case-study index: tactile, cinematic, slightly strange, and still usable.
## Experience
- Start with a full-viewport real-time 3D lobby inspired by a quiet timber interior rather than a generic technology showroom.
- Give the room several understandable interaction targets: a stack of portfolio CRTs, an arcade cabinet, a basketball hoop, and a sliding door into a second space.
- Let each target move the camera into a distinct state, expose one focused interaction, and provide a reliable escape or return path.
- Continue below the lobby into an editorial studio page with a manifesto, masonry work grid, capability list, people/contact block, and footer.
- Keep the interface mostly monochrome with one warm signal color. Use a compact monospaced type style for labels and a confident grotesk for headlines.
## Motion and visual system
- Build the lobby in Three.js from procedural geometry, canvas-painted textures, lights, shadows, fog, and custom shader passes.
- Add a restrained analog-video post effect with grain, scanlines, chromatic drift, and occasional head switching.
- Use camera interpolation and physical-feeling secondary motion for scene transitions.
- Make the main menu feel like a physical object in the scene; preserve normal keyboard and pointer access for its links.
- Use scroll-triggered assembly or particle effects only where they clarify rhythm. Respect `prefers-reduced-motion` and keep text available in the DOM.
## Technical constraints
- Deliver one deployable `index.html` with HTML, CSS, JavaScript, shaders, and project assets embedded where practical.
- Use relative or embedded asset references so the project works from a GitHub Pages repository subpath.
- Require no framework, package install, build step, server function, secret, or environment variable.
- Cap device pixel ratio and lower rendering cost if sustained frame time becomes too high.
- Support a desktop viewport and a narrow mobile viewport around `390 × 844`.
- Provide semantic landmarks, accessible labels, visible focus states, and explicit close/return controls.
- Keep contact forms demonstrational unless a real, consented backend is configured.
## Verification
- Serve the file over a local HTTP server rather than relying on `file://`.
- Check initial render, every primary lobby state, its return path, menu open/close, anchor navigation, and responsive layout.
- Confirm that console errors are absent and that external font/module dependencies are documented.
- Capture a real screenshot from the verified runtime for the repository README. Prompt by @MengTo on GitHub. github.com/MengTo/sublevel-studio/blob/HEAD/PROMPT.md . Copies include this credit. Original prompt, credited
collection · petergpt Open, then Run
Original prompt, credited
collection · petergpt Open, then Run
Original prompt, credited
collection · petergpt Open, then Run
Original prompt, credited
collection · petergpt Open, then Run
A Verified card includes a receipt and a pinned single-file rebuild you can run here. Recorded limitations explain what the rebuild changes or leaves out.
Quiet Timber Studio Lobby@MengTo · Cinematic animations