Banner设计的六大原则

标签: Banner 一淘 设计原则 PS 教程 & 设计文章 | 发表时间:2013-02-19 22:41 | 作者:kingtent
出处:http://www.uisdc.com

Banner设计可以说是我日常工作中最主要的一块需求,banner不比大型项目,从设计成本上来讲不可能给太多的时间给设计师,所以这也引发了我对如 何更有效率地完成一个banner的思考。我觉得构成banner的重点主要有三个方面,即风格,排版以及配色。我个人的习惯是先定风格,再做大致的排版 和配色,然后根据整体再来调整,最后再优化细节。

下面我就根据自己的一些经验从从这3个方面展开来讲一下(视觉大牛们请轻拍):

首先是风格, 一般情况下风格在跟需求方沟通的时候就已经定好了大概的方向,同时我们可以问他要一些参考,进一步确认风格,还有种情况是需求方方没有任何的要求,就说让 你自己把握就好,那这个我觉得也是分两种情况,一种是需求方真的信任你,放手让做,还有种就是其实他自己也不知道要什么样的,只是想等你做出来以后看了再 说,如果是这种情况不讲清楚的话很有可能就会面临重做的悲剧。第一种类型基本就不需要太操心,自己根据内容什么的来把握就好。第二种类型的话就需要引起注 意了,我们可以自己找一些认为比较合适的参考让需求方来选择,然后根据他的选择和需求方确认风格,防止他后面说什么不要这种风格的,重做一版看看之类的。 那么怎么来分别是哪种类型的呢?我觉得吧一些经常合作的,是完全可以根据以往的经验的来判断他是属于哪种类型的,如果是第一次合作的我就会先直接判定为第 二种类型,也就是他自己也不知道要什么样的,以后再根据他的表现重新分类好了。

下面我就按照我们这边的风格风向标来举一些例子:

❶ 时尚风:

可以看到上面这2个banner都有共同的特点,大标题、模特,报刊潮流杂志风。

❷ 复古风:

复古风的重点是传统元素和复古图案,像第一个用了书法字体跟水墨感觉的图案, 第二个则是包含了传统的剪纸元素 。

❸ 清新风:

清新风的重点就是清爽、唯美,轻盈色调跟自然系,比如上面这个banner就让人感觉十分的清丽和透亮。

❹ 炫酷风:

这种风格通常比较多的是深色背景,有一些比较质感的元素跟光影特效。上面这个其实是我当时给一个活动做的版头,平时这类风格做的会比较少点,写分享的时候也没有找到合适的banner,就拿了这个,我觉得可以归类到这个风格。

❺ 简约风:

简约风的特点就是极简主义、大空间,就像这个banner没有任何过多的装饰元素 ,整体感觉就是非常的透气

 

然后是排版,所谓排版,即将文字、图片、图形等可视化信息元素在版面布局上调整位置、大小,使版面达到美观的视觉效果。之前在网上看到过一篇关于ppt排版六原则(对齐,聚拢,重复,对比,强调,留白)的文章,我觉得这个在banner的设计中也是同样适用。这里我把这些原则稍微修改了下,更加适用于banner的设计。

 

一、对齐原则

相关的内容要对齐,方便用户视线快速移动,一眼看到最重要的信息。

二、聚拢原则

将内容分成几个区域,相关内容都聚在一个区域中。

三、留白原则

千万不要把banner排得密密麻麻,要留出一定的空间,这样既减少了banner的压迫感,又可以引导读者视线,突出重点内容。

四、降噪原则

颜色过多、字体过多、图形过繁,都是分散读者注意力的”噪音”。

五、重复原则

排版时,要注意整个设计的一致性和连贯性,避免出现不同类型的视觉元素。

六、对比原则

加大不同元素的视觉差异,这样既增加了banner的活泼,又突出了视觉重点,方便用户一眼浏览到重要的信息。

 

下面我讲下比较常规的版式,主要是大方向的,时间紧的时候可以选择一种拿来直接套用,这里我根据以往的经验大致分了6类:

再讲下 文字的排版,文字的排版要求重点突出,大小粗细错落有致,字体保持在2种左右,像下面这种大尺寸的banner文字就可以适当的做下变形,加入一些跟内容有联系的元素或者图形,可以更好的表达整个设计的情绪。

 

最后是配色, 色彩是由色相、明度和纯度构成的。 色相即颜色的相貌,用于区分各类颜色,如  红色,黄色,绿色,蓝色等;明度即颜色的明暗和深浅,或者说颜色含量里白色的多少;纯度即色彩的饱和鲜艳程度。 每种色彩都会因为色相,明度,纯度的不同,表现出不同的色彩感,色彩是有情感的,不同的配色会带给人完全不同的心里感受。所以当你在做banner的时候 就要考虑你想要表达什么样的情感,想让用户看的时候有什么样的感受,你所表达的情感是不是符合主题内容,基于这些出发点再来做banner的配色就更加的 有目的性了。

