视觉设计分析:短时间做出漂亮的Banner

⊙前言

门户网站因为市场竞争日益激烈，各大门户竞相以谁家资讯更多、领域更广、内容更深等等策略来留住用户的芳心，由此近年来门户网站被称为网络世界的“百货商场”或“网络超市”。即然是个百货商场或超市，那么商场与商场之间的竞争又能通过什么方式使自己处于优势呢？
除了扩大自己的规模、增加商品的种类、优惠折扣以外还可以通过发挥我商场的独特产品或特色服务（例如针对不同用户群体的特色店面，对重要节日商场做一些活动或特殊布置等），还有非常重要的一点就是对商场及内部店面的装修、楼内设施指示等。这就如同我们门户网站的各个专题的视觉一样，每个专题就是“百货商场”里的一间店铺，如何让“客人”在你的“店铺”中留得更久，买更多的商品除了用你的商品打动客人还有你的风格和口味儿是否符合他之外，提升品牌形象也逐渐成为商家相互比拼的一个重要因素。门户网站的“店铺”（专题）一天可以上几十个而且流动性也很大，时效性一般比较强，持续性也较短，所以针对这种特殊性质，门户的视觉秘密武器应运而生——模版！无论是专题框架还是专题banner头部，模版能使成百上千的专题保持一个整体的风格，做到形散神聚的视觉呈现，这对于网站的长期发展是个必要条件！因此不仅仅是我们设计中心要做到“神”的一致更应该将这些理念根植于大量专题的亲生父母亲们(编辑)，因此模版的作用非同小可，从长远来看她关系到一个门户型网站的长期发展与品牌持续发展。当然，凡事都有两面性，模版化的专题页面会使得同学们长期处于一种ctrl+c\ctrl+v的操作中而缺少创造性的新鲜空气，因此对模版的灵活运用显得就尤为重要。以下是一些模版范例：

通过对编辑的多次banner设计培训和对banner模版使用、更新等监控，对于banner模版这块一些浅薄的认识放上来跟大家探讨：

⊙banner模版产生的原因和必要性

●随着v4.0专题模版的上线，专题数量如雨后春笋数量急增，因编辑可以不通过提技术和美术工单，苦口婆心地讲诉求、等设计图、求切图等等繁杂的过程就可以简易地搭出一个像样的、自己想要的专题框架。So，头部的banner设计就成了一个提单主要项目，这是banner单急增的原因之一。

●因为整体框架基本都是由模版搭建，但每个“亲生父母”都希望自己的“孩子”光鲜亮丽地展现在别人面前，所以一个漂亮的banner会如同给他们的“孩子”穿上一件漂亮的衣服或做了一个最fashion的发型，由此吸引更多的人去看她（他）的“孩子”。这也是banner单一直都很多的原因。

●大多数编辑只会基本的PS软件操作或不会操作，少数人熟练。因此，虽然时间不够，但banner也只能提交设计中心制作。这类banner单的数量还是占较大的比例。

●工单太多，设计中心人手告急，因此又无法安排到设计人员在第一时间内给到频道相关的设计。

为应对以上种种情况并使编辑在自行制作banner时能跟整个网站设计风格尽量达成一致，三套方案应运而生：第一当然是领导实行“计划生育”，控制banner单的数量，尽量减少没有意义或重复性的劳作。第二，督促设计师们能在最短的时间内制作一个漂亮而又适合该专题的banner；第三就是秘密武器——banner模版！第四，PS技能和banner设计培训！

banner模版就这么就那么产生了……针对那些时效性较强的、突发性的专题、设计中心无法排开的情况下，无疑给编辑和设计师们找到一个好的解决方法，而且还能在一定程度上保证风格与质量。

⊙banner模版存在的问题及解决方案

●    问题：

虽然banner模版从v3.0的时候就开始建立，但用的同学很少，原因分析：

1、因为初建模版库，只有会议、产品、伤感、生活、喜庆等几个分区还不够全面、内容不够多，所以编辑同学选择性会很少。

2、banner模版库的宣传力度不够，鲜为人知因此优势没有发挥到位。

3、再者是因为少有编辑能灵活地运用PS软件，更何况如何应用现有的模版改为符合自己专题性质的banner了。

4、当然除了这些还有一些即使懂如何操作PS的同学还是对自己不够自信，觉得设计中心做的就是比自己做得好，即使有模版也当然不会比专门从事设计的同事做得好。所以只要不是特别急的单一般都会提单处理。

●解决方案：

1、与v4.0专题模版库同步更新了v4.0banner模版库，这次更新是从设计中心半年来设计的结晶中挑选的精品，更新数量达到70有余，同时还扩展了博联体、女人、世博、其他等，现在一共是16个分区，分区尽量做到对应频道化、风格类同化以方便编辑查找。更新一直都在进行中，每周我们会定期对模版库进行更新，并以邮件和群发的形式给以通知。

2、扩大模版库的知名度，因为以前就存在一些用户而且模版实用性很强，所以还是有很强的粘性的，只要我们够用心地在做，有更多的好模版上传，编辑会很愿意应用甚至会依赖。（当然，太过依赖也是不好的，我们提倡的永远是模版加创造，以达成脱离模版自行创造出符合网易风格的设计，这才是我们的目标！只有这样才能使我们的网站即能保持整体风格也不落入古板）

