1、Banner設計 新人培训课程 | 从入门到精通 4 作者：人马 | 淘宝北京UED 联系：13691596661 邮箱：renma Taobao Beijing UED | renma Banner設計 4 2010. 7 2010. 8 2011. 6 2012. 2 分享初衷 Taobao Beijing UED | renma Banner設計 4 + 软件共享技术分享高质量素材 t-bj-ued 提升效率及设计质量 Taobao Beijing UED | renma Banner設計 4 百度百科： Banner主要体现中心意旨 ， 形象鲜明表达最主要的情 感思想的表达。 主要类型
2、： 页面中的横幅广告 游行活动时的旗帜 报纸杂志上的大标题 什么是Banner? Taobao Beijing UED | renma Banner設計 4 Banner的重要性 Taobao Beijing UED | renma Banner設計 4 淘宝的设计流程 需求 评估(沟通, 预估, 前期准备) 制作 反馈、确定初稿 跟进 Taobao Beijing UED | renma Banner設計 4 Banner设计：字体 字体传达：清晰易辨认 推荐“方正兰亭黑”系列 禁止使用微软雅黑等未授权字体 尽量少使用英文，且拼写一定要正确 尽量避免对字体的变化，倾斜、拉伸、变形等 Taob
3、ao Beijing UED | renma Banner設計 4 图片质量 严格按照TMS标准下，从视觉 上控制JPG产生的噪点和层次 感的丧失。 图片素材 素材图片应该以真人实景为 主。除特殊需求否则不推荐卡 通效果类素材。 图片素材 当素材设计到大小调整或图片 比重调整时，需按照1：1的长 宽比进行缩放或修改。含人物 ，风景等易辨识内容时，严禁 压扁或拉长素材内容。 Banner设计：图片 Taobao Beijing UED | renma Banner設計 4 Banner设计：传承 Taobao Beijing UED | renma Banner設計 4 Banner规范实例 T
4、aobao Beijing UED | renma Banner設計 4 Banner规范实例 Taobao Beijing UED | renma Banner設計 4 规范：TMS TMS图片算法： 高 x 宽 x 0.4/1024 + 2 = 标准最大k数 510 x200 x0.4/1024 + 2= 41.8KB 常用尺寸： 300 x150 最大19.578K 270 x70 最大9.383K 190 x70 最大7.195K 80 x80 最大4.5K Taobao Beijing UED | renma Banner設計 4 Banner设计实例 Taobao Beijing
5、UED | renma Banner設計 4 Photoshop技法 通常默认的素材缩放后会有些 模糊，没有原图片的锐度。 图像质量问题会导致Banner的 品质感降低，不精致。 滤镜：锐化 复制一层2次锐化 但通常会有些锐利的过头 在2次锐化图层上创建一个蒙 版, 做一个径向渐变.将主体突 出. 原图优化后 Taobao Beijing UED | renma Banner設計 4 Banner设计实例 Taobao Beijing UED | renma Banner設計 4 设计技巧 字体选用正版字体（方正），一般两种字体搭配 为佳。不要超过三种。 太多的附加元素，会干扰用户对主题的识别
6、 英文尽量少用，万不得已情况下，一定要拼写正确 图片素材要注意版权问题，人物最好用授权过的 颜色方面，最好选择纯度高的颜色，尽量避免在颜色中添加过多的灰度 尽量避免对字体的变化，倾斜、拉伸、变形等，PS位图软件会出现锯齿 Taobao Beijing UED | renma Banner設計 4 图片格式：JPG JPEG 图片以 24 位颜色存储单个 光栅图像。JPEG 是与平台无关的格式， 支持最高级别的压缩。但这种压缩是有 损耗的。 Taobao Beijing UED | renma Banner設計 4 图片格式：GIF GIF文件的数据，是一种基于LZW 算法的连续色调的无损压缩格
7、式。其压缩 率一般在50左右，它不属于任何应用 程序。目前几乎所有相关软件都支持它 GIF最多支持256色 最简单的支持低版本IE的透明色解 决方案 Taobao Beijing UED | renma Banner設計 4 图片格式：PNG PNG用来存储灰度图像时，灰度 图像的深度可多到16位，存储彩色图像 时，彩色图像的深度可多到48位，并且 还可存储多到16位的通道数据。PNG 使用从LZ77派生的无损数据压缩算法。 PNG可透明，通道 Taobao Beijing UED | renma Banner設計 4 图片格式：Flash swf是Macromedia（现已被 ADOBE公司
8、收购）公司的动画设计 软件Flash的专用格式，是一种支持 矢量和点阵图形的动画文件格式，被 广泛应用于网页设计，动画制作等领 域 组件化特色，擅长小K数的大 尺寸动画 Taobao Beijing UED | renma Banner設計 4 总结：细节决定成败 清晰的主题 直观的文案描述 良好的构图 富有品质感的图形 锐利精致的反光 适当的色调和渐变 适合的图片格式 图片尺寸 多底色延伸 Taobao Beijing UED | renma Banner設計 4 常用链接 视觉规范 - Banner： 视觉规范 - 图片： 图库： 全景： 字体：tbnasTaoBaoUI悟玄Fonts方正兰亭 Taobao Beijing UED | renma Banner設計 4 Thanks : ) 谢谢观看 2012.2.27 作者：人马 | 淘宝北京UED 联系：13691596661 邮箱：renma Taobao Beijing UED | renma Banner設計 4 Q & A
