scroll-world
Skill0 starsChanged 2 months agoMITView on GitHub
Build a scroll-scrubbed fly-through landing: as the visitor scrolls, a pre-rendered camera flies into each scene and on to the next with no cuts. Use when: 3D world landing, diorama site, Emons-style isometric world, scroll cinematic, browse-through-the-industry hero, camera-scrub page, or the user runs /scroll-world. Uses native image_gen, image_edit, and image_to_video plus a portable vanilla-JS scrub engine. Load native image tools if present, else DEGRADED before any generate/edit/video call. Not for scroll-led storytelling without a camera world (use scroll-craft), an ordinary landing (use impeccable), photoreal ads/identity with no world page (use visual-studio), or UI chrome motion (use emil-design-eng after Impeccable).
11 other projects use a version of this.
Adopted by
Most recently taken up by
- podo/design-agent-skillstheir own version, first seen Nov 8, 2026
- coco-research/cocotheir own version, first seen Nov 1, 2026
- ulises-jeremias/agent-toolkittheir own version, first seen Nov 1, 2026
- susantedit/claude-skillstheir own version, first seen Oct 20, 2026
- robbertvanempel/scroll-world-skilltheir own version, first seen Oct 13, 2026
- jaron-goh-centr/claude-skillstheir own version, first seen Oct 11, 2026
Used with
Projects with it also use design-taste-frontend and writing-plans.
Other files people use alongside this one.
Files found in the same public projects as a version of this one, more often than they turn up anywhere else. Each project counts once, large collections count for less, and this file's own repository is left out.
AnasX7Skilldesign-taste-frontend
Anti-slop frontend skill for landing pages, portfolios, and redesigns. The agent reads the brief, infers the right design direction, and ships interfaces that do not look templated. Real design systems when applicable, audit-first on redesigns, strict pre-flight check.
Also in 4 projects that use this
OpenAISkillwriting-plans
Use when you have a spec or requirements for a multi-step task, before touching code
Also in 3 projects that use this
Other versions11 projects use a version of this.
Word for word · 0
None found.
Edited · 0
None found.
Wrote their own version · 11
- oso95/scroll-world★ 9.8ksame name
- coco-research/coco★ 797same name
- podo/design-agent-skills★ 32same name
- ulises-jeremias/agent-toolkit★ 19same name
- vyctncao/scroll-world★ 6same name
- robbertvanempel/scroll-world-skill★ 2same name
- cal1888/claude-code-skills★ 1same name
- Biznomad/claude-skills★ 0same name
- jaron-goh-centr/claude-skills★ 0same name
- moronireis/agent-system-partners★ 0same name
1 more not listed
How matches are found. Word for word: the exact same text. Edited: shares passages with this file (“99% same” means 99% of its five-word phrases also appear here; 10% or more counts). Their own version: similar meaning, or, weakest, the same name. We can’t tell which project had it first. Projects are counted among the 200 most-starred candidates, and mentions are links to the repository we found, up to 50 per site, so both counts are a floor.
In this repository47 other files it gives its agents.
- templates/AGENTS.mdAGENTS.md
- academicSkill
- adhdSkill
- agent-architecture-auditSkill
- api-designSkill
- automation-audit-opsSkill
- browser-actSkill
- chrome-devtools-axiSkill
- click-path-auditSkill
- codebase-designSkill
- code-tourSkill
- contract-firstSkill
- cost-aware-llm-pipelineSkill
- diagnosing-bugsSkill
- diagram-designSkill
- domain-modelingSkill
- emil-design-engSkill
- eval-harnessSkill
- found-this-designSkill
- full-audit-keamananSkill
- full-performance-auditSkill
- gh-axiSkill
- grill-with-docsSkill
- humanizerSkill
- hyperframesSkill
- id-demo-videoSkill
- img2threejsSkill
- impeccableSkill
- install-anti-slopSkill
- markitdownSkill
- matt-code-reviewSkill
- mongodb-opsSkill
- playwright-qaSkill
- prompt-optimizerSkill
- prototypeSkill
- researchSkill
- scroll-craftSkill
- skill-stocktakeSkill
- smartbook-ingestSkill
- smartdocSkill
- supabase-opsSkill
- tddSkill
- to-specSkill
- to-ticketsSkill
- vercel-opsSkill
- visual-studioSkill
- writing-for-agentsSkill
The file
We split this skill into the rules it gives an agent
9 rules. 0 are common, 6 are distinctive, and 3 are very specific to this project.
0
Common
Most of the 10 edited versions we read keep these.
6
Distinctive
This author's own choices. Worth a look.
3
Very specific
Tied to their project's names, files or tools. Probably skip.
- Common
- Distinctive
- Very specific
- Very specific: line 17
Before any image_gen, image_edit, image_to_video, or reference_to_video call, load native image tools if the session exposes them.
- Distinctive: line 27
Use only native image/video tools or local scripts.
- Distinctive: line 29
Do not invent tool parameters.
- Very specific: line 32
If PRODUCT.md, DESIGN.md, or an Impeccable pin exists, copy hex, name, type, and forbidden treatments into the pack lock.
- Distinctive: line 35
Ask at most four labeled questions, and only for blockers the brief does not already answer.
- Distinctive: line 37
Keep the mechanic fixed: continuous fly-through, scroll as scrubber.
- Distinctive: line 54
Do not load Emil for stills.
- Distinctive: line 75
Ask at most these four, skip any the brief already answered:
- Very specific: line 113
Follow the live browser contract: opencode-chromium-cdp start, then browser-act or chrome-devtools-axi attached to that CDP.
“Common” is measured: kept by at least 6 in 10 of the 10 edited versions of this file we could read. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.
Files
Scroll World
A landing where scroll drives a camera. The camera flies into a scene, then on to the next, as one connected flight. Stills and clips come from native image/video tools. The page only scrubs pre-rendered video by scroll position.
Load first
Before any image_gen, image_edit, image_to_video, or
reference_to_video call, load native image tools if the session exposes them; otherwise write prompt files and mark DEGRADED. Tool choice, prompt
length, real-people references, shot length, and ffmpeg live there. Do
not restate them here.
Paid video generation backends (Monid, Higgsfield, Kling) are not vendored into OpenCodeBestFriend. If native image/video session tools are absent and external video CLIs are not configured, report NOT_CONFIGURED and degrade gracefully: generate prompt packs (.scratch/scroll-world/<slug>/prompts.md) and static scene posters without failing.
Hard rules
- Boundary:
scroll-craftowns 2D timeline/scrollytelling;scroll-worldowns continuous 3D camera flight landings. Do not cross the seam. - Use only native image/video tools or local scripts. Do not call arbitrary external image/video APIs or unconfigured cloud services.
- Do not invent tool parameters. There is no end-image lock and no video-to-video. Missing capability uses the fallback in pipeline.md.
- If
PRODUCT.md,DESIGN.md, or an Impeccable pin exists, copy hex, name, type, and forbidden treatments into the pack lock. Do not invent brand facts. - Ask at most four labeled questions, and only for blockers the brief does not already answer.
- Keep the mechanic fixed: continuous fly-through, scroll as scrubber.
- Match the user's language. Architecture names stay A / B.
Handoff
| Request | Skill |
| Fly-through, diorama, 3D world, camera-scrub landing | this skill |
| Existing site; world is the hero | this skill produces world + engine; impeccable owns chrome, tokens, copy system |
| Scroll-led storytelling without a camera world | scroll-craft |
| Ordinary landing without a camera world | impeccable |
| Photoreal stills, ads, cinematic, identity, thumbnails (no world page) | visual-studio |
| Photoreal person/creature inside this world | this skill owns the chain + page; load visual-studio cinematic for those stills/clips |
| Game sprites, tiles, icon sets | game-asset-core |
| Deterministic HTML composition rendered to video | hyperframes |
| UI chrome motion (nav, buttons), not the video scrub | emil-design-eng after Impeccable |
Do not load Emil for stills. Do not load Impeccable to render the video chain. Do not load visual-studio for an ordinary landing.
Run
- Interview only what is missing. Write the pack at
.scratch/scroll-world/<slug>/. Templates: prompts.md. - Generate stills. One style preamble, byte-for-byte, on every still. Review cohesion before any video.
- Pick the architecture the user chose. Default A (walkthrough / locked-iso). B only for diorama / miniature / god's-eye. pipeline.md.
- Encode for scrubbing. Mount scrub-engine.js with index-template.html or into the existing site.
- QA seams in background Chromium. Save screenshots to files.
Interview
Ask at most these four, skip any the brief already answered:
- Subject (open) — business or idea + one-line pitch.
- Camera — fly-through (B: dives + aerial hops) / walkthrough (A, default) / locked-iso (A + fixed angle). One-line trade-off each.
- Journey — propose 5–7 ordered scenes from the subject's own value chain; let the user edit. Last scene is the hero + CTA.
- Mobile — native 9:16 second chain, or desktop only. State the generate count. Never ship a 16:9 centre-crop as "the mobile version."
Art-direction default: clay diorama isometric for B; grounded / photoreal for A. User may override. Palette: design system first; otherwise propose 4–6 named hexes.
Count before generating: A = N stills + N videos. B = N stills +
N dives + N−1 connectors. Mobile doubles the video count.
Architectures
A — continuous forward take (default). Each leg starts on the
previous leg's actual last frame. No connectors. Wire
connectors: [] and a small crossfade (~0.08). Camera never reverses
across a seam. Locked-iso is A plus the locked-iso clause in every leg.
B — dive + aerial hop (diorama only). One dive per scene from that
scene's still. A connector starts on dive i's actual last frame and
flies toward scene i+1. Native tools cannot lock the connector's last frame to
the next dive. The engine crossfade covers the near-miss. If a hop is
unusable, set that connector to null (direct crossfade). Do not use B
on a grounded photoreal walkthrough without saying it will read as a
rewind.
Inside one clip the camera may orbit, crane, or push-in. Across a seam it must not reverse. Every A leg ends in a slow forward drift (final second) and the next leg begins by continuing that drift.
QA
Follow the live browser contract: opencode-chromium-cdp start, then
browser-act or chrome-devtools-axi attached to that CDP. Never Google
Chrome, chrome-direct, --headed, or HEADED=1 unless the user asks
to see a window.
- Screenshot just before and after each seam. Judge composition, not PSNR. A pop means the handoff used a still instead of a rendered frame, or B's crossfade cannot hide a content jump.
- Confirm
video.seekable.end(0) > 0(blob URLs) and thatcurrentTimetracks scroll. prefers-reduced-motion: stills only, no video, no particles.- Mobile opt-in: serve the 9:16 files (
videoWidth < videoHeight). Desktop-only: one phone-viewport sanity check; engine hardening is already on.
Deliver
The page (or the mount into the existing site), the asset folder, and short labels (architecture, N, mobile yes/no, what is locked). Do not dump prompts, retries, or tool names unless the user asks.
Does it work?
Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.
No reviews yet
People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.
- It worked
- Partly
- It didn't
Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.
Your trail
Files you open will collect here, so you can find them again.
Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.
Now do this for your own.
Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