对部分提banner单较多的频道，有意地增加模版库中该频道的模版数量，同时通过与频道接口人进行配合，加强大家自己动手丰衣足食的意识。

3、培训！视觉规范的培训、设计的培训、PS基础技能的培训等培训如期地安排开来。通过多次培训的结果来看，大家对PS基础技能的培训比较感兴趣这部分培训还是能对大家平时工作起到很重要的作用的，所以这种触手可及的东西总会比设计理念的培训来得更深入人心。

每个季度对新员工的培训并与视觉规范一并纳入考核范围也是至关重要的一部分。新人永远是最大的希望，通过他们将这些理念传播并执行起来，逐次地，banner模版的作用将发挥得更好，对于现在存在的有些页面的头图根本不跟该频道的风格一致，甚至不堪入目的情况得到改善的那一天指日可待。

通过这些培训不仅让编辑能了解到一些视觉规范还能给予到一些实际的操作方式、方法从而对鼓励他们自己操刀设计banner成为一种可能。字儿太多，再来点儿图缓解下：）

⊙banner模版库的现状及展望

●    设计方：

1、 对模版的分类方式有待提高，很多都是按照频道而划分的，但是有部分模版还是可以通用的，优化分类方式也许可以引导编辑更好地运用模版。

2、 对模版要有充分的认识，模版不仅仅是提供给编辑同学们的一种快速实用性操作更是我们自己的优秀作品汇集中心，每个人都有义务和责任去为她增添一些光彩，而且在这里我们可以学习到其它同学的优秀设计，认识到自己有别于他人的设计风格并或找出自己作品的提高空间。

3、 要使整个网站部长期发展中能保持自己独特的设计风格（简洁、直观、大气、整体等），banner模版要贯彻到位，做为设计方可以多跟踪自己设计的模版或跟频道方建立起良好的合作方式，加入到他们的一些工作群内进行沟通与协调等。

4、 要有敏锐的洞察力，实时地对当下流行趋势做很好的前瞻与掌控，必要时对模版进行适当调整，以从源头上掌控整个网站的风格方向而不落入俗套或流于世表。

5、 更新、培训与考核工作继续做到位，主要从编辑操作能力方面入手，找准大家的兴趣点，先教编辑如何使用和操作，再逐步将视觉规范和设计理念传达好，起到设计风格上的把控作用。

●    频道方：

1、使用频率增高并效果渐好

越来越多编辑同学针对较为时效性的专题运用起模版来，而且有些模版不仅用得规范还能做到举一反三，甚至是好几个模版一起加工而成再加入自己的一些设计想法，虽然我们看到的效果从设计角度来看并不是很好，但这种精神我们应给予鼓励，因为这就是我们的目标，不过切不能操之过急，要先学会用再才能用活它。如图：

以上两幅，对系列专题模版的运用基本规范。从字体换图色调搭配都算较为完整，不过第2稿的字没有与配图分开有点儿美中不足。

这是一张由于要临时改动标题而产生变动的设计图，编辑因为没有相同字体造成这种结果。因此，为避免再出现类似种种情况的发生，定稿后应给到编辑相应的字体，以备不时之需。

2、模版运用不规范

这点主要体现在对系列专题模版的运用上。包括更换字体部分多样、更换图片部分与模版的色彩不能很好的搭配、后台操作出误等。根据调查，这些情况多数是由于系列专题一般都不止由某一个或者两个编辑来完成，所以一系列专题下来，多个编辑操作就至使画面出现多种不同让人哭笑不得的画面。这让设计模板的同学常常感到很无奈，频道方给的回馈多种多样“没有相应的字体，装了字体后电脑跑不动~~！”“图片色调不一致但不知道怎么调”等等。。如图：

这套系列专题头图模版的应用是做得比较差的，图片的切隔、图片与背景的融合、图片色彩等都不合理，更不好的是第一张还出现了后台操作的严重错误以致被生生分成两半。

3、对模版的认识不够

没有做到灵活运用模板，跟编辑同学的交流中，我们发现有一部分人只看属于自己频道的模版库，很少上别的频道看！实质上很多频道的东西可以融会贯通的，“模版”不是说一定要是直接在上面只改字或直接嵌套图片上去就是模版，我们做的模版是将好的设计放上去，供大家做参考，至于什么样的风格什么样的版式能更符合自己的专题，这个就要靠同学们自己拿捏。

上图是一张编辑自己制作的头图，融合了右下角两个模版与凡客的设计元素，虽然，效果并不佳，但是他的创造力还是应该给予鼓励。

一个专题页面，banner的视觉效果非常重要，好的banner设计不仅能体现该专题的主旨内容还能美化专题、提高专题信息的传递速度。但往往如果编辑自己操作会出现很多头图风格与网易页面自身风格的迥异，模版库的建立旨在改变这种现状也有益于提高工作效率。灵活运用好模版库的资源，使其不陷入死板硬套的形式里，对整个网站部的长期发展来说才是有益的！品牌的功能、质量和价值、品牌的知名度、美誉度和普及度是品牌的内外三要数，如何巩固网易品牌，我们要做的还很多很多，只有从点滴做起，不断总结不断发现问题解决问题不断地提高，才能将这座“商场”做大做强。