scroll-world
为任意品牌一键生成沉浸式滚动飞行视差落地页的AI技能。
安装使用
复制下面这段提示词发给你的 AI(Claude / Cursor / TRAE / Codex / WorkBuddy 等),它会自动帮你完成安装:
帮我安装这个 AI Skill:scroll-world。 它的用途是:为任意品牌一键生成沉浸式滚动飞行视差落地页的AI技能。 完整的 Skill 内容见:https://321skill.com/skills/scroll-world/raw/index.md 请读取该页面内容,如果是 SKILL.md 格式直接安装,如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接,AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
“为我的环保科技初创公司做一个展示我们智能回收解决方案的滚动飞行落地页,需要三个场景:城市垃圾问题、我们的智能回收箱、回收后的再生材料应用。” 它会首先与你确认品牌色调、视觉风格和预算,然后自动调用AI生图与视频工具,生成连贯的从城市俯瞰飞入回收箱内部,再穿越到再生材料车间的动画序列,最后打包好所有HTML、JS、视频资源文件供你直接部署。
介绍
Scroll-World 解决了品牌或项目在短时间内需要制作高质量、具有视觉冲击力和沉浸感落地页的难题。传统的视差滚动页面开发需要复杂的三维建模、动画设计和前端编码,耗时耗力。这个技能通过AI自动化流程,将创意快速转化为可交互的网页。
使用方式非常灵活。对于 Claude Code 用户,可以通过插件市场直接安装并输入指令调用。对于 Codex 等其他AI代理,可以通过 Vercel Skills CLI 一键添加。技能启动后,它会引导用户完成一系列配置,包括选择行业、定义品牌风格、规划场景顺序和预算,然后自动调用 Higgsfield 等AI生图与视频工具生成所有视觉素材,并打包成可部署的网页代码。
它非常适合市场营销人员、独立开发者、初创公司以及任何需要快速制作产品展示页、品牌故事页或活动宣传页的团队。即使没有设计和技术背景,也能通过对话式交互获得专业级的视觉作品。
与同类单纯生成静态图片或简单网页的AI技能相比,Scroll-World 的核心区别在于其专注于构建“连续无剪辑的镜头飞行”体验。它并非简单地将几张图片堆叠滚动,而是真正生成场景间的平滑过渡动画,并将滚动位置与视频播放时间轴精准绑定,实现了类似苹果官网那种高级的视差滚动效果,技术集成度更高。
核心特点
核心区别在于生成“真正连续飞行的视差动画”,而非静态图片滚动。它通过AI视频模型生成场景间无缝衔接的过渡动画,并将滚动位置直接映射为摄像机飞行时间,实现了高端商业网站级别的沉浸式视觉叙事。
注意事项
不适合需要高度定制化交互逻辑或复杂后端功能的动态网站项目。
常见问题
需要自己准备图片或视频吗?
不需要,技能会通过AI(Higgsfield或Codex)根据你的描述自动生成所有场景图片和飞行动画视频。
生成的网页能在手机上用吗?
可以,技能支持专门为移动端生成一套9:16比例的肖像模式动画链,确保在手机上的浏览体验。
给 AI 助手的安装指引
如果你的 AI 编程助手(Claude Code、Cursor、TRAE 等)能看到这个页面,把下面这段发给它即可自动完成安装:
请访问 https://321skill.com/skills/scroll-world/raw/index.md 读取 scroll-world 的原始 Skill 定义(Markdown 格式),按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址:/skills/scroll-world/raw/index.md(查看排版版本)