审界面动画用这Skill核节奏层次

用迪士尼12原则检查动画代码质量。

12-principles-of-animation 是审查网页动画代码的 Skill。它从时长、缓动、形变与视觉层次找问题,输出对应文件和行号,方便逐处复核。

原文把300毫秒、逐项延迟50毫秒和按压缩放等设为检查规则。这是该 Skill 的网页改编标准,不能直接说成所有产品或迪士尼原始原则的统一硬性要求。

审查还要看动作是否帮助理解、是否拖慢操作,结合真实交互与减少动效设置。弹窗的层次不是写一个大 z-index 就必然正确,还受所在堆叠上下文影响。

适合把“感觉不顺”落实到可查的代码线索。本文未审真实界面,报出的规则违规仍需核目的与使用条件;规则计数少了,不自动证明交互更清楚或可访问性已达标。

分类:设计创作

来源仓库:raphaelsalaja/skill

适合用来做什么

  • 请根据迪士尼的12条动画原则审核我的网页动画代码。
  • 分析这个动画效果并指出不符合动画原则的地方。

安装 12-principles-of-animation

npx skills add https://www.iskills.cc/skills/raphaelsalaja/skill/12-principles-of-animation/SKILL.md

在本机终端执行安装命令。安装前请阅读原始说明,确认所需工具、账号和权限。

查看安装步骤 · 查看常见问题

查看 12-principles-of-animation 的用途与原始说明

浏览全部 Skill 指南