Banner设计

Banner計4Banner設計百度百科：Banner主要体现中心意旨，形象鲜明表达最主要的情感思想的表达。主要类型：•页面中的横幅广告•游行活动时的旗帜•报纸杂志上的大标题什么是Banner?广告心理包含以下流程：无意注意→有意注意→增强说服效果(记忆与再现、意象与联想)→情感与决策。Banner設計---Banner设计心理学1、刺激物的强度表现于banner设计中，主要包括：重点字体尺寸大+加粗;重点字体颜色醒目;强化重点内容。(1)重点字体尺寸大+加粗：强调数字50与80引起无意注意要具备两个条件：一是刺激物的特点，一是主体状态。Banner設計---Banner设计心理学(2)重点字体颜色醒目：全城热恋夺人眼球Banner設計---Banner设计心理学(3)强化重点内容：春节作为主要内容要一目了然Banner設計---Banner设计心理学2、刺激物之间对比关系表现于设计中，背景饱和度和亮度偏低与背景简单(1)背景饱和度和亮度偏低为了突出banner中的重点，在重要位置选择饱和度较高的颜色，产生明确的视觉中心，而为了不干扰用户的阅读，背景颜色则推荐使用饱和度和亮度偏低的颜色，突出重点避免视觉疲劳。Banner設計---Banner设计心理学(2)背景简单简单的背景能烘托出所要表达内容，使整个banner主次分明。Banner設計---Banner设计心理学3、刺激物的活动变化与新异性：(1)运动型广告(广告分帧呈现)将广告中的元素分帧呈现，可以很好地捕获注意，提升记忆成绩，形成更积极的广告态度以及更高的点击意愿。(2)视觉线索(箭头、手指、目光)好奇是人的天性，人们往往会不由自主跟随别人的目光，箭头的指向，或者任何事物呈现的视觉线索。如果某人正在注视一样东西，或者用手指、某个箭头指向某一方向，我们也会跟随看过去一探究竟，也许你并非有意识地去跟随，但实际上我们内心深处总想知道“到底发生了什么?”Banner設計---Banner设计心理学当婴儿正面呈现时，人的目光关注最多的是婴儿的脸部，对产品则关注相对很少；当婴儿侧身使用视线关注商品介绍时，人的目光就会随之部分转移到了商品介绍上。婴儿视觉图片引导注意力测试(红色区域表示人眼关注时间最长的区域)Banner設計---Banner设计心理学(3)人物肖像。人类从婴儿期开始就喜欢注视面孔，这种现象称为面孔偏好并且这种现象具有重要的社会化意义;所以人类对于面孔的识别具有特异优先性。当一幅图片呈现面孔和其他事物时，面孔会优先得到注意，并被加工和识别。仍然以婴儿视觉线索的图片为例，可以发现，不管图片中婴儿什么姿势，人脸都是优先被注意与加工的区域(红色部位表示人眼关注时间最长的区域)。Banner設計---Banner设计心理学主体状态也会影响网站广告投放效果，其中包括需要兴趣和知识经验。1、需要与兴趣当用户浏览网页时，如果页面呈现与自己需求和兴趣相关的广告，用户便很容易被相关的广告所吸引并产生点击行为;另外，用户网上冲浪时或多或少都有着自己的兴趣与目的，故将广告放在与其广告内容相关的页面上，也就更容易捕获用户的目光。需要与兴趣的运用，可以通过一些出色的用户定位技术视线，例如通过使用百度的搜客与回头客的技术定位，将用户兴趣需求与百度广告相匹配。2、知识经验另外，出现在我们面前的外界事物，能否成为我们注意对象，还要看它与我们知识经验有无关系，以及能否被我们理解或理解到什么程度。所以针对不同文化背景与知识水平的消费者设计不同的广告，不失为明智的选择。Banner設計---Banner设计心理学中文和英文阅读习惯方式有区别，导致结构排版在构成上也会有所不同。Banner設計---Banner设计心理学总的来说，当主客观条件同时具备时，无意注意最容易产生。需要强调的是：banner广告位图片质量的提升与推广转化率的提升一直都是不断追求的两方面，两手抓两手都想硬。但其中有一些点，比如信息获取的难易程度与鲜艳活泼的图片之间的确需要一定的妥协与平衡。首先确保面对网页海量信息时，推广banner能抓住用户注意力，信息获取更显而易见与快捷，带来更高推广转化率，图片质量则屈居其次。当然，在确保便捷获取信息、提升推广转化率的同时，提升banner的视觉审美效果、令用户对图片有更良好的视觉体验，也是我们不断努力与探索的目标。Banner設計---Banner设计心理学Banner設計Banner的重要性Banner設計淘宝的设计流程需求→评估(沟通,预估,前期准备)→制作→反馈、确定初稿→跟进Banner設計Banner设计：字体字体传达：清晰易辨认推荐“方正兰亭黑”系列禁止使用微软雅黑等未授权字体尽量少使用英文，且拼写一定要正确尽量避免对字体的变化，倾斜、拉伸、变形等Banner設計图片质量严格按照TMS标准下，从视觉上控制JPG产生的噪点和层次感的丧失。图片素材素材图片应该以真人实景为主。除特殊需求否则不推荐卡通效果类素材。图片素材当素材设计到大小调整或图片比重调整时，需按照1：1的长宽比进行缩放或修改。含人物，风景等易辨识内容时，严禁压扁或拉长素材内容。Banner设计：图片Banner設計Banner设计：传承Banner設計Banner规范实例Banner設計Banner规范实例Banner設計规范：TMSTMS图片算法：高x宽x0.4/1024+2=标准最大k数510x200x0.4/1024+2=41.8KB常用尺寸：300x150最大19.578K270x70最大9.383K190x70最大7.195K80x80最大4.5KBanner設計Banner设计实例Banner設計Photoshop技法通常默认的素材缩放后会有些模糊，没有原图片的锐度。图像质量问题会导致Banner的品质感降低，不精致。滤镜：锐化复制一层2次锐化但通常会有些锐利的过头在2次锐化图层上创建一个蒙版,做一个径向渐变.将主体突出.原图优化后Banner設計Banner设计实例Banner設計设计技巧•字体选用正版字体（方正），一般两种字体搭配为佳。不要超过三种。•太多的附加元素，会干扰用户对主题的识别•英文尽量少用，万不得已情况下，一定要拼写正确•图片素材要注意版权问题，人物最好用授权过的•颜色方面，最好选择纯度高的颜色，尽量避免在颜色中添加过多的灰度•尽量避免对字体的变化，倾斜、拉伸、变形等，PS位图软件会出现锯齿Banner設計图片格式：JPGJPEG图片以24位颜色存储单个光栅图像。JPEG是与平台无关的格式，支持最高级别的压缩。但这种压缩是有损耗的。Banner設計图片格式：GIFGIF文件的数据，是一种基于LZW算法的连续色调的无损压缩格式。其压缩率一般在50％左右，它不属于任何应用程序。目前几乎所有相关软件都支持它GIF最多支持256色最简单的支持低版本IE的透明色解决方案Banner設計图片格式：PNGPNG用来存储灰度图像时，灰度图像的深度可多到16位，存储彩色图像时，彩色图像的深度可多到48位，并且还可存储多到16位的α通道数据。PNG使用从LZ77派生的无损数据压缩算法。PNG可透明，α通道Banner設計总结：细节决定成败•清晰的主题•直观的文案描述•良好的构图•富有品质感的图形•锐利精致的反光•适当的色调和渐变•适合的图片格式•图片尺寸•多底色延伸Banner設計常用链接视觉规范-Banner：=group:vd:standard:banner_guide_new视觉规范-图片：=group:vd:standard:pic图库：全景：字体：\\tbnas\TaoBao\UI\悟玄\Fonts\方正兰亭关于Banner：1、什么是Banner？可以是网站页面的横幅广告，也可以是游行活动时用的旗帜，还可以是报纸杂志上的大标题。Bnner主要体现中心意旨，形象鲜明表达最主要的情感思想或宣传中心。即网络广告，是一个表现商家广告内容的图片，放置在广告商的页面上，通常大小为468*60素，也可以做成动画形式，这样更具有吸引力。Banner設計----Banner的标准•2、做一个有吸引力的Banner比什么都重要。广告Banner要能在几秒甚至是零点几秒之内抓住读者的注意力，否则网上漫游者很快就会进入其它链接。•3、动画Banner(横条)比静态或单调的Banner更具优势。统计表明动画图片的吸引力比静止画面高三倍。•4、网幅广告,旗帜广告,横幅广告(网络广告的主要形式,一般使用GIF格式的图像文件,可以使用静态图形,也可用多帧图像拼接为动画图像)Banner設計----Banner的标准•1997年第一次标准公布•规格（像素）名称•468×60全尺寸banner•392×72全尺寸带导航条banner•234×60半尺寸banner•125×125方形按钮•120×90按钮＃1或小图标•120×60按钮＃2或小图标•88×31小按钮或banner•120×240垂直bannerBanner設計----Banner的标准•2001年第二次标准公布•规格（像素）名称•120×600摩天大楼形•160×600宽摩天大楼形•180×150长方形•300×250中级长方形•336×280大长方形•240×400竖长方形•250×250正方形弹出式广告Banner設計----Banner的标准Banner設計----Banner的标准•BANNER设计原则：–尽量选择国际标准尺寸，也可以根据页面空间来制定特殊广告位和广告条大小。–一个页面内不宜有超出两个468×60像素的全尺寸Banner。–88×31像素的Banner：网站之间站长互换时长采用，它可以代表网站的形象，有时候甚至真正起到像标识一样的作用，一个设计好的互换Banner，应该能够概括一个网站的风格。Banner設計----Banner的标准Banner設計----Banner的标准•设计Banner时应该致意以下几点。–确定是动态还是静态的Banner。–Banner的“重量”要轻，以468×60像素的Banner为例，大小最好是20KB左右，不要超过35KB；而88×31像素的Banner大小最好在5KB左右，不要超过7KB。当然随着网络宽带的普及，以后在“重量”方面的压力会逐渐减小。–Banner的制作方法有很多，对于不同创意的导航条，也应选择不同的制作方法。只要保证Banner的视觉效果好，制作出“重量”最轻的方法，就是最好的方法。Banner設計----Banner的标准•广告并不便宜。确信你的广告被第一时间读到。•一个经过精心设计的Banner和一个创意平淡Banner在点击率上将会相差很大。在广告文案方面，用一两句广告语来表达即可。•广告语要琅琅上口，图形无需太复杂，文字尽量使用黑体等粗壮的字体，防止在视觉上被网页中其他内容所淹没。Banner設計----Banner的标准•当用户访问一个网站的时候，第一屏的信息展示是非常重要的，很大程度上影响了用户是否决定停留，然而光靠文字大面积的堆积，很难直观而迅速的告诉用户来到这里会得到什么有用的信息，因此网页Banner设计在这里起到了至关重要的展示作用，特别是对于首页Banner，有效的信息传达让用户和文字之间的互动变得生动而有趣，下面就让我们通过大量优秀的设计案例走进Banner设计，走进设计师们的灵感挥洒空间。Banner設計----Banner的标准•一.Banner的构成与设计形态分解•自然界的万物形态构成都离不开点、线、面。它们是视觉构成的基本元素，具有不同的情感特征，因此要善于采用不同的组合去体现不同Banner的情感诉求。•a.点的聚合•点的排列所引起的视觉流动，引入了时间的因素,利用点的大小、形状与距离的变化，可