尧图网站建设 
impeccable 动效设计参考精读用 animate 为界面添加有目的、可解释、有节制的动画【免费下载链接】impeccableThe design language that makes your AI harness better at design.项目地址: https://gitcode.com/GitHub_Trending/im/impeccable本文围绕 impeccable 技能参考文档 animate.md 展开。该文档定义了impeccable animate命令的核心方法论motion 只用来解释状态、关系与层级或打造一个界面挣来的作者时刻无目的的装饰即动画债务。本文继承原文档的全部决策规则并结合仓库中的 SKILL.md、iOS/Android 原生参考、skill 参考契约测试与反模式 fixture逐条给出落地依据与可执行清单。本文导读在 AI 设计工作流里加动画是最容易被误用的增强项要么一堆淡入上浮与滚动揭示让页面变吵要么为动而动造成布局抖动与性能浪费。impeccable 将动效视为一种可解释的设计语言而不是特效堆叠。阅读本文后你将掌握如何判断一个界面是否需要动效Find the job、如何在写代码前立下动效论点Motion thesis、如何按语义挑选动画材质、如何套用时长/缓动参考表、如何把动画实现约束在 CSS/WAAPI/View Transitions 等运行时能力内以及如何为每条动画补上prefers-reduced-motion的降级路径并完成交付前验证。一、animate 在 impeccable 命令体系中的位置animate是 impeccable 命令表Commands中的一个Enhance增强类命令。在 SKILL.md 的 Commands 表格中其定义为命令类别说明参考文档animate [target]Enhance添加有目的的动画与动效Add purposeful animations and motionreference/animate.md调用形式上animate 支持带目标参数例如/impeccable animate 页面或组件。它是 routing 路由表中的一个显式命令分支——当用户请求被判定为明确的动效增强请求时应加载本文档作为 playbook。值得说明的是这套 skill 被以多份镜像方式分发到各类 Agent 工作区.agent、.claude、.cursor、.rovodev、plugin/skills、skill等目录均可看到同构的reference/animate.md以保证不同 Agent harness 加载到完全一致的设计纪律。仓库中有一份“权威源”被测试直接引用测试 tests/skill-reference.test.mjs 从skill/reference/animate.md解析文本并校验其中的无障碍契约详见本文第八节因此各镜像目录的内容需要始终与源保持一致。本文档的适用边界先写清楚它面向 Web 端动效工具链CSS / WAAPI / View Transitions 等原生平台iOS / Android另有专属指引。二、动效设计的第一性原则装饰即债务animate.md 开篇即给出核心判断句Use motion to explain state, relationship, and hierarchy, or to create one authored moment the surface has earned. Decoration without purpose is animation debt.翻译过来即动效只用于解释状态、关系与层级或创造界面凭自身品质赢得的唯一作者时刻无目的的装饰就是动画债务animation debt。这条原则在仓库里并非空话而是有“反模式检测器”在代码层面落地。在 tests/fixtures/antipatterns/pulsing-dot.html 中可以看到一组判别样本无限循环的“呼吸状态点”animation: pulse 2.4s ease-out infinite、无限涟漪ripple ... infinite都被标注为 FLAG应被检测拦截因为它们是无目的、不断吸引注意力的装饰性循环而同样是圆形小元素spinner旋转加载图标、有限次数的 attention pulse、方形徽标等则被标注为 PASS。这与文档中“Do not animate a static area merely because it exists”不要因为某个静态区域存在就去动它以及“任何非必要循环在离开视口或被隐藏时必须停止”的要求一一对应。所以animate 命令执行前要先回答这段动效解释了某个东西吗如果没有删掉它。三、按访问模式Visitor mode分流同 impeccable 其它参考文档一样animate.md 要求先确定页面所处模式因为模式决定了动效能否“扛起声音”Persuade说服 Experience体验模式动效可以承载品牌语气motion may carry the voice。此时宁可用一个经过排练的焦点序列one rehearsed focal sequence也不要到处做区块 reveal——前者是精心编排后者只是模板化噪音。Operate操作 Read阅读模式动效服务于反馈、状态与连续性feedback, state, continuity。常规过渡必须快绝不能让用户等着看完整段页面加载 choreography。Nativeios/android/adaptive模式不要套用下面的 Web 工具链应遵循 ios.md 或 android.md 中的 Motion 章节包括平台自带的 Reduce Motion 行为。以 iOS 为例原生参考 ios.md 的 Motion 章节明确了两条规则系统级转场遵循平台惯例push 推入、sheet 升起、dismiss 反转入场同时“Honor Reduce Motion”——用 crossfade 替代视差与大段 slide。这也解释了 animate.md 为什么要单独强调Web 上要自己写prefers-reduced-motion原生上则要让位给系统开关。四、Find the job先找动效的“任务”在动手前先检查现有的 motion 语言、交互状态、目标设备与性能预算然后只在这些地方考虑加入动效acknowledge an action——回应一次操作比如按钮按压、开关切换make a state change or spatial relationship legible——让状态变化或空间关系变得可读preserve continuity through navigation or layout change——在导航或布局变化中保持连续性direct attention at a meaningful moment——在有意义的时刻引导注意力embody the selected visual world——体现所选择的视觉世界/材质语言。只有当下结论需要的关键约束无法从现有信息推断时才允许提问Ask only when a material constraint cannot be inferred。禁止仅仅因为某处是静态的就“顺手”补一段动画。五、Set the motion thesis写下一段动效论点实现之前先写一个简短计划motion thesis文档给出了四个必须回答的字段Focal moment焦点时刻如果存在哪一段序列或交互值得被当作作者作品精心编排Continuity连续性哪些状态、布局或导航变化需要被“解释”清楚Feedback反馈哪些控件与操作结果需要被“确认”回应Budget预算哪些效果可能昂贵、它们多久运行一次文档给出一条硬性纪律焦点时刻必须来自本产品与本界面的概念must come from this product and surface concept。一个通用的 fade-and-rise、hover 抬升、parallax 层或滚动揭示都不能算作 thesis——因为它们跟你是谁无关套到任何网站上都能成立。六、Choose material by meaning按“要传达的意义”选择动画材质transform与opacity是可靠的地基但不是整个调色板。正确的选择方式是先确定这段过渡要传达什么语义再决定动哪些属性语义目标建议的材质/手法连续性、关系Continuity and relationshipshared-element motion、FLIP 式 transform、View Transitions、有意的空间位移聚焦、深度Focus and depth有边界的 blur、filter、backdrop、光照或阴影变化揭示、构图Reveal and compositionmask、clip-path、裁剪、受控遮挡材质、能量Material and energy在视觉世界与运行时支持的前提下使用颜色、渐变位置、纹理、形变或 shader 效果状态、反馈State and feedback“让因果不言自明的最小变化”——反馈动效务必克制文档同时给出两条节流纪律不要为了奇观堆叠技术Do not stack techniques for spectacle。一个足够强的材质想法贯穿焦点序列并覆盖安静的支持性状态通常就足够了。Sibling stagger同层错峰仅在列表以“列表”身份出现时使用。必须给错峰延迟总量封顶Cap the total delay并且永远不要把每个滚动区块都重新解释成一个 stagger 列表——这是最常见也最廉价的滥用。七、Timing and easing用时长表达距离与后果动画时长不是拍脑袋定的文档给出了一张可直接套用的参考表时长范围典型用途100–150 ms即时反馈immediate feedback150–300 ms常规状态变化routine state change300–500 ms布局、浮层或视图过渡layout, overlay, view transition500–800 ms精心编排的焦点入场deliberately authored focal entrance配套规则退场快于入场Exit faster than entrance自信的到达confident arrivals使用自然减速曲线例如cubic-bezier(0.16, 1, 0.3, 1)不要凭反射式习惯用 bounce / elastic 曲线反馈时间过长会被用户感知为延迟Long feedback feels like latency。八、Implement to the runtime把实现约束在运行时能力内文档按“现有技术栈能干净表达的就别加依赖”的原则给出实现路线CSS transitions 与 keyframes用于声明式状态与有边界的序列bounded sequencesWeb Animations API 或项目已有的动效库用于可中断interruption、序列编排sequencing与动态取值dynamic valuesView Transitions / shared-element 技术当“跨状态的连续性”正是目的时使用scroll-driven motion仅当滚动关系本身承载意义时才使用且必须有稳健降级不要为一个现有栈能干净表达的效果新增依赖。性能纪律原文逐条保留默认状态保持内容可见脚本失败时页面也不能被隐藏避免随手动画化布局驱动属性width、height、top、left、margin应改用 FLIP、transform 或 grid 技术将 blur、filter、shadow、canvas、shader 工作限制在隔离区域内Bound ... to isolated regionswill-change只在已知动画期间使用Applywill-changeonly during known animation在目标视口与目标设备上实测而不是默认“用了 transform 就一定快”。值得注意impeccable 的检测器同样关心这类“廉价特效”。仓库里的反模式 fixture如 pulsing-dot.html 中通过media (prefers-reduced-motion: no-preference)包裹、再用reduce区块重置的 case被标记为仍需拦截的错误场景提醒动画作者不要用小技巧规避检测。示意按参考纪律书写的一段动效下面是一个体现“transform opacity、可中断、含 reduced-motion 降级、默认态可见”的示意写法非仓库现成代码仅为该参考指引的落地示例.card { transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1), opacity 180ms ease-out; } .card:hover { transform: translateY(-2px); } .toast-enter { animation: rise-in 300ms cubic-bezier(0.16, 1, 0.3, 1); } keyframes rise-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } } media (prefers-reduced-motion: reduce) { .toast-enter { animation: none; } /* 保留 opacity/color/state 过渡去掉位移 */ }九、Accessibility and control每条 Web 动画都要有一条 reduced-motion 路径尊重自动播放与声音偏好autoplay and sound preferences任何非必要循环在离开屏幕或被隐藏时必须停止每条 Web 动画都需要prefers-reduced-motion路径且必须给出有意的替代方案intentional alternative降级时移除或减少空间位移但要保留仍承载意义的 opacity、颜色与状态过渡Reduced motion 意味着更少、更温和的动画而不是禁用所有动效能确认操作结果的反馈动画应当保持清晰可辨legible。仓库层面的契约保护这条原则不是软建议而是被写进了参考文档的**作者契约authoring contract**并被测试强制校验。测试 tests/skill-reference.test.mjs 名为keeps reduced-motion guidance on the animation build path它解析 animate.md 的## Accessibility and control与## Verify两节并断言其必须包含prefers-reduced-motionintentional alternative有意的替代方案not disabling all motion不是禁用全部动效Verify 一节必须出现reduced-motion字样。也就是说如果任何一份参考文档副本丢失了 reduced-motion 指引测试会直接失败——这是文档纪律被工程化约束的典型体现。十、Verify交付前的动效自检清单文档在## Verify一节给出七条验收标准逐条如下焦点动效是特定于所选视觉世界与本界面的不是通用模板每一条支撑性动画都在解释反馈、状态或关系中断interruption与重复使用的行为正确桌面、移动端与键盘路径都保持可用prefers-reduced-motion路径减少了位移但没有抹掉有意义的反馈或状态变化昂贵效果在目标设备上保持流畅移除这段动画会失去意义或作者特质而不只是失去装饰——这是区分“好动效”与“动画债务”的终极判据。十一、收尾交给 polish 做最后一轮当动效证明了自己“配得上这个位置”之后文档要求把它交给后续流程收尾When motion earns its place, hand off to/impeccable polishfor the final pass.这条交接不是形式主义。在 polish.md 中动效一致性是 final quality pass 的显式检查项之一它要求保持动效连贯coherent、可中断interruptible与高性能performant且不要为了“让 polish 看起来有工作”而添加动画Do not add animation merely to make polish visible。这与 animate.md 的“装饰即债务”哲学完全闭环animate 负责给出有目的的动效与 reduced-motion 路径polish 负责在最后一遍把多余、抖动或越权的动画清出去。十二、关键路径速查命令入口与命令表.rovodev/skills/impeccable/SKILL.mdanimate [target]→ Enhance本文档权威源animate.md各 Agent 目录下的镜像副本以及测试引用的skill/reference/animate.md原生动效指引ios.md含 Motion 章节与 Reduce Motion 规则、android.md收尾校验polish.md动效连贯性 / 可中断 / 高性能文档契约测试tests/skill-reference.test.mjsreduced-motion 指引的强制校验无意义装饰动效的判别样例tests/fixtures/antipatterns/pulsing-dot.html【免费下载链接】impeccableThe design language that makes your AI harness better at design.项目地址: https://gitcode.com/GitHub_Trending/im/impeccable创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 impeccable 动效设计参考精读：用 animate 为界面添加有目的、可解释、有节制的动画
impeccable 动效设计参考精读用 animate 为界面添加有目的、可解释、有节制的动画【免费下载链接】impeccableThe design language that makes your AI harness better at design.项目地址: https://gitcode.com/GitHub_Trending/im/impeccable本文围绕 impeccable 技能参考文档 animate.md 展开。该文档定义了impeccable animate命令的核心方法论motion 只用来解释状态、关系与层级或打造一个界面挣来的作者时刻无目的的装饰即动画债务。本文继承原文档的全部决策规则并结合仓库中的 SKILL.md、iOS/Android 原生参考、skill 参考契约测试与反模式 fixture逐条给出落地依据与可执行清单。本文导读在 AI 设计工作流里加动画是最容易被误用的增强项要么一堆淡入上浮与滚动揭示让页面变吵要么为动而动造成布局抖动与性能浪费。impeccable 将动效视为一种可解释的设计语言而不是特效堆叠。阅读本文后你将掌握如何判断一个界面是否需要动效Find the job、如何在写代码前立下动效论点Motion thesis、如何按语义挑选动画材质、如何套用时长/缓动参考表、如何把动画实现约束在 CSS/WAAPI/View Transitions 等运行时能力内以及如何为每条动画补上prefers-reduced-motion的降级路径并完成交付前验证。一、animate 在 impeccable 命令体系中的位置animate是 impeccable 命令表Commands中的一个Enhance增强类命令。在 SKILL.md 的 Commands 表格中其定义为命令类别说明参考文档animate [target]Enhance添加有目的的动画与动效Add purposeful animations and motionreference/animate.md调用形式上animate 支持带目标参数例如/impeccable animate 页面或组件。它是 routing 路由表中的一个显式命令分支——当用户请求被判定为明确的动效增强请求时应加载本文档作为 playbook。值得说明的是这套 skill 被以多份镜像方式分发到各类 Agent 工作区.agent、.claude、.cursor、.rovodev、plugin/skills、skill等目录均可看到同构的reference/animate.md以保证不同 Agent harness 加载到完全一致的设计纪律。仓库中有一份“权威源”被测试直接引用测试 tests/skill-reference.test.mjs 从skill/reference/animate.md解析文本并校验其中的无障碍契约详见本文第八节因此各镜像目录的内容需要始终与源保持一致。本文档的适用边界先写清楚它面向 Web 端动效工具链CSS / WAAPI / View Transitions 等原生平台iOS / Android另有专属指引。二、动效设计的第一性原则装饰即债务animate.md 开篇即给出核心判断句Use motion to explain state, relationship, and hierarchy, or to create one authored moment the surface has earned. Decoration without purpose is animation debt.翻译过来即动效只用于解释状态、关系与层级或创造界面凭自身品质赢得的唯一作者时刻无目的的装饰就是动画债务animation debt。这条原则在仓库里并非空话而是有“反模式检测器”在代码层面落地。在 tests/fixtures/antipatterns/pulsing-dot.html 中可以看到一组判别样本无限循环的“呼吸状态点”animation: pulse 2.4s ease-out infinite、无限涟漪ripple ... infinite都被标注为 FLAG应被检测拦截因为它们是无目的、不断吸引注意力的装饰性循环而同样是圆形小元素spinner旋转加载图标、有限次数的 attention pulse、方形徽标等则被标注为 PASS。这与文档中“Do not animate a static area merely because it exists”不要因为某个静态区域存在就去动它以及“任何非必要循环在离开视口或被隐藏时必须停止”的要求一一对应。所以animate 命令执行前要先回答这段动效解释了某个东西吗如果没有删掉它。三、按访问模式Visitor mode分流同 impeccable 其它参考文档一样animate.md 要求先确定页面所处模式因为模式决定了动效能否“扛起声音”Persuade说服 Experience体验模式动效可以承载品牌语气motion may carry the voice。此时宁可用一个经过排练的焦点序列one rehearsed focal sequence也不要到处做区块 reveal——前者是精心编排后者只是模板化噪音。Operate操作 Read阅读模式动效服务于反馈、状态与连续性feedback, state, continuity。常规过渡必须快绝不能让用户等着看完整段页面加载 choreography。Nativeios/android/adaptive模式不要套用下面的 Web 工具链应遵循 ios.md 或 android.md 中的 Motion 章节包括平台自带的 Reduce Motion 行为。以 iOS 为例原生参考 ios.md 的 Motion 章节明确了两条规则系统级转场遵循平台惯例push 推入、sheet 升起、dismiss 反转入场同时“Honor Reduce Motion”——用 crossfade 替代视差与大段 slide。这也解释了 animate.md 为什么要单独强调Web 上要自己写prefers-reduced-motion原生上则要让位给系统开关。四、Find the job先找动效的“任务”在动手前先检查现有的 motion 语言、交互状态、目标设备与性能预算然后只在这些地方考虑加入动效acknowledge an action——回应一次操作比如按钮按压、开关切换make a state change or spatial relationship legible——让状态变化或空间关系变得可读preserve continuity through navigation or layout change——在导航或布局变化中保持连续性direct attention at a meaningful moment——在有意义的时刻引导注意力embody the selected visual world——体现所选择的视觉世界/材质语言。只有当下结论需要的关键约束无法从现有信息推断时才允许提问Ask only when a material constraint cannot be inferred。禁止仅仅因为某处是静态的就“顺手”补一段动画。五、Set the motion thesis写下一段动效论点实现之前先写一个简短计划motion thesis文档给出了四个必须回答的字段Focal moment焦点时刻如果存在哪一段序列或交互值得被当作作者作品精心编排Continuity连续性哪些状态、布局或导航变化需要被“解释”清楚Feedback反馈哪些控件与操作结果需要被“确认”回应Budget预算哪些效果可能昂贵、它们多久运行一次文档给出一条硬性纪律焦点时刻必须来自本产品与本界面的概念must come from this product and surface concept。一个通用的 fade-and-rise、hover 抬升、parallax 层或滚动揭示都不能算作 thesis——因为它们跟你是谁无关套到任何网站上都能成立。六、Choose material by meaning按“要传达的意义”选择动画材质transform与opacity是可靠的地基但不是整个调色板。正确的选择方式是先确定这段过渡要传达什么语义再决定动哪些属性语义目标建议的材质/手法连续性、关系Continuity and relationshipshared-element motion、FLIP 式 transform、View Transitions、有意的空间位移聚焦、深度Focus and depth有边界的 blur、filter、backdrop、光照或阴影变化揭示、构图Reveal and compositionmask、clip-path、裁剪、受控遮挡材质、能量Material and energy在视觉世界与运行时支持的前提下使用颜色、渐变位置、纹理、形变或 shader 效果状态、反馈State and feedback“让因果不言自明的最小变化”——反馈动效务必克制文档同时给出两条节流纪律不要为了奇观堆叠技术Do not stack techniques for spectacle。一个足够强的材质想法贯穿焦点序列并覆盖安静的支持性状态通常就足够了。Sibling stagger同层错峰仅在列表以“列表”身份出现时使用。必须给错峰延迟总量封顶Cap the total delay并且永远不要把每个滚动区块都重新解释成一个 stagger 列表——这是最常见也最廉价的滥用。七、Timing and easing用时长表达距离与后果动画时长不是拍脑袋定的文档给出了一张可直接套用的参考表时长范围典型用途100–150 ms即时反馈immediate feedback150–300 ms常规状态变化routine state change300–500 ms布局、浮层或视图过渡layout, overlay, view transition500–800 ms精心编排的焦点入场deliberately authored focal entrance配套规则退场快于入场Exit faster than entrance自信的到达confident arrivals使用自然减速曲线例如cubic-bezier(0.16, 1, 0.3, 1)不要凭反射式习惯用 bounce / elastic 曲线反馈时间过长会被用户感知为延迟Long feedback feels like latency。八、Implement to the runtime把实现约束在运行时能力内文档按“现有技术栈能干净表达的就别加依赖”的原则给出实现路线CSS transitions 与 keyframes用于声明式状态与有边界的序列bounded sequencesWeb Animations API 或项目已有的动效库用于可中断interruption、序列编排sequencing与动态取值dynamic valuesView Transitions / shared-element 技术当“跨状态的连续性”正是目的时使用scroll-driven motion仅当滚动关系本身承载意义时才使用且必须有稳健降级不要为一个现有栈能干净表达的效果新增依赖。性能纪律原文逐条保留默认状态保持内容可见脚本失败时页面也不能被隐藏避免随手动画化布局驱动属性width、height、top、left、margin应改用 FLIP、transform 或 grid 技术将 blur、filter、shadow、canvas、shader 工作限制在隔离区域内Bound ... to isolated regionswill-change只在已知动画期间使用Applywill-changeonly during known animation在目标视口与目标设备上实测而不是默认“用了 transform 就一定快”。值得注意impeccable 的检测器同样关心这类“廉价特效”。仓库里的反模式 fixture如 pulsing-dot.html 中通过media (prefers-reduced-motion: no-preference)包裹、再用reduce区块重置的 case被标记为仍需拦截的错误场景提醒动画作者不要用小技巧规避检测。示意按参考纪律书写的一段动效下面是一个体现“transform opacity、可中断、含 reduced-motion 降级、默认态可见”的示意写法非仓库现成代码仅为该参考指引的落地示例.card { transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1), opacity 180ms ease-out; } .card:hover { transform: translateY(-2px); } .toast-enter { animation: rise-in 300ms cubic-bezier(0.16, 1, 0.3, 1); } keyframes rise-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } } media (prefers-reduced-motion: reduce) { .toast-enter { animation: none; } /* 保留 opacity/color/state 过渡去掉位移 */ }九、Accessibility and control每条 Web 动画都要有一条 reduced-motion 路径尊重自动播放与声音偏好autoplay and sound preferences任何非必要循环在离开屏幕或被隐藏时必须停止每条 Web 动画都需要prefers-reduced-motion路径且必须给出有意的替代方案intentional alternative降级时移除或减少空间位移但要保留仍承载意义的 opacity、颜色与状态过渡Reduced motion 意味着更少、更温和的动画而不是禁用所有动效能确认操作结果的反馈动画应当保持清晰可辨legible。仓库层面的契约保护这条原则不是软建议而是被写进了参考文档的**作者契约authoring contract**并被测试强制校验。测试 tests/skill-reference.test.mjs 名为keeps reduced-motion guidance on the animation build path它解析 animate.md 的## Accessibility and control与## Verify两节并断言其必须包含prefers-reduced-motionintentional alternative有意的替代方案not disabling all motion不是禁用全部动效Verify 一节必须出现reduced-motion字样。也就是说如果任何一份参考文档副本丢失了 reduced-motion 指引测试会直接失败——这是文档纪律被工程化约束的典型体现。十、Verify交付前的动效自检清单文档在## Verify一节给出七条验收标准逐条如下焦点动效是特定于所选视觉世界与本界面的不是通用模板每一条支撑性动画都在解释反馈、状态或关系中断interruption与重复使用的行为正确桌面、移动端与键盘路径都保持可用prefers-reduced-motion路径减少了位移但没有抹掉有意义的反馈或状态变化昂贵效果在目标设备上保持流畅移除这段动画会失去意义或作者特质而不只是失去装饰——这是区分“好动效”与“动画债务”的终极判据。十一、收尾交给 polish 做最后一轮当动效证明了自己“配得上这个位置”之后文档要求把它交给后续流程收尾When motion earns its place, hand off to/impeccable polishfor the final pass.这条交接不是形式主义。在 polish.md 中动效一致性是 final quality pass 的显式检查项之一它要求保持动效连贯coherent、可中断interruptible与高性能performant且不要为了“让 polish 看起来有工作”而添加动画Do not add animation merely to make polish visible。这与 animate.md 的“装饰即债务”哲学完全闭环animate 负责给出有目的的动效与 reduced-motion 路径polish 负责在最后一遍把多余、抖动或越权的动画清出去。十二、关键路径速查命令入口与命令表.rovodev/skills/impeccable/SKILL.mdanimate [target]→ Enhance本文档权威源animate.md各 Agent 目录下的镜像副本以及测试引用的skill/reference/animate.md原生动效指引ios.md含 Motion 章节与 Reduce Motion 规则、android.md收尾校验polish.md动效连贯性 / 可中断 / 高性能文档契约测试tests/skill-reference.test.mjsreduced-motion 指引的强制校验无意义装饰动效的判别样例tests/fixtures/antipatterns/pulsing-dot.html【免费下载链接】impeccableThe design language that makes your AI harness better at design.项目地址: https://gitcode.com/GitHub_Trending/im/impeccable创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考