提示词
将 [应用位置] 替换为你要应用的位置,然后粘贴给 AI 智能体。提示词中包含动效名称,下次只说名称即可提出需求。
在[应用位置]添加“晃动”(Wobble)提示效果。
元素要带着倾斜左右摇晃,一开始幅度很大,每摆一次就变小,直到停稳。
触发时只播放一次,并避免相邻内容移位。相似的动效
A
Head Shake (摇头)
别称 Headshake, No Shake
元素带着轻微旋转左右摆动,就像摇头表示“不”。
适用场景
输入无效或操作被拒绝
在[应用位置]添加“摇头”(Head Shake)提示效果,也叫 headshake 或 no shake。
元素要像摇头表示“不”一样,带着轻微扭转快速左右转动,每次幅度都比上一次小,最后停稳。
每次触发时只播放一次(比如操作被拒绝时),并且不要让周围的布局跟着移动。A
元素以顶边为支点,像钟摆一样来回摆动,幅度逐渐减小。
适用场景
悬挂的招牌、通知图标
在[应用位置]添加“摇摆”(Swing)提示效果。
元素要像悬挂的招牌一样来回摆动,一开始摆幅很大,然后很快平息。
以顶边而不是中心为支点摆动,触发时只播放一次。A
元素放大后带着旋转左右晃动,再恢复原来大小,像在庆祝一样。
适用场景
成功状态、庆祝时刻
在[应用位置]添加“庆祝抖动”(Tada)提示效果。
元素要先微微缩小,再放大并快速倾斜着左右晃动,然后恢复正常大小,像一次小小的庆祝。
只播放一次(比如在操作成功后立即播放);如果用户开启了“减少动态效果”(prefers-reduced-motion),就跳过这个动画。A
Jello (果冻)
别称 Jelly
元素像晃动的果冻一样来回倾斜变形,幅度逐渐减小。
适用场景
俏皮地强调按钮或 Logo
在[应用位置]添加“果冻”(Jello)提示效果,也叫 jelly。
元素要像晃动的果冻一样来回倾斜变形:一开始幅度大,然后很快平息下来。
触发时只播放一次,并保持元素占据的空间不变,避免周围内容移位。Emphasis 中的其他动效
A
Bounce (弹跳)
别称 Bounce (attention)
元素上下弹跳,弹跳幅度逐渐减小。
适用场景
向下滚动提示、行动号召按钮
在[应用位置]添加“弹跳”(Bounce)提示效果。
元素向上跳起再落下,快速弹跳几次,每次幅度越来越小,落地时略微压扁。
触发时只播放一次,不要循环;对开启了“减少动态效果”的用户则跳过。Flash (闪烁)
别称 Blink
元素通过快速切换不透明度来闪烁。
适用场景
提示有新内容
在[应用位置]添加“闪烁”(Flash)提示效果,也叫 blink。
元素快速淡出再淡入,闪烁两次,然后保持完全可见。
只播放一次,不要无休止地闪烁;快速闪烁可能让人不适,所以对开启了“减少动态效果”的用户则跳过。ABC
Flicker (频闪)
别称 Flickering
元素的不透明度像接触不良的灯一样不规则地闪动。
适用场景
霓虹和故障风效果
在[应用位置]添加“频闪”(Flicker)效果,也叫 flickering。
元素大部分时间保持稳定,偶尔像接触不良的霓虹灯一样短促、不均匀地变暗。
节奏要不规则而不是等间隔,避免全强度的快速闪烁;对开启了“减少动态效果”的用户则停止。