术语

动效图鉴

Motion

先看它动,再调出你要的样子,最后拿走跟 AI 说的那句话。

先看它动,再说出它

01Trigger什么时候开始
02Property动的是什么
03Duration动多久
04Easing怎么动
每个动效都由四件事决定:什么时候开始、动什么、动多久、怎么动。说清这四件事,AI 就能做出你要的样子。

换个角度想

动效图鉴像给舞蹈动作起名字:你不用会跳,但知道那个动作叫「转圈」还是「下腰」,再说一句「慢一点、收得轻一点」,编舞就能照着排。

先看它动,再说出它

  1. 触发

    什么时候开始

  2. 动什么

    动的是什么

  3. 多久

    动多久

  4. 手感

    怎么动

什么时候开始

什么时候会遇到它

  1. 提需求

    不再说「加点动画」,而是说清楚哪里、怎么动、多久。

  2. 改手感

    AI 做出来的动画「不太对」时,能说出是太慢了还是缓动不对。

  3. 拆解网站

    看到喜欢的官网,能拆出它用了哪几种动效。

想一想

你跟 AI 说「给卡片加点动画」,结果所有卡片同时闪了一下,很生硬。下一句该怎么补?

看答案

说清四件事:滚动到眼前时开始;从下方 24px 淡入上浮;时长 0.5 秒、先快后慢;几张卡片依次出现,每张间隔 80 毫秒。

最容易踩的坑

动效是调味料,不是主菜。一个页面里每块都在动,用户反而不知道该看哪里;还要记得照顾在系统里开了「减少动态效果」的人。

⌘K搜索知识库

最近收录

正在载入知识索引…