2022年logo制作教程.pdf

logo 制作教程心之所向 ,所向披靡在学习制作之前先全面认识一下LOGO ！一、什么就是LOGO 翻开字典 , 我们可以找到这样的解释 : “ logo: n、标识语”。在电脑领域而言,LOGO就是标志、徽标的意思。而本站主要所收集的LOGO, 就是互联网上各个网站用来与其它网站链接 的图形标志。二、 LOGO 的作用1、LOGO 就是与其它网站链接以及让其它网站链接的标志与门户。INTERNET之所以叫做“互联网” , 在于各个网站之间可以联接。要让其她人走入您的网站,必须提供一个让其进入的门户。而 LOGO 图形化的形式, 特别就是动态的LOGO, 比文字形式的链接更能吸引人的注意。在如今争夺眼球的时代, 这一点尤其重要。2、LOGO 就是网站形象的重要体现。试问一个衣冠楚楚的人怎么能让自己的名片污渍不堪？就一个网站来说,LOGO即就是网站的名片。而对于一个追求精美的网站,LOGO更就是它的灵魂所在, 即所谓的“点睛”之处。3、LOGO 能使受众便于选择。一个好的LOGO 往往会反映网站及制作者的某些信息, 特别就是对一个商业网站 来话 , 我们可以从中基本了解到这个网站的类型, 或者内容。在一个布满各种LOGO 的链接页面中, 这一点会突出的表现出来。 想一想 , 您的受众要在大堆的网站中寻找自己想要的特定内容的网站时, 一个能让人轻易瞧出它所代表的网站的类型与内容的LOGO 会有多重要。三、 LOGO 的国际标准规范为了便于INTERNET上信息的传播, 一个统一的国际标准就是需要的。实际上已经有了这样的一整套标准。其中关于网站的LOGO, 目前有三种规格: 1、88*31 这就是互联网上最普遍的LOGO 规格。2、120*60 这种规格用于一般大小的LOGO 。3、120*90 这种规格用于大型LOGO 。四、 LOGO 的制作工具与方法好像目前并没有专门制作LOGO 的软件 , 其实也并不需要这样的一种软件。我们平时所使用的图像处理软件或者还加上动画制作软件( 如果您要做一个动画的LOGO 的话 ) 都可以很好地胜任这份工作 , 如 PHOTOSHOP、FIREWORKS 等。而 LOGO 的制作方法也与制作普通的图片及动画没什么两样, 不同的只就是规定了它的大小而已。五、一个好的LOGO 应具备的条件1、符合国际标准2、精美、独特3、与网站的整体风格相融4、能够体现网站的类型、内容与风格_- 关于 LOGO 设计 的文章对网站的LOGO 设计做了一些归纳, 希望得到批评, 发现写的太长了, 又不忍心删减, 就分成两部分了, 第一部分就是有关设计基础的。第二部分就是关于网站L OGO 的设计规范的, 所有意见就是个人的思考 , 并不针对任何人或网站。欢迎不同见解的探讨。LOGO 的应用一直就是CIS 导入的基础与最直接的表现形式, 其重要性就是不言而喻的, 网络标识 的设计尤其如此。一、标识的职能: 作为独特的传媒符号, 标识 (LOGO)一直成为传播特殊信息的视觉文化语言。具信 , 最早的符合CIS精品资料 - - - 欢迎下载 - - - - - - - - - - - 欢迎下载 名师归纳 - - - - - - - - - -第 1 页，共 9 页 - - - - - - - - - - logo 制作教程精神的标识实例, 就是 2433 年前陪葬我国楚地的曾侯乙的一只戟上的 曾 字型图标。无论从古时繁复的欧式徽标、中式龙文, 到现代洗练的抽象纹样、简单字标等都就是在实现着标识被标识体的目的 , 即: 通过对标识的识别、区别、 引发联想、 增强记忆 , 促进被标识体与其对象的沟通与交流, 从而树立并保持对被标识体的认知、认同, 达到高效提高认知度、美誉度的效果。作为时代的前卫, 网络LOGO 的设计 , 更应遵循CIS 的整体规律并有所突破。二、网络LOGO 设计的基本应用原理: 在网络 LOGO 设计中极为强调统一的原则。统一并不就是反复某一种设计原理, 应该就是将其她的任何设计原理如: 主导性、从属性、相互关系、均衡、比例、反复、反衬、律动、对称、对比、借用、调与、变异等设计人员所熟知的各种原理, 正确地应用于设计的完整表现。统一也可解释为, 共通以上所述各原理, 而更高、更概括、更综合的原理。构成 LOGO 要素的各部分, 一般都具有一种共通性及差异性, 这个差异性又称为独特性, 或叫做变化, 而统一就是将多样性提炼为一个主要表现体, 称为多样统一的原理。统一在各部分之中的要素中, 有一个大小、 材质、 位置等具有支配全体的作用的要素, 被称为支配。 精确把握对象的多样统一并突出支配性要素, 就是设计网络L OGO必备技术因素。网络 LOGO 所强调的辨别性及独特性, 导致相关图案字体的设计也要与被标识体的性质有适当的关联 , 并具备类似风格的造型。记得最近 EASTECHO 的网友论坛重新开张之时, 就有小魔女对论坛的LOGO 表示了异议 , 一个简单印刷字体的LOGO 与浪子固有的独特风格、精益求精的品质有较大背离, 并与整个网站L OGO 缺乏联系, 从而产生认知的歧义。不过作为充斥英文LOGO 的浪子网站 , 做了中文LOGO 尝试 , 算个突破吧。网络 LOGO 设计更应注重就是一种对事物张力的把握, 在浓缩了文化、背景、 对象、 理念及各种设计原理的基调上, 实现对象最冲动的视觉体现。也可以理解为一种最受制约的冲动, 在任何方面的张力不足的情况下, 精心设计的L OGO常会因为不理解、不认同、不现实、不前卫、不艺术、不朴实等相互矛盾的理由而被用户拒绝或为受众排斥、遗忘。所以恰到好处的理解用户及L OGO的应用对象 , 就是少做无用功的不二法门。不考虑国情与用户的认识水平, 对自身设计能力估计不足都就是要不得的。在国内给哪个卖计算机的老板设计个$ 300 万的朗讯 红圈 LOGO, 很容易被瞧作就是骗钱的。三、网络LOGO 的表现形式 : 作为具有传媒特性的LOGO, 为了在最有效的空间内实现所有的视觉识别功能, 一般就是通过特示图案及特示文字的组合, 达到对被标识体的出示、说明、沟通、交流从而引导受众的兴趣、达到增强美誉、记忆等目的。表现形式的组合方式一般分为1、特示图案 2 、特示字体 3 、合成字体1、特示图案 : 属于表象符号, 独特、醒目、图案本身易被区分、记忆, 通过隐寓、联想、概括、抽象等绘画表现方法表现被标识体, 对其理念的表达概括而形象, 但与被标识体关联性不够直接, 受众容易记忆图案本身 , 但对被标识体的关系的认知需要相对较曲折的过程, 但一旦建立联系, 印象较深刻 , 对被标识体记忆相对持久。所以对持久记忆要求高时应设计良好的特示图案形象, 较好的设计如苹果公司的牙印苹果, 对图案 LOGO 的面向推广的各种要素都把握的恰到好处, 另外一些情况下, 希望在较短期限内建立形象的, 还应该设计相应的吉祥物, 以类似苹果这样耳熟能详的概念, 强化沟通与理解。在现代精神快餐的时代, 朗讯的红圈也在成为时尚。不过这类设计在国内还只有设计公司的网站才能接收吧, 但有线电视的一个最新的影视综艺节目的L OGO就出现了螺旋型的朗讯红圈, 可叹借鉴时大胆有余, 创意不足了。2、特示文字 : 属于表意符号。 在沟通与传播活动中, 反复使用的被标识体的名称或就是其产品名, 用一种文字形态加以统一。 涵义明确、 直接 , 与被标识体的联系密切, 易于被理解 , 认知 , 对所表达的理念也具有精品资料 - - - 欢迎下载 - - - - - - - - - - - 欢迎下载 名师归纳 - - - - - - - - - -第 2 页，共 9 页 - - - - - - - - - - logo 制作教程说明的作用 , 但因为文字本身的相似性易模糊受众对标识本身的记忆, 从而对被标识体的长久记忆发生弱化。所以特示文字, 一般作为特示图案的补充, 要求选择的字体应与整体风格一致, 应尽可能做全新的区别性创作。完整的 LOGO 设计 , 尤其就是有中国特色的LOGO 设计 , 在国际化的要求下, 一般都应考虑至少有中英文双语的形式, 要考虑中英文字的比例, 搭配、 一般要有图案中文、图案英文、图案中英文、及单独的图案、中文、英文的组合形式。有的还要考虑繁体、其她特定语言版本等。另外还要兼顾标识或文字展开后的应用就是否美观, 这一点对背景等的制作十分必要, 有利于追求符号扩张的效果。闪客帝国及其前身的边城浪子LOGO, 都有着极好的设计, 但都没有考虑中文, 不过浪子好象一直对汉字的表现力如极小字体的缺乏、特性字体缺少等颇不以为然, 也许导致她怠于思考对中文的设计。这对面向国内网友的网站L OGO,不能不说就是一种遗憾吧。3、合成文字 : 就是一种表象表意的综合, 指文字与图案结合的设计, 兼具文字与图案的属性, 但都导致相关属性的影响力相对弱化, 为了不同的对象取向, 制作偏图案或偏文字的L OGO,会在表达时产生较大的差异。如只对印刷字体做简单修饰, 或把文字变成一种装饰造型让大家去猜。其综合功能为: a、 能够直接将被标识体的印象, 透过文字造型让读者理解; b、 造型后的文字 , 较易于使观者留下深刻印象与记忆; 瞧到有许多人仍然没有自己的logo 、在此给大家发几个教程所谓打字效果, 就就是文字在光标 的带动下 , 富有节奏感般地挨个展现出来。这种效果在网站的LOGO 制作中还不多见。因此我们今天就一起来制作这样一个动态的网站LOGO 。最终的效果如图01。图 01 “智慧生活LOGO ”源文件下载(50K,ZIP压缩文件 )启动 Firework后新建一个88*31 大小的画布。 这种大小也正就是网站LOGO 最为常用的尺寸。然后点击“层”面板右上角的下拉按钮, 把“单层编辑”的选勾去掉。这样就可以使鼠标指针 跨图层地进行对象的选取了。如图02。图 02 准备工夫做好后我们就来正式绘制了。在画布上用“矩形”工具画一个88*31 大小的长方形,使其覆盖整个画布。然后用“波浪”渐变进行填充, 渐变色由 # 009900 至# 56BB12 。再用 35% 的“烟雾效果”进行纹理填充, 如图 03。精品资料 - - - 欢迎下载 - - - - - - - - - - - 欢迎下载 名师归纳 - - - - - - - - - -第 3 页，共 9 页 - - - - - - - - - - logo 制作教程图 03 然后再为该矩形对象添加一个“内侧发光”的特效, 发光色为 # FFFFFF,其它各项设置如图04。图 04 用“矩形”工具再画一个88*31 的长方形。描边色为# 019A00, 不采用任何填充。然后使其与画布进行居中对齐。如图05。图 05 这样 ,LOGO的背景也就是绘制完成了。考虑到这就是一个动态的LOGO, 而且部分动作效果可以使用动画元件来完成。因此为了后续操作的方便, 我们再次点击“层”面板右上角的下拉列表,从中选择“共享此层”。也就就是把“层1”设置为共享层, 以后该层内的背景对象将被其它帧共用。在“层”面板中新建一个图层“层2”。然后用“文本”工具在画布上输入相关网站或论坛的名称。在这里我输入的就是“智慧生活”, 字体为15 号的加粗黑体 , 色值为 # FFFFFF,使用“匀边消除锯齿”。最后使该文本对象保持与画布垂直对齐。如图06。精品资料 - - - 欢迎下载 - - - - - - - - - - - 欢迎下载 名师归纳 - - - - - - - - - -第 4 页，共 9 页 - - - - - - - - - - logo 制作教程图 06 用“矩形”工具画一个16*16 的正方形 , 对其使用无描边的“条状”渐变填充, 左右两个渐变滑块均为纯白色, 而不 透明度 则由 100% 至 20%,如图 07。图 07 我们通过该正方形对象的属性框中, 将其宽度设置为1 像素 , 然后通过键盘方面键的移动, 使其紧靠在“智”字的左边。这样, 一个光标的形状也就绘制出来了, 如图 08。图 08 在这个光标对象上点击鼠标右键, 从弹出菜单中选择“转换为元件”。然后会弹出一个元件属性对话框。在名称栏中我们可形象的将其命名为“光标”, 类型为“图形”。从而把这个对象转成图形元件。此时启动“库”面板的话, 可以瞧到里面就有我们刚转换完成的“光标”元件。选中它 , 并将其直接拖拽至画布当中。然后通过方向键的移动, 把它放置在“活”字的右边并与“智”字前的光标元件进行水平对齐, 如图 09。图 09 将当前的两个光标对象同时选中, 然后选择菜单栏中的“修改元件补间实例”项。然后在弹出的“补间实例”窗口中设置步骤数量为3, 并勾选“分散到帧”选项。此时启动“帧”面板时可以瞧到, 在两个光标之间已建立了所需的动画帧数。如图10。精品资料 - - - 欢迎下载 - - - - - - - - - - - 欢迎下载 名师归纳 - - - - - - - - - -第 5 页，共 9 页 - - - - - - - - - - logo 制作教程图 10 我们继续回到第一帧中进行操作。将“智慧生活”这个文本对象复制后, 在其它帧中进行粘贴。而粘贴后的文本对象仍然会在画布上的原位置中, 因此不必担心动画在播放过程中会出现文本偏移的情况。因为文字就是在动画的播放过程中逐个展现出来的, 这个过程只需要4 帧。所以我们把第1帧中的文本对象进行删除。而第2 帧中则用“文本”工具对其文字对象进行编辑, 使其只保留一个“智”字。以此推论, 第 3 帧中则保留“智慧”两字; 第 4 帧中则保留“智慧生”三个字, 第 5帧则不对文本对象进行修改。完成后 LOGO 的打字效果就有了一个初步的效果, 我们可以点击文档窗口下方的播放按钮进行查瞧了, 如图 11。图 11 我们再接再厉。选中第5 帧后 , 点击“帧”面板右上角的下拉菜单 , 从中选择“重制帧”项,然后在弹出来的“重制帧”设置窗口中设置数量为2, 如图 12。 就就是将第5 帧进行 2 次的复制 ,而复制出来的帧也就就是“帧”面板里的第6 与第 7 帧。图 12 依次点击第6 与第 7 帧 , 将“智慧生活”最右边的光标对象删除。然后从第7 帧开始 , 我们就将进行 LOGO 网址动画的制作了。用“矩形”工具在第7 帧的画布上画一个84*10 的长方形 , 使用无描边的实心填充, 填充值为 # E5F4DC 。然后将其移至LOGO 的下方与画布进行垂直对齐, 如图 13。精品资料 - - - 欢迎下载 - - - - - - - - - - - 欢迎下载 名师归纳 - - - - - - - - - -第 6 页，共 9 页 - - - - - - - - - - logo 制作教程图 13 用“文本”工具在这个矩形上面输入相关的网址, 在本例中我输入的就是“ life8、net”,字体为 12 号的宋体 , 颜色为 # 489801, 使用“不消除锯齿”项。然后使其与下方的淡绿色矩形进行水平与垂直对齐, 如图 14。图 14 将淡绿色矩形与这一文本对象同时选中后使用“修改组合”命令, 使其成为一个组合对象。然后再次从“帧”面板的右上角下拉菜单中选择“重制帧”项。在“重制帧”设置窗口中将所要复制的帧数设置为6, 其它选项不变。此时在“帧”面板中将自动把复制出来的6个帧排列出来, 分别就是第8至第 13帧, 如图 15。图 15 我们分别将第8、第 10 与第 12 帧中的网址组合对象的不透明度设置为50%,如图 16。图 16 这样一来就可以使网址动画在显示时产生闪动的效果, 如图 17。图 17 就是否觉得动画闪得太快了呢！别急, 帧的延时时间我们还可以进行调整。双击第1 帧右侧精品资料 - - - 欢迎下载 - - - - - - - - - - - 欢迎下载 名师归纳 - - - - - - - - - -第 7 页，共 9 页 - - - - - - - - - - logo 制作教程的延时时间数, 将原来的7/100 秒改成 14/100 秒。使该帧的停留时间增加一倍, 如图 18。图 0 用同样的设置方法对其它帧的延时时间进行设置, 在本例中我将各帧的延时时间设置如下( 图 19) 。图 19 可以瞧到 , 第 13 帧的延时时间就是最长的, 这样做只就是使观瞧者能有足够的时间瞧清上面的网站名称与网址, 这当然也就是宣传的需要。至此整个LOGO 的制作就大功告成了。可通过菜单栏上的“文件导出预览”项将动画导出并保存为动态的GIF 图片格式。最终效果如图20。精品资料 - - - 欢迎下载 - - - - - - - - - - - 欢迎下载 名师归纳 - - - - - - - - - -第 8 页，共 9 页 - - - - - - - - - - logo 制作教程精品资料 - - - 欢迎下载 - - - - - - - - - - - 欢迎下载 名师归纳 - - - - - - - - - -第 9 页，共 9 页 - - - - - - - - - -