企业logo动画

篇一:制作logo动画教案

篇二:6个动画告诉你谷歌的LOGO进化过程

6

个动画告诉你谷歌的LOGO

进化过程

作者: 一网学最后更新时间:2015-09-06 10:57:00

小编:Google品牌形象的每一次改变都牵动着全世界用户的心,无疑是这家科技巨头的强大影响力所造就的结果。随着最新的Google视觉形象的发布,吐槽和赞誉就没有停止过,但是此刻我们不妨将脑洞先填上,看看新设计背后Google到底有着怎样的考虑。原文中的视频均被他亲手压制成GIF动画!

谷歌并不是一家传统公司。我们的使命是整合全世界的信息,让它们更易于获取并让用户从中受益,并且我们也一直推动着这件事情,不断发展。去年,我们推出了Material Design,让设计师和开发者拥有更强的拓展性,轻松拥抱这个多屏、多设备的世界。因此,今天很高兴能和你们分享我们全新的品牌形象,希望全新的谷歌无论何时何地都能让用户更方便。

自Google成立以来,Google.com的网页设计一直保持着惊人的简约:古怪而多彩的Logo在一个简单直观的输入框上面,整个页面的背景就是单纯的白色。随着技术的发展,设计开始发生变化,需求和投入也变的越发的多样化。全新的设备类型和多样的交互和沟通方式同可穿戴设备、语音技术以及智能硬件结合到了一起,在我们身周并不鲜见。今天的用户通过一系列不同的设备承载谷歌的服务,而我们应当以更为简约而令人愉悦的品牌形象,来回应大家的认可和期望,以新的姿态来拥抱每一个机会和每一块屏幕。

接下来,我们来看看有哪些设计是大家所认可而喜欢的,并推动整个品牌形象向着更加动态而非传统的方向进化。

共同设计

企业logo动画

今年年初,来自世界各地的设计师,同谷歌的创意实验室与Material Design团队一起,在纽约一同进行了为期一周的设计冲刺活动,我们共同起草了一份简短的列表,确定了我们要解决的四个主要挑战:

1、它需要是一个可拓展性的标识,在有限的空间中传达出完整的信息和形象

2、它需要是一个高度整合的动态形象,将用户交互的不同阶段都整合到一起

3、它需要是一套系统的方法,不仅要便于我们产品的品牌推广,还要确保用户在同谷歌产品日常接触时候拥有一致的体验和感受

4、它需要是成就谷歌风格的所有元素的精炼,将用户所喜欢所热衷的谷歌元素集成到当中,并且随着用户需求的变化而进行提升和调整

于是,我们开始将我们的品牌形象抽象、精炼成最基础的四种色彩,并置于白色的背景上,以为备份。确定了问题,构思被固定在白板上,动画也借由贝赛尔曲线勾勒出来。在上百个小时的设计之后,我们在地板上摆满了不同的设计方案,并且确定了几个令人振奋的设计方向。

我们同整个团队分享了想法,工程、研发、产品和营销的团队参与了测试和可行性分析,并反复推敲了设计方案的部署和策略。这种协作流程带来了一套足够灵活的系统,足以让营销材料和产品应用于任何平台,并将三种不同状态的设计元素融合为一个LOGO。

元素

Google LOGO样式

确保它是一个包含显著多色彩的无衬线体文字LOGO

具备互动性、辅助性和过渡性的浓缩的动态形象

Google G

紧凑版的Google Logo形象

了解这套体系

对于这套体系的思考和设计开发远不止于核心元素这么简单,我们的团队设定了一套规范来确保它的广泛应用性和一致性。下面的示例虽然不完全,但是能够展现出我们系统思考的一部分。

LOGO样式

Google的LOGO一直保持着简约、友好而平易近人的风格,我们希望通过拥有高纯度数学特质的几何形象和教科书式的字母形象,来保持LOGO孩子般的单纯特质。新的标识采用了几何风格的无衬线体设计,并且结合了多彩的用色和极具趣味性的旋转(字母e)。

通过在不同的数字环境中进行严苛的测试,我们确定了最终LOGO样式中字体的大小、粗细。为了确保LOGO的屏幕显示和印刷效果,我们所制定的标准涵盖了间距和间隙的规则,产品锁定规则以及产品处理的排除规则等整套规范。 G LOGO的构建

Google G标识的设计来源于字母

G的形象,但是为了增加它在小尺寸使用时的视觉重量,需要让它同其他的元素共享空间。这个G字母LOGO的设计和Google Logo所使用的栅格系统相同,由于字母G中间横线的存在,为了在使用四色填充的时候确保整体的视觉平衡感,并且根据眼睛的视觉特征,我们重新调整了色彩的区域和次序。

Google 点状动效

Google的点状LOGO一直保持着充满活力的运动状态。它代表着Google充满智能的运作方式和为你服务的态度。我们仔细推敲着这些独特而神器的时刻,

篇三:Photoshop动画教程:图片渐隐LOGO动画效果的制作

Photoshop动画教程:图片渐隐LOGO动

画效果的制作

直线网

PS自带的IR(ImageReady)做动画可不是仅仅能一帧帧地拼起来,除了做逐帧动画,也支持过渡动画的功能~~新版本的ImageReady CS还可以导出为SWF格式的动画文件~~

IR的动画原理是通过不同的帧显示不同的图层达到的,而不是一般的一帧一帧拼起来,而且一个图层在不同的帧里面可以设置不同的参数~~这个渐隐动画就是利用不同的帧透明度不同的原理来制作的..

1.打开要处理的文件

2.点"动画"面板上的"复制当前帧",复制出一个帧.

3.在图层面板上,将"不透明度"设置为

0%..

4.选择第一帧,点击"动画"面板上的过渡按钮.

5.在弹出的对话框中设置"要添加的帧"为10,这个参数是指在两个帧之间插入多少个帧来过渡...(在这里可以选择过渡到一下帧或者是最后一帧,也可以只针对一个图层或所有图层..同时还可以选择对位置、不透明度或效果来进行过渡

)

6.一个慢慢消失的效果就完成了

!~

7.光是消失然后一下子出现的话还是不大自然,应该再加一个慢慢出现~~选择最后一帧(第12帧),把透明度改为90%,再选择第11帧,插入一个10帧的过渡(方法参照第4第5步),就完成了动画的制作

直线网