animation

审查某个功能，并通过有目的的动画、微交互和动效来增强它，从而提升可用性与用户体验。适用于当用户……

诊断并修复 UI 性能问题，涵盖加载速度、渲染、动画、图片和打包体积。当用户提到缓慢、卡顿、掉帧等情况时使用。

通过极具技术野心的实现（着色器、弹簧物理、滚动驱动动画、60fps 动画）将界面体验推向传统极限。使用……

教导 AI 像高端设计机构一样进行设计。定义能让网站尽显高级感的精确字体、间距、阴影、卡片结构和动画……

本技能编码了 Emil Kowalski 关于 UI 打磨、组件设计、动画决策以及让软件体验出色的隐形细节的理念。

使用 Expo Router 构建精美应用的完整指南。涵盖基础知识、样式、组件、导航、动画、设计模式以及原生标签页。

在 HyperFrames HTML 中创建视频合成、动画、标题卡、叠加层、字幕、旁白、音频响应视觉效果和场景过渡。适用于……

HyperFrames 的 GSAP 动画参考。涵盖 gsap.to()、from()、fromTo()、缓动、交错、默认值、时间轴（gsap.timeline()、位置参数，…

用于创建针对 Slack 优化的动态 GIF 的知识与实用工具。提供约束条件、验证工具和动画概念。当用户请求……时使用

使用 React 的 View Transition API（`<ViewTransition>` 组件、`addTransitionType` 以及 CSS view…）实现流畅、原生体验动画的指南

设计让界面感觉精致的工程原则。适用于构建 UI 组件、审查前端代码、实现动画、悬停效果……

适用于 HyperFrames 的 Lottie 和 dotLottie 适配器模式。在嵌入 lottie-web JSON 动画、.lottie 文件、@lottiefiles/dotlottie-web 播放器等时使用……

验证动画时长，强制排版比例，检查组件可访问性，并防止 Tailwind CSS 项目中的布局反模式。使用场景……

GSAP 官方 ScrollTrigger 技能 —— 滚动关联动画、固定、擦洗、触发器。在构建或推荐基于滚动的动画、视差效果……时使用。

用于时间线的官方 GSAP 技能 —— gsap.timeline()、位置参数、嵌套、播放控制。适用于编排动画序列、设计关键帧，或当……

面向 React 的官方 GSAP 技能 —— useGSAP hook、refs、gsap.context() 及清理机制。当用户希望在 React 或 Next.js 中实现动画，或询问有关 GSAP 与……的结合使用时使用。

适用于 Vue、Svelte 及其他非 React 框架的官方 GSAP 技能 —— 涵盖生命周期、选择器作用域、卸载时清理。当用户想要在……中实现动画时使用。

Three.js 动画 - 关键帧动画、骨骼动画、变形目标、动画混合。用于为对象制作动画、播放 GLTF 动画、创建…

HTML PPT Studio —— 创作专业的静态 HTML 演示文稿，支持多种风格、布局和动画，全部由模板驱动。当用户要求……时使用。

从零创建或通过转换 PowerPoint 文件，生成带有丰富动画的精美 HTML 演示文稿。当用户需要构建演示文稿、转换……时使用。