Bamboo Climb

Cinevva's analyzer read this game's design doc and its source, then wrote the brief below. "Make your own" hands it to the game creator as your opening message, so you start from a real spec rather than a one-line idea.

Create a browser-playable Three.js cinematic cutscene called “Bamboo Climb.” It should run automatically, loop, and be pausable/restartable rather than being a conventional score-based game.

Use a full-screen perspective 3D camera with a clean, low-poly/toy-like visual style. Set the scene in a very dark, foggy bamboo forest: a broad dark brown ground plane, a narrower brown dirt path running straight into the distance, and dense bamboo on both sides. Populate the forest with roughly 240 randomly varied bamboo stalks extending along the path for a long distance. Each stalk is a tall green cylinder with a slightly varied radius and height, darker segment rings spaced up its length, a small cluster of simple cone-like green leaves near the upper portion, and a slight random lean. Use deep green-black fog and a dark green background so distant bamboo fades into the atmosphere. Add small scattered dark/brown pebbles on the ground for parallax detail. Add subtle slow collective bamboo sway.

At the far end of the path, place one hero tree just right of center: a large brown faceted cylindrical trunk about 9 units high, a thick angled branch near the top, and a rounded green canopy. The branch should provide a visible perch point.

The main character is a cute stylized panda assembled from simple low-poly rounded meshes. It has a large white rounded body and belly, black torso/shoulder patches, a white head and snout, black ears, black oval eye patches with small white eyes and black pupils, a small black nose and subtle mouth, black segmented arms and legs with paws, and a tiny white tail. Keep the panda oversized in the foreground when the camera is close, matching a cinematic third-person/follow presentation. The panda begins at the near end of the path, centered around z=6, facing down the path toward negative Z.

Implement an automatic timeline with these phases and exact behavior:
1. WALK: The panda moves forward along negative Z at about 2 units/second from the beginning toward the hero tree. Its x position gently oscillates side to side. Animate a procedural walk cycle: opposite arm and leg swings, bent elbows/knees, slight head bob and ear movement. Start with an establishing wide/high shot for the first 3.2 seconds, then blend to a follow shot behind and above the panda. Display the caption “A panda wanders quietly through the bamboo…”
2. APPROACH: When the panda is near the tree (around z=-78), have it move toward a point just in front of the trunk, turn toward the trunk, and continue its walking animation. Cut/blend to a side tracking shot. Caption: “A sturdy tree—perfect for climbing.” Transition after reaching the trunk or after about 4 seconds.
3. CLIMB: Lock the panda close to the trunk and raise it vertically at about 1.15 units/second to around 5.35 units high. Face it toward the trunk. Animate alternating reaching arms hugging the trunk and bent alternating legs, clearly showing the climbing action. Use a closer angled shot focused on the paws, with a gradual zoom-in. Caption: “Up we go…”
4. PULLUP: Over roughly 1.6 seconds, animate the panda pulling from the trunk onto the angled branch/perch. Move it along an eased arc with a small upward lift, tuck the legs, extend both arms forward, and rotate it outward as it swings onto the branch. Use a higher camera angle. Caption: “Just one more pull…”
5. PERCH: Place the panda sitting on the branch/perch. Keep a seated bent-leg pose and slowly settle it toward the perch. Have it wave repeatedly with one arm using a gentle sinusoidal motion while the camera makes a cozy close-up/slow zoom. Caption: “Top spot claimed.” Hold for about 5 seconds.
6. FADE: Fade the entire screen to black over roughly 1.7 seconds, then restart the cutscene from the beginning with a brief fade-in, preserving the continuous loop.

Use warm cream directional key light from above/front, cool blue fill light from the opposite direction, and soft greenish ambient light. Use standard rough materials, ambient occlusion-like depth through fog, and cinematic contrast. Add subtle black letterbox bars at the top and bottom throughout, varying their height slightly by beat (more pronounced during close-ups), and use smooth eased camera cuts/blends between shots. Camera shots should be: initial high establishing view, follow view behind the walking panda, side view during approach, close angled view during climbing, elevated view during pull-up, and close branch-perch view. Aim the camera at the panda’s upper body/head.

Overlay a translucent rounded dark panel in the top-left with the title “Bamboo Climb” in large white bold text, a status line such as “Playing • phase: walk • t=0.0s,” and a controls line “Space: pause • R: restart.” Update the status continuously with Playing/Paused, the current phase, and elapsed time. Show captions in a rounded semi-transparent gray/dark box centered near the bottom, with light text, only during the appropriate phases.

Controls: Space toggles pause/unpause and freezes the timeline/animation; R restarts at the beginning. While paused, enable mouse-drag orbit controls so the viewer can inspect the scene, and disable orbit controls during playback. Include stable responsive resizing and cap device pixel ratio around 2. Expose window.getGameState() and window.setGameState(patch) APIs containing paused state, gameOver placeholder, time, phase/phaseT, panda position/yaw/climbY/wave, camera position/target/orbit status, and fade amount, so the running cutscene can be inspected or tweaked.