淘宝商城首页售出广告视觉规范草案.docx

淘宝商城首页售出广告视觉规范v2.0 最后更新 2011年1月9日以下设计规则，均基于商城品牌视觉调性主旨出发：淘宝商城品品牌调性关键词 优雅、简洁、丰富。banner设计关键字 清晰、品牌、简洁、优雅目前售出广告存在的普遍问题：1. 图片、素材、文字等元素不清晰2. 使用饱和度过高的对比色3. 文字、按钮等元素质感太重太多4. 文字字体过大，字体特效很多，造成山寨感5. 跟商城首页的设计不够协调对应的解决方案及详解：1. 形式只能使用静态设计, 不接受gif、flash等一切动画形式2. 素材：商城要求：图片、素材、文字等元素必须高精度，清晰可读。【图片、素材、文字等元素不清晰案例】不清晰定义：元素、文字、图片等因拉伸或压缩出现的 “锯齿”、 “噪点”、“模糊”的现象。【锯齿案例】【噪点案例】【模糊案例】解析：造成不清晰原因：（1）素材本身取材问题，精度不够高，原材料不清晰。- 原始照片、素材必须足够清晰。（2）素材被强行拉伸放大，导致精度不够，变得模糊。- 可以缩小素材, 勿强行拉伸放大，必须使用较大的原始素材。（3）图片存储的压缩程度太大，导致色彩失真。或者压缩格式不适合。- 推荐存储方法：格式：png-8 | 对于颜色数比较少、尺寸比较小的图片表现较好，存储图片节省空间。k数：（长x宽x0.35）+2k=最终k数 | 可在“颜色”选项微调来达到这个结果2配色：商城要求：（1） 不能使用高饱和度撞色，会造成用户浏览的眼球不适。（2） 除产品（包括模特）、logo之外，文案与背景的主色彩总数不能超过3种 （同色系除外）1.【反面案例】解析：高饱和度: 饱和度是指色彩的鲜艳程度，高饱和度指颜色鲜艳程度过高，会直接引起用户的视觉疲劳。也是山寨感的很大原因之一！如上案例中所用绿色，在饱和度轴中已属于最高级别： 更多饱和度色谱案例：绿、蓝、粉、红、黄、蓝应避免的撞色：参考上图案例，圈定色区均为饱和度太高，均不可以互相搭配！同时，此类颜色也不能和黑色撞色。例如：亮红配纯黑、亮蓝配纯黑等。【反面案例】3 背景：商城要求：（1） 背景不得使用白色（会使焦点图开天窗）（2） 不能使用高饱和度颜色做背景色 （高饱和度定义参见配色）【反面案例】（该案例同时有高饱和度撞色问题）4 文案：商城要求：（1）文字不得使用图层样式（包括投影、阴影、浮雕、渐变、描边、外发光）（3）文字整体占构图比例不能超过50% 【反面案例】（4）文字字体、大小、颜色的使用均不能超过3种(不包括logo及特殊文案*) * logo及特殊文案:a. 注册商标(不包括说明文字)b. 代言人签名(不包括说明文字)c. 素材中出现的带有文字的图片d. 产品系列标识(不包括说明文字) 。（5）文字必须满足：左对齐、右对齐、居中对齐的其中一项。（6）文字颜色不能和背景同色系，必须清晰可读。（7）不能使用纯文字的banner形式, banner中必须出现相应产品图。（8）不能出现”x折”,”满xx减xx”的促销文案。【字体有图层样式】投影内阴影外发光、内发光浮雕渐变描边【文字综合案例】 【字体没有对齐案例】【正面案例：居中对齐】【正面案例：左对齐】【文字不能与背景同色系案例】8构图：商城要求：不能使用切割构图 切割构图指有贯穿色块、贯穿切割线的构图形式。 【反面案例】9版权：商城要求：广告所用文字、产品、模特等出现的素材均需有对应的使用版权，不得侵权使用。 同时, 不能使用聚划算、蘑菇街等未经授权的电子商务公司的logo10对于反例的处理：欢迎卖家、招商小二指出线上、审核过程中对规范执行不严的案例, 一旦确认违规将会立即要求卖家修改并重新上传！但是决不可能因为之前的失误而放宽对报错卖家的审核标准11审核流程：请在上线前3天提交至ued12官方模板：为使设计能力较为欠缺的初级卖家也能较为高效的传达促销信息并通过审核, 我们准备了一套通用的官方模板, 其中有多种配色供卖家选择使用.psd文件共包含10余种配色, 后续将会整理更多的模板供卖家使用13审核邮件模板：1. 邮件分为内容、附件两部分, 其中内容部分应写明排期及banner缩略图, 附件应包含素材本身的图片文件, 以便审核素材清晰度.内容模板:商城焦点图广告mring广告计划排期从（2011/09/12 00:00）到（2011/09/12 23:59）时间段内发布；广告图片视觉初稿114奖励措施：商城会对设计出众、点击效率好、积极配合工作的卖家予以首页资源位的奖励。 奖励位置:类目对应楼层的某个资源位, 卖家可以提前1周指定使用奖励资源位的日期, 由首页资源负责人(谢樱)安排奖励位置. 奖励周期:每个月初真对上一月的banner评选一次. 奖励时间为一天。奖励规则:由招商部负责小二