Scroll World: AI-Generated Scroll Animations Explained
Chase AI demos Scroll World, an open source skill that uses AI coding agents to build cinematic scroll-animated websites in a single prompt session.
Written by AI. Dev Kapoor

Photo: AI. Mika Sørensen
There's a particular kind of website that stops you mid-scroll — the ones where the scene moves with you, where a crane unfolds as you inch down the page, or a subway rushes in from the right while you're still reading the headline. Building that kind of experience the traditional way is genuinely miserable. You're rendering video, extracting individual frames with FFmpeg, mapping frame indices to scroll positions, wrangling multiple animations to feel like one coherent story. It takes time, patience, and a specific kind of stubbornness that most people don't have on deadline.
That's the problem a developer named Peter Wing appears to have quietly solved — and it's what Chase AI, a YouTuber and AI tools educator, is now showing off with a forked and improved version of Wing's open source project, Scroll World.
What Scroll World Actually Does
The core mechanic is elegant in retrospect, even if executing it manually was nightmarish. You start with a single still image. That image gets turned into a short video. FFmpeg then extracts every individual frame from that video, and a bit of JavaScript maps each frame to a scroll position on the page. As the user scrolls down, they're essentially scrubbing through a video timeline — except it feels like the world is moving around them.
Chase AI describes the underlying challenge well: "You're making multiple videos, you're getting the starting frames, you're trying to make them match up, you're taking all the frames out one by one by one. It's a pain in the butt."
The Scroll World skill automates this entire pipeline. You invoke it through Claude Code or OpenAI's Codex, provide some creative direction, and the agent handles image generation, video generation, frame extraction, and the glue code that ties it all together — all without leaving the terminal.
The image and video generation runs through the Higgsfield platform, accessed via an MCP (Model Context Protocol) server or CLI. Connecting it is straightforward: grab the MCP URL from the Higgsfield dashboard, authenticate, and your AI coding agent gains access to Higgsfield's generation models directly from the command line.
The Fork, and What Changed
Chase AI credits Peter Wing as the original author — he found the project on Twitter, Wing open sourced it, and that's the stack this whole demo builds on. What Chase AI added in his fork (also linked in the video description) are two practical improvements: budget tiers that let you control how many scenes you generate, and better mobile handling, including an option for a full portrait video chain that creates separate assets for mobile viewports.
The budget question matters here because generating multiple AI videos for a single website isn't free. The Higgsfield credit system is opaque enough that the specific cost of any given project will depend on your plan tier and what generation options you select — so it's worth checking Higgsfield's current pricing directly before committing to a multi-scene build. Chase AI's broader point, though, is that four scenes hits a reasonable sweet spot between visual impact and cost. Six scenes, which he used for his original Claude Code demo, is — his words — "probably overkill for most people."
The Demo: A Japan Travel Brand in Origami
For the Codex demo, Chase AI builds a website for a fictional boutique Japan travel brand, directing the AI toward an origami visual aesthetic. The workflow starts with a brief interview: the skill asks what kind of site you're building, what each scene should depict, how many scenes you want, and how aggressively you want to handle mobile optimization. You can arrive with a fully formed creative vision or just start talking — the agent will ask questions and help you figure it out.
The "anchor image" step is where the creative direction crystallizes, and Chase AI flags it as the moment that deserves the most attention: "This is the part you really have to nail because if you don't like it and you say yes, everything's going to be based on it." Every subsequent scene will reference the anchor's aesthetic, which is how the tool ensures visual coherence across what would otherwise be a bunch of unrelated AI generations. One style, one story, multiple chapters.
After approving the anchor, you basically wait. In Chase AI's demo, the full four-scene build took 32 minutes — which is, depending on your perspective, either impressively fast for what's being generated or a good time to make coffee.
The result: a Japan travel site with scenes moving from city streets and subway arrivals, through a traditional house unfolding, to a hotel, ending with a bird in flight. Visually, it lands. The individual scenes are strong. The per-scene motion is genuinely cinematic.
The Honest Part: Where It Falls Short
Chase AI doesn't pretend the output is perfect, and that candor is worth noting. His main complaint is scene transitions. The Codex-generated version produces hard cuts between most scenes — "When we go from scene one to scene two, pretty hard cut." Scene three to scene four happens to look great, with a blurred background element gradually coming into focus before the transition, giving the whole thing a real sense of depth. But that quality isn't consistent across the build.
His comparative read is that the Claude Code version handles scene-to-scene transitions more smoothly overall — describing scenes that "push out of the top" into the next rather than cutting abruptly. That's an interesting data point, not a verdict: these are one-shot outputs from two different AI coding agents running the same skill, and iteration would almost certainly close the gap.
The larger question Chase AI raises at the end is the right one: this is a visual foundation, not a complete website. "I think the technical problems of creating an animated scrolling website like this that looks coherent and doesn't look janky and doesn't look low quality is pretty difficult." That problem appears to be largely solved. What remains — CTAs, copy, forms, actual user flows — is the more conventional web work that any competent developer or AI agent can layer on top.
The Open Source Angle
This is where it gets interesting from a community perspective. The foundation of this whole thing is Peter Wing's open source project. Chase AI forked it, improved it, and is now distributing both versions. That's the OSS model working as intended: someone builds something clever, posts it on GitHub and Twitter, a second person finds it, adds mobile support and budget controls, and suddenly a workflow that required specialist expertise is accessible to anyone with a terminal and an API key.
The Scroll World skill is essentially a very long, very opinionated prompt — a set of instructions that tells an AI coding agent how to orchestrate a complex multi-step process. Skills like these are becoming their own quiet category of open source contribution: not code libraries exactly, but reusable reasoning structures that make AI agents dramatically more capable for specific tasks. Whether that pattern gets treated with the same care and attribution that traditional OSS contributions receive is an open question. Chase AI's explicit credit to Wing is a good sign. Not everyone in this space is as scrupulous.
For developers watching this space, the more durable takeaway isn't about any specific model or platform — it's that the effort floor for visually ambitious web work just dropped significantly. A year ago, a cinematic scroll-animated website for a boutique travel brand was a multi-day project. Now it's a 32-minute agent run and some honest feedback about which transitions need polish.
Whether that changes who gets to build premium-looking digital experiences, or whether it just makes cheap work cheaper while the ceiling stays the same — that's the conversation this tool is quietly opening.
Dev Kapoor covers open source software and developer communities for Buzzrag.
AI Moves Fast. We Keep You Current.
Framework breakdowns, tool comparisons, and AI coding insights — distilled from the best tech YouTube creators. Free, weekly.
More Like This
NotebookLM + Claude: Teaching AI Agents Domain Expertise
A developer demonstrates using NotebookLM to generate Claude Code skills—custom knowledge modules that teach AI agents specific domains in minutes.
Ten Tools to Fix Claude Code's Terrible Design Aesthetic
Claude Code generates the same purple gradients and Inter font on every site. Here are ten plugins and skills that might actually fix its design problem.
When Being Less Articulate Makes AI Models More Accurate
A GitHub repo forcing Claude to 'talk like a caveman' went viral. The research behind it reveals something unexpected about how large language models fail.
Claude Code's Agent Teams: The Coordination Layer Nobody Saw Coming
Anthropic quietly released Agent Teams in Claude Code—an experimental feature that lets AI agents coordinate like actual dev teams. How it works, what it costs.
Claude Code Loop Types: A Practical Breakdown
AI LABS maps five Claude Code agentic loops—from stateless to self-improving—and explains which use case each one is actually built for.
Anthropic Engineers Have No Consensus on Claude Code
Ray Amjad attended a Claude Code event in Tokyo and found Anthropic engineers running wildly different workflows. What that non-consensus actually means for developers.
Google's Gemma 4 Turns Claude Code Into a Free Local Tool
Google's new Gemma 4 models let developers run Claude Code locally for free. Here's what works, what doesn't, and who this actually serves.
Karpathy Skills Repo: Discipline Over Features for AI Code
Andrej Karpathy's lightweight GitHub repo tackles AI coding agents' behavioral problems with four principles that prioritize reliability over power.
RAG·vector embedding
2026-07-12This article is indexed as a 1536-dimensional vector for semantic retrieval. Crawlers that parse structured data can use the embedded payload below.