Interface sequences · Rendered draft
Stream the answer while preserving its page context
Study the source, inspect the editable build, then adapt the treatment to your own content.
What the source does
A question appears beside a lodging page. The answer grows downward, then the assistant pane scrolls upward while the original page stays fixed at the left.
Use independent content scrolling to reveal the answer without losing the source context.
Phase notes
- Frame 0 — Page remains visible
- Frame 4 — Question bubbles appear
- Frame 31 — Answer begins
- Frame 58 — Growing answer starts to scroll
- Frame 123 — Final reading position
Use this example
- Watch the source and draft at normal speed. Compare the order of actions, the held states, and the transition into the result.
- Download the project and read its README before changing inputs. The package includes its implementation and declared dependencies.
- Replace the sample content through the package's documented input or content builder. Keep source footage in the research comparison.
- Render your adaptation and inspect text fit, framing, intermediate states, and entry and exit frames.
A runnable draft is not a fidelity approval.
The source and remake are different assets. The original code-based illustration remains editable; source footage is a research reference. Read the retained findings below before using the choreography.
Recorded limits
- Source sampled at three frames per second; geometry, cursor tracks, and phase thresholds are manually fitted approximations.
- Arial, original page content, and simplified vector objects replace source-specific photography and interface details.
- No independent moving-source fidelity approval. This is a silent, source-linked editable study.