compreel

compreel · 动效词汇

动效词汇一部发布片由这些动作组成

每个组件都是我们用代码做好、在 LaunchReel 片子里使用的完整动作:在输入框里打字、落定的大标题、跟着旁白的字幕、Logo 出场、镜头之间的转场、设备里的产品、落定的数字、一路的里程碑、积聚的光、讲清楚的图解。每页都在播放循环演示,并说明什么时候用它。

文字输入动画大标题动画字幕动画Logo 出场转场设备框数据揭示时间线与里程碑能量与粒子图解

在 LaunchReel 里用这些动作做片

文字输入动画4

光标以真人节奏在输入框里打字,然后按下提交、结果翻入。

大标题动画5

有意图的大标题:逐词升起、遮罩揭示、字重变化、翻牌、描边转填充,字号取自 look 的字阶。

字幕动画4

与旁白时间戳同步的字幕:每行给 start/end(毫秒),不给逐词时间时按字长分配。

产品标志与字标的出场方式,每种只做一个清楚的想法;另有结尾卡:Logo + 一句话 + 一个行动按钮。

转场4

一个转场分两半、参数相同:离开镜头末尾 phase out,进入镜头开头 phase in,速度在剪切点最快。

设备框4

手机、笔记本、浏览器框:屏幕里是用 HTML 重建的产品界面(或它自己的图片),缓动滚动、点击涟漪、通知下落,以及聊天对话。

数据揭示6

让数字落地:砸下的计数器、灌到倍数的管子、赛跑的条形、仪表、数出来的图标阵和画出来的曲线。

时间线与里程碑3

看得见的进度:小球跳上台阶、小球沿路走过里程碑、跑道上的栏一个个亮起。

能量与粒子3

积聚起来的光:点亮后一直流动的光环、被挤到一起合成一个的粒子、一节节点亮链条的能量脉冲。

图解3

一步步搭起来的讲解:真实页面上的标注、自己打勾的清单、被各个来源喂数据的中枢。