动效与动画

滚入 Roll In

元素从屏幕一侧旋转着平移进来,像轮子滚过来一样入场

滚入

**滚入(Roll In)**是旋转与平移的复合入场:元素一边自转一边从屏幕侧面移动到目标位置,像一颗球滚进画面。它和“旋转进入”的区别:旋转进入是原地转正,滚入还带着横向位移。

什么时候用:趣味性强的运营页、游戏化界面、插画元素登场——需要“活泼、有动能”的地方。正式的 B 端后台慎用,滚动感偏玩闹。

对 AI 说清楚的三要素:① 从哪侧滚入(左侧最常见);② 初始旋转角 100~120deg(转不满一圈);③ 位移距离与旋转同时结束,别转完再滑。

复制即用的提示词片段

入场动效用滚入(Roll In):元素初始状态 rotate(-120deg)
且 translateX(-100%),动画中同时转正并平移回原位,透明度 0→1,
总时长 1s,自带"滚过来"的动能感。