fade-in-fade-out动效可调节、可复制的 React 原子动效
slide-in动效scale-in动效reveal动效stagger动效keyframes参数工具duration参数工具translate参数工具3d-tilt-flip动效origin-aware-animation动效crossfade动效morph动效accordion-collapse动效direction-aware-transition动效scroll-reveal动效scroll-driven-animation参数工具parallax动效page-transition动效hover-effect动效press-tap-feedback动效hold-to-confirm动效drag-to-reorder动效swipe-to-dismiss动效shake-wiggle动效ripple动效easing参数工具spring参数工具loop参数工具marquee动效orbit动效idle-animation动效blur动效before-after-slider动效line-drawing动效text-morph动效skeleton-shimmer动效number-ticker动效typewriter动效指南评审路径3 步
- 1记录一帧
- 2定位长任务
- 3确认合成层
frame-rate设计指南compositing参数工具指南评审路径3 步
- 1确认目的
- 2判断频率
- 3检查空间来源
purposeful-animation设计指南anticipation参数工具指南评审路径3 步
- 1即时响应
- 2持续进度
- 3明确完成
perceived-performance设计指南指南评审路径3 步
- 1移除位移
- 2保留状态
- 3验证等价结果
reduced-motion设计指南