Behind the website · the 3D room

How we built Helen’s 3D sitting room.

We created a warm room in Three.js, placed Helen’s 3D model on a velvet ottoman, and limited the camera so visitors can look around without wandering through the furniture.

More build notes: How we built Helen’s website · The four live cams · The namesake gallery · Secure checkout

Before A plain WebGL box with no finished room.
Helen sitting on the ottoman in the 3D court
After The finished room and Helen’s seated 3D model.

Why we made a room

Most 24/7 live cat cam pages use a grid of video boxes. We wanted something more welcoming for Helen, a rescued tortoiseshell calico and young mother found at the Woman’s Club of Winter Park. The site should feel like visiting her home, not checking a security monitor.

The result is a Three.js room with dark plaster walls, a marble floor, gold details, a velvet rug and ottoman, wood paneling, a fireplace, and a chandelier. The live feeds appear on a wall television instead of floating in space. You can also view them as a simple list on the live cat cams page, or learn about Helen Morse and the cat named for her in the namesake gallery.

We considered letting visitors fly anywhere in the scene, but that made the room harder to use and easier to break. The final camera keeps you in a comfortable viewing area. It also keeps curious guests out from under the ottoman, a boundary Helen would probably support.

A small set of materials

We kept the material palette simple: marble for the floor and bases, aged gold for trim and frames, dark wine-colored velvet for the rug and ottoman, wood for the lower wall panels, and lightly reflective plaster for the walls. The contrast helps Helen’s tortoiseshell coat remain visible.

We built the room as an eight-and-a-half-unit-wide box with a back wall and two side walls. The viewer stands where a fourth wall would be. We then added gold trim, wall lights, fixed curtains, a decorative fireplace, and the chandelier. The fireplace does not simulate real flames; Florida is managing without the extra heat.

The ottoman is a low cylinder with gold piping on a shallow marble base. Helen’s seated GLB file—a common format for 3D models—is sized to fit it. If the best model cannot load, the page tries a lighter seated model, then a standing model, and finally a simple figurine. That fallback order prevents an unexplained empty cushion.

Why the camera movement is limited

The room uses orbit controls, which let you look around a central point. We lock the camera’s height and distance, turn off panning and zooming, and allow only a modest side-to-side view. This keeps the controls simple and prevents the camera from passing through walls or furniture.

When you choose a live feed, the same camera moves to a viewing position in front of the wall screen. Returning home moves it back to seated eye level. The camera cannot rise above the picture lights or leave the room. Those limits are intentional, not a broken flight feature.

We also keep movement smoothing on and automatic rotation off. The view should feel like gently turning your head, not piloting a drone around a cat who did not request aerial coverage.

Lighting Helen clearly

The Three.js WebGL renderer uses film-style tone mapping, a warm background, and soft shadows when the device can handle them. Several lights keep Helen’s face and fur visible against the dark walls: a main light from the front, a softer fill light, a cool edge light, and a small light in the chandelier. Light fog adds depth without hiding the room.

The page lowers pixel density, shadow quality, and model detail on less powerful devices. The 3D room needs to open on a phone, not win an argument with its graphics processor. If it cannot load, the written page still works.

What we left out

We skipped a walkable garden, free-flight controls, ottoman physics, a made-up second cat, and floating camera screens. The feeds belong on a television because that is where a household normally puts a screen. Helen’s 3D model stays seated while the live cameras show what the real cat is doing.

This room also does not claim to be the Woman’s Club or the Morse Museum. Helen Morse founded the club in 1915, and Charles Hosmer Morse is the Winter Park industrialist shown by the east bust. This website is an independent tribute. Read how we made the namesake gallery, added four live cat cameras to the 3D room, and built checkout that stays on this site.

For the technical summary: Vite organizes and serves the pages, TypeScript powers the site code, the Node server listens on port 5178, pm2 keeps the helenthecatlive process running, and Three.js draws the 3D room. The build FAQ and questions page have shorter answers.

See the finished room

Watch Helen live from the 3D sitting room, or read her story in the namesake gallery. You may look around, but the no-flying rule remains. Helen’s airspace is tightly controlled.