中华视窗是诚信为本,市场在变,我们的诚信永远不变...
谷歌的新logo是由谷歌内部的创新实验室 ( Lab)、 团队在内的来自不同公司的设计师,也就是谷歌倡导的多平台联合工作理念。这个动效的设计也应该是多位设计师联合完成,但是不难看出,这个动态效果主要是用AE软件完成,获得更具体一点,只要是由AE的路径工具完成,但是做动效最难的并不是实用工具,而是把握节奏。把握这种MG动画的节奏主要看整体的变化节奏感,也就是主要有时间和运动曲线调节完成。
首先咱们把这个GIF动效导入到ps里面,打开时间轴,可以看到,整个动画是由655帧组成,一般25帧为一秒,也就是上面这个动画是有26.2秒。这里面还有一个小问题就是网页承载的gif播放速率,如果有人发现这个问题,或者感兴趣可以单独私聊我。
整个动态效果可以拆分为9段小动画:
第一段(50帧):谷歌变成五个色点
在这个中间其实还有一个小的变化,拆分来看
可以看出字样先是由文字变成了圆,然后第二个g和e变成圆点后消失了,这一部分主要是路径工具完成,还包含了,路径的生长和变化。
第二段(60帧):五个色点变成了G,主要还是生长动画,路径工具
第三段(50帧):G下面出现了一个圆的阴影,其实就是谷歌浏览器的图标,这个其实可以提前做好圆形图标和阴影,使用透明度工具
第四段(50帧):G又分散成四个色点,还是路径生长动画
第五段(50帧):四个色点变成话筒图标
第六段(50帧):话筒图标反向恢复成四个点,其实可以做,也可以把上一部分的动画复制,反向调整。
第七段(150帧):色点和色条的波动效果,主要使用位置工具和路径生长动画
第八段(100帧):点的跳跃,之歌主要是位置工具,设置好位置路径,其余点也要跟着动。
第九段(115帧):最后一段就是开头的反向播放。
最后可以看出其实9个部分,大部分短动画控制在50帧左右,也就是2秒。长动画也基本以秒为单位,4秒或者6秒,使用的工具和方法都很简单,最难的就是把握其中的动效节奏。我自己并非专业的MG动画师,而是以品牌logo和vi设计为主,但是我觉得设计师都要接触,偶尔也会为品牌设计小的动画,为品牌加分,也为自己加分,献丑分享自己几个自己做着玩的小动画。
十年设计经验,国内外设计大奖,我是LOGO设计师陈锐,多交流~