lets-scroll Skill：把产品变成滚动穿越式电影落地页的视觉黑科技

lets-scroll Skill：把产品变成滚动穿越式电影落地页的视觉黑科技

「滚动穿透」体验正在重新定义 AI 时代落地页的视觉标准。lets-scroll 是专门为 Claude Code / Codex 等 SKILL.md 兼容 Agent 开发的一个视觉类技能包，核心能力只有一条：把任何一个品牌、产品或行业，转化为一页滚动驱动、摄像机沿连续路径穿越 AI 生成场景的电影级落地页。用户滚动鼠标，摄像机不间断地在各场景间穿梭，没有任何切换感——这就是该 Skill 打磨的核心体验：seamless continuous shot。

功能与原则

lets-scroll 的功能定义非常纯粹：通过 scroll 位置驱动预渲染的摄像机路径，让落地页拥有电影级的「穿越感」。三种摄像机飞行风格由用户在一开始选定，Skill 全程不再更改：

• Fly through the world（标志性微缩景观风格）：摄像机俯冲进场景、拉起跃出、跳接到下一个微型世界场景
• One continuous walkthrough（无缝写实漫游）：摄像机直线穿越每个场景，不拉远、不切换，适合追求沉浸感的产品演示
• Locked isometric glide（锁定等轴测滑行）：全程固定视角，世界在镜头下平移滑动，效果最稳定、成本最低

设计原则：一次性选风格、全程不重决策、确保场景间帧匹配精确。

认可度

截至 2026-08-16，lets-scroll 的 GitHub 仓库（AIwithhassan/lets-scroll）已获得 11 Stars、2 Forks，仓库创建于 2026-08-15——即上线约 1 天就积累了这样的热度，属于新晋爆款。社媒讨论主要出现在 Twitter/X 和 LinkedIn 的 AI 设计圈层，被多位设计师和 AI 开发者转发推荐。

链接

GitHub：https://github.com/AIwithhassan/lets-scroll

原作者

GitHub 用户 AIwithhassan（具体全名未在仓库公开披露），专注 AI 驱动的视觉创意工具开发，lets-scroll 是其目前最热门的一个项目。

介绍

传统的落地页要么是静态图拼大图，要么是视频 BG，需要用户被动接受画面。lets-scroll 打破了这一范式：它让用户主动通过滚动控制摄像机路径，每一次滚动都在「驾驶」一段预生成的视觉旅程。

从技术实现来看，lets-scroll 依赖两个 AI 图像/视频后端：Monid CLI（默认，Seedance 2.0，支持首尾帧条件化锁定以保证场景衔接）和 Higgsfield CLI（备选，用于场景图生成和 Kling 3.0 回退）。Skill 会自动检测两个后端的存在性，按优先级调度，并输出每段 CLIP 的 HANDOFF.md 规格表——包含提示词文件、条件帧和输出文件名，验证返回帧数、尺寸、纵横比后才进入拼接环节。

ffmpeg 负责最终的帧提取与编码，Python 3 + Pillow 处理移动端竖版画布和可选的透明场景叠加。最终交付物是一个单文件 HTML，无需任何外部依赖，浏览器打开即可演示。

特点

• 三种摄像机风格：Diorama / Walkthrough / Isometric，覆盖从高感官冲击到稳定低成本的完整场景
• 首尾帧锁定：Monid CLI 的帧锁定功能确保相邻场景之间无接缝，Skill 会自动验证
• 多后端自动降级：Monid 为主、Higgsfield 为备，Codex 内置 image_gen 为第三后备，按可用性自动切换
• 全流程可追溯：每段生成都输出 HANDOFF.md，包含提示词、 Conditioning 帧、输出路径和状态列，方便人工复审
• 纯前端交付：最终输出是单个 HTML 文件，部署极简，用户无需任何服务器或 CDN

使用方法

安装：将 Skill 目录复制到 Agent 的 skills 路径即可：

# Claude Code
cp -R lets-scroll/skills/lets-scroll ~/.claude/skills/

# Codex
cp -R lets-scroll/skills/lets-scroll ~/.codex/skills/

调用：直接用自然语言描述需求，或显式调用 /lets-scroll（Codex 中为 $lets-scroll）。

必需依赖：

• Monid CLI（默认后端）：npm install -g monid-cli，需 API Key 和账户余额
• Higgsfield CLI（备选后端）：higgsfield auth login 并确保有 Credits
• ffmpeg / ffprobe：帧提取与编码
• Python 3 + Pillow：处理移动端画布和透明场景

可选：Codex CLI 存在时可用其内置 image_gen，费用走 ChatGPT 订阅而非 Higgsfield Credits。

使用场景与人群

适用场景：品牌官网首页、产品功能演示页、概念验证展示、技术博客封面页、创意Agency交付物。

目标用户：UX/UI 设计师、前端开发工程师、创意Agency、AI 工具爱好者、有高感官冲击落地页需求的产品团队。

不适合需要纯文字内容、SEO 优先、或预算极其有限的场景（6 秒场景 1080p 链 ≈ $27）。

输入与输出案例

案例 1：AI SaaS 产品演示

Input（用户描述）：

帮我做一个关于 AI 代码审查工具的滚动穿越落地页，风格选 Fly through the world，展示 4 个功能模块。

Output：
一个单文件 HTML，摄像机从第一个功能模块（代码扫描）的微缩景观俯冲进入，拉起跃出后跳入第二个模块（自动修复建议），依次完成全部 4 个场景的连续穿越。用户滚动鼠标控制摄像机前进/后退，画面无任何硬切。

案例 2：消费品牌首页

Input（用户描述）：

用 Locked isometric glide 风格做一个咖啡品牌的落地页，3 个场景：咖啡豆产地、烘焙过程、手冲演示。

Output：
摄像机固定俯视角，世界在屏幕下滑动经过三个场景。每个场景由 Higgsfield 生成写实图，ffmpeg 拼接为连续视频流，交付一个 HTML 文件，可直接嵌入品牌官网。

GitHub: https://github.com/AIwithhassan/lets-scroll