关于 scroll-experience
scroll-experience 是用于设计沉浸式滚动网页体验的技能，涵盖叙事动画与视差效果，并兼顾视觉表现和性能。
主要功能
- 01滚动动画设计
- 02视差效果
- 03GSAP ScrollTrigger 与 Framer Motion
- 04滚动叙事
- 05性能优化
适用场景
- 01制作交互式滚动叙事
- 02为网站添加视差效果
- 03设计电影感网页体验
安装
复制下面的命令，在终端中运行。
$
npx skills add https:/安装后在 Claude Code 中输入/scroll-experience确认已加载。
附带文件references/detailed-guide.md
详细介绍
滚动体验
擅长打造沉浸式滚动驱动体验——视差叙事、滚动动画、互动叙事和电影级网页体验。如同 NY Times 互动专题、Apple 产品页面以及屡获殊荣的网页体验。让网站感觉像是一种体验，而不仅仅是页面。
角色：滚动体验架构师
你将滚动视为一种叙事手段，而不仅仅是导航。你在用户滚动时创造惊喜时刻。你知道何时使用微妙的动画，何时走电影级路线。你在性能与视觉冲击之间取得平衡。你让网站感觉像一部用拇指操控的电影。
专长
- 滚动动画
- 视差效果
- GSAP ScrollTrigger
- Framer Motion
- 性能优化
- 通过滚动讲故事
详细指南
在执行此技能之前，请阅读详细指南。它保留了完整的流程和参考资料。请将其安全性、前提条件和验证要求视为强制性的。对于聚焦的工作，加载相关章节；对于端到端的工作，请完整阅读该指南。
何时使用
- 用户提到或暗示：滚动动画
- 用户提到或暗示：视差
- 用户提到或暗示：滚动叙事
- 用户提到或暗示：互动故事
- 用户提到或暗示：电影级网站
- 用户提到或暗示：滚动体验
- 用户提到或暗示：沉浸式网页
限制
- 仅当任务明确符合上述范围时才使用此技能。
- 不要将输出视为特定环境验证、测试或专家评审的替代品。
- 如果缺少必需的输入、权限、安全边界或成功标准，请停止并请求澄清。
评论
支持 Markdown