Skip to exhibit
a. PLAYBOOK INTERACTIVE STUDIES 中文

FIELD NOTES 01 / 02

A day in a bear’s life.

From a desk to a garden bench, a little living space inside a webpage. It has its own day, and a moment for you when you say hello.

01.A / AT THE DESK
Try the mug, lamp, curtain, or a gentle head pat.

Give it a time of day.

Scene simulation · Singapore time

09:00 · Clear skies · A slow start

The motion collection

Time and weather here are simulated. Actions transition at a safe boundary. In clear daylight, the bird’s first wait is shortened to about 3 seconds with the curtain open.

12 motion clips12 fps atlas playback232 × 160 scene coordinatesNo MP4 playback in the browser
01.B

At the end, it’s still here.

THE GARDEN READING CORNER Say hello, open the book, or try the mailbox.

A quiet little response.

The tree and bench stay still. Only the bear turns a page, looks up, and waves. A small scene gives the page a gentle ending.

Try the mailbox

This is a local rehearsal. No email or subscription is sent. On the homepage, the letter drops only after subscription succeeds.

150 frames94 × 101 moving region only10 fpsMotion atlas loads near the viewport
MAKING OF

Draw the motion. Build the life.

H3 draws natural sipping, page turns, and waves. Code owns time, weather, taps, content previews, and sequencing. Keeping those separate lets the window and lamp evolve without regenerating every video.

The desk uses full scene frames with independent window, lamp, and prop layers. The footer freezes its environment and updates only a small character patch. One idea, two rendering strategies.

Visit the real homepage ↗

  1. Lock the character and composition

    Review a still first: silhouette, palette, desk baseline, and movement margins. Lock the camera and leave room for ears and outstretched arms.

  2. Generate one complete action

    Rest pose → action → rest pose. For routines, author separate entry, hold, and exit segments.

  3. Extract, matte, freeze the environment

    Choose useful frames, remove the background, and use one coordinate system. The desk must stay still and the pale muzzle must stay opaque.

  4. Pack an atlas and hand off to the state machine

    Switch actions at a natural exit. Pause offscreen or in hidden tabs, use stills for reduced motion, and keep a poster if loading fails.

A starting recipe for another agent

Reuse the character still and existing atlases first. Layout changes need no video generation. Only new motion goes through H3. Keep masters, request records, and runtime assets separate; never put API keys in the page.

reference → H3 master → selected frames → alpha matte → WebP atlas
idle → enter → hold ↺ → exit → next action
one-shot → previous routine

Source entry points: BearTimeline · build-daily · footer-atlas · footer player

EXPLORE THE OTHER ROOMA gaze that follows you.
Follow what matters

订阅 Airing

选择接收方式,再决定你真正想看的内容。

不会重复订阅;可随时在任意邮件底部调整偏好或退订。