# Cereal Stays: a booking demo with its own scene controls

> A 3D location booking demo built with a set of live scene controls for lighting, atmosphere and composition, shared as part of the experience.

Canonical page: https://andersonmancini.dev/blog/cereal-stays-scene-controls

Published: 2026-09-13 · 1 min read · Tags: react-three-fiber, three.js, tooling, launch

Cereal Stays is a 3D location booking demo, and the most interesting part of it is not the scene. It is the **set of controls** that was built to shape the scene.

![The Cereal Stays scene](https://andersonmancini.dev/images/cereal_bnb.webp)

## The idea

Building with Three.js is about creative freedom, and this project leans into that. Together with [@dieg0liv](https://x.com/dieg0liv), I made custom scene controls that let us reshape the environment in real time: **lighting, atmosphere and composition**, all tunable while the scene stays live.

## The debug tools are part of the demo

What I like most is that these tools double as a way to share the process. Seeing how something was built has taught me more than any finished render, so the demo invites you behind the scenes: you can change the scene yourself and see which control does what.

## What is in it

- live lighting controls,
- atmosphere tuning,
- composition controls, and a debug UI that is meant to be used as part of the experience,
- React Three Fiber holding the scene together.

## Try it

The demo is live at [cerealbnb-demo.vercel.app](https://cerealbnb-demo.vercel.app), and the details are on the [project page](https://andersonmancini.dev/projects/cereal-stays.md).

## Related projects

- [Cereal Stays](https://andersonmancini.dev/projects/cereal-stays.md) — 3d location booking