Scroll Cinematic Claude — Development skill for Claude Code

🎬 Scroll-Cinematic — 3D Scroll Websites for Claude Code

 *Three real sites built by this skill with one prompt each — every visual AI-generated, every scene scroll-scrubbed in 3D.*

Build **award-winning "3D scroll" websites from ONE prompt** — for any product, portfolio, contractor, restaurant, agency, or brand.

Claude Code + the **Higgsfield MCP** generate a cinematic hero shot and 3D clips (360° spins, fly-throughs, explosions, reveals), slice them into scroll-scrubbed frames, build a polished branded multi-section site with buttery smooth scrolling, and launch it on localhost — all from a single prompt.

The viral "3D scroll" effect (Apple product pages, Awwwards sites) isn't Three.js — it's a **canvas image-sequence scrub**. This skill automates the entire pipeline.

---

⚡ Install (one command)

mkdir -p ~/.claude/skills && git clone https://github.com/zubair-trabzada/scroll-cinematic-claude.git ~/.claude/skills/scroll-cinematic

Then **restart Claude Code** so it picks up the skill. That's it.

Already installed? Update with:

cd ~/.claude/skills/scroll-cinematic && git pull

---

✅ Requirements

What	Why	How
Claude Code	runs the skill	claude.com/code
Higgsfield MCP + credits	generates the images & 3D clips (~$1–2/site)	in Claude Code: /mcp → Add server → paste your Higgsfield MCP link
ffmpeg	slices clips into frames	auto-installed by the skill — nothing to do

Check the MCP is connected: type `/mcp` in Claude Code → `higgsfield` should be green.

---

🚀 Use it (the one prompt)

Open a **new Claude Code session** and paste — swap the bracket for anything:

Use the scroll-cinematic skill to build a 3D scroll website for [WHATEVER IT IS].
Generate a high-end cinematic hero plus two 3D clips