动效与动画
动画库、页面过渡、微交互、滚动动效与着色器视觉效果。
场景 1技能 12设计 0合集 —
正在加载结果
| 类型 | 名称 | 使用场景 | 标签 | 操作 |
|---|---|---|---|---|
| 技能 | 手绘风图表工具包 | 为应用添加手绘/素描风格图表与白板视觉——流程图、线框图、笔记与有人情味的协作画布。 | ReactDiagramSVGCanvasWhiteboard | |
| 技能 | Lottie/Rive 动画播放器 | 在 Web 应用中嵌入 Lottie(After Effects)或 Rive(矢量)动画——加载态、插画、启动屏与可交互动画图标。 | ReactLottieRive | |
| 技能 | GSAP 滚动动效工具包 | 构建滚动驱动体验:随滚动 scrub 的英雄区、固定叙事面板、视差效果与滚动触发出场动画。 | React动画ScrollTrigger | |
| 技能 | 页面过渡编排器 | 为 Next.js 或 React 应用添加电影感页面过渡——淡入/滑动式路由切换、共享元素形变和导航顶部进度条。 | ReactNext.js动画 | |
| 技能 | Framer Motion 动效组件库 | 用 Framer Motion 构建 React 界面:手势驱动 UI、弹性物理动画、布局过渡,以及路由或条件内容的进出场动画。 | ReactFramer Motion动画 | |
| 技能 | GSAP React 动效组件 | 在 React 应用中添加 GSAP 动画,需要生命周期管理(挂载/卸载清理)和可直接使用的动画组件。 | ReactGSAP动画 | |
| 技能 | 动效设计系统 | 在跨产品建立一致的动效——定义时长、缓动曲线与编排规则,让动画看起来属于同一套设计体系。 | ReactDesign System动画 | |
| 技能 | WebGL 着色器视觉效果 | 为 Web 应用添加高冲击力 WebGL 视觉:液体/流体动画背景、粒子系统、扭曲特效与生成艺术表面。 | ReactWebGLShader | |
| 技能 | 微交互组件库 | 为任何界面做收尾:悬停/按压状态、开关弹性、点赞动画、按钮波纹等让产品活起来的小交互。 | React动画Micro-interaction | |
| 技能 | 滚动叙事动效 | 构建长页面滚动叙事体验:产品发布页讲故事、说明性叙事、数据故事与「Apple 风格」滚动页。 | React动画Scroll | |
| 技能 | 通知动效系统 | 添加精致的 toast 与通知体验:成功/错误提示、推送式通知、成就横幅,以及带动效的优先级堆叠提醒。 | ReactToast通知 | |
| 技能 | GSAP 动画工具包 | 构建需要高性能动画的界面——英雄区出场、悬停效果、进度指示器,或需要精确时序控制的 UI 微动画。 | React动画GSAP |