下面来看几组banner,我提取了的一些颜色做了色组,并且配有一些文字的说明:

附: 设计参考网站

欧莱凯设计网:http://web.2008php.com/

韩国68:http://gdweb.co.kr/

配色网站:http://www.design-seeds.com/

一淘UX原文: http://ux.etao.com/posts/321

优设哥向您推荐:

设计师如何制定设计原则

Banner设计“点横竖撇捺”

让文字讲好banner的故事

【015期】@SixDogs《banner设计》

推荐:产品设计的八个原则
无觅

相关 [banner 设计 原则] 推荐:

Banner设计的六大原则

- - 优设(UISDC)
Banner设计可以说是我日常工作中最主要的一块需求,banner不比大型项目,从设计成本上来讲不可能给太多的时间给设计师,所以这也引发了我对如 何更有效率地完成一个banner的思考. 我觉得构成banner的重点主要有三个方面,即风格,排版以及配色. 我个人的习惯是先定风格,再做大致的排版 和配色,然后根据整体再来调整,最后再优化细节.

浅谈banner设计

- - 微博UDC
关于Banner的设计,相信已经有很多人都看过这方面经验的分享了,我来公司也做过了一些Banner的设计,那在这其中通过不断的学习、实践积累了自己的一些小小经验和方法,下面给大家浅浅的分享下我总结的Banner设计经验. 如有错误,尽管拍砖,小女子虚心请教学习. Banner设计其实是我们接触互联网工作后,最常见一种工作.

如何做好一个Banner?

- - 互联网的那点事
我现在快毕业一年了,专业是软件工程,很不喜欢这个专业,所以当时就没有选择本专业的工作,可是我很喜欢做设计,喜欢漂亮的图片,实习的时候开始做网页设计,做了三个月,是个很一般的设计,网站的div+css也是在学校学过的,后来经朋友介绍到一家游艇公司做平面设计,现在是做了8个月了,设计水平做企业内部的一些东西还是很一般的.

让文字讲好banner的故事

- - 微博UDC
关于banner设计的话题相信之前已经有很多设计师发表过自己的经验分享,让人看完以后也是感慨良多、受益匪浅. 但是这并不妨碍我们再一次提起这个话题,每个设计师的工作方法和设计的切入角度都是不同的,今天我想跟大家着重谈谈banner中的文字设计,如何设计好banner中的文字,让文字和其他元素相辅相成达到和谐的统一.

Android设计原则

- - 所有文章 - UCD大社区
译者按: 在 iOS HIG已经强大经典了N年之后,Android终于推出了一套比较系统的 HIG(大概是为了配合Android 4.0 Ice Cream Sandwich). 仔细比较两套HIG的“设计原则”部分,发现完全是截然不同的两种风格. iOS HIG走的是更专业型的路线,描述严谨且有不少的专业词汇(比如Metaphors、Consistency之类的).

设计指导原则

- - 企业架构 - ITeye博客
避免在循环内部new一些没有必要每次都new的对象. 所有与IO相关的操作,都需要考虑性能问题,一般采取的措施是连接池,缓存,减少调用次数,合并请求. 每个业务都要分析整个请求链路,找到瓶颈,通过压测的方式确认问题及验证解决方案. 根据业务情况,使用异步化和最终一致性. CPU,内存,网络IO,磁盘IO这些瓶颈,需要知道在合适的场景牺牲什么换取什么.

MySql 之表设计原则

- - 互联网 - ITeye博客
1) 不应该针对整个系统进行数据库设计,而应该根据系统架构中的组件划分,针对每个组件所处理的业务进行组件单元的数据库设计;不同组件间所对应的数据库表之 间的关联应尽可能减少,如果不同组件间的表需要外键关联也尽量不要创建外键关联,而只是记录关联表的一个主键,确保组件对应的表之间的独立性,为系统或表 结构的重构提供可能性.

设计模式和设计原则

- - 编程 - 编程语言 - ITeye博客
26.1  设计模式和设计原则. 26.1.1  设计模式和设计原则的关系. 面向对象的分析设计有很多原则,这些原则大都从思想层面,给我们指出了面向对象分析设计的正确方向,是我们进行面向对象分析设计应该尽力遵守的准则.        而设计模式已经是针对某个场景下某些问题的某个解决方案. 也就是说这些设计原则是思想上的指导,而设计模式是实现上的手段,因此设计模式也是应该遵守这些原则的,换句话说,设计模式就是这些设计原则的一些具体体现.

一些软件设计的原则

- 夕角 - 酷壳 - CoolShell.cn
以前本站向大家介绍过一些软件开发的原则,比如优质代码的十诫和Unix传奇(下篇)中所以说的UNIX的设计原则. 相信大家从中能够从中学了解到一些设计原理方面的知识,正如我在《再谈“我是怎么招聘程序”》中所说的,一个好的程序员通常由其操作技能、知识水平,经验层力和能力四个方面组成. 在这里想和大家说说设计中的一些原则,我认为这些东西属于长期经验总结出来的知识.