辣么多的网页设计(上)之游戏视觉设计和电商设计
不论是对我们的客户,招募设计的HR,还是对刚初入网页设计这行的新人,我想,这样的总结都是很有必要的,希望能给想找到适合自己的工作的同学们帮助。
先回答几位同学比较关心的问题:
一,网页设计需不需要懂代码,java,C++,切图?
我想说,网页设计三剑客的时代已经过去了。若是你选择在一些二三线城市规模不大的公司,很有可能你会这样。
我是网页设计师,但我也只是会做做PS效果,懂一些html最基础的代码,知道不用通过后台就能去替换文件包里的图片与文字,切图会但是不精,仅此而已。
人的一生,精力是有限的,我们常常很多人会因为环境或者生活所迫,把自己的注意力分摊到不同的谋生能力当中去,门门都会,也意味着门门难以精通,但只有专注于一点,才能在短时间内取得最大的成就。
关键是,你肯不肯坚持自己想要做的事情,还是屈从于环境,还是说你习惯了你现有的生活状态,不肯改变,不肯打破这种状态。
传统的一个网页设计包揽整个项目,是远远比不上有一个团队,团队每个成员擅长不同的能力,所制作出来的效果好的。
U_IDESIGN团队就是这么说的
在过去很多网页设计师都是孤军奋战,一个人包揽整个流程。可是这样诞生的网页,很难达到最佳的效果。
那怎样才能把设计做到极致?网页设计师究竟需要怎样的能力?
首先作为网页设计师,需要手绘,鼠绘,能根据提供过来的素材风格进行重新再创作的能力,做出与之风格统一,协调的同类元素。
可能你还需要摄影能力,懂布光,关键时候能自己去拍摄素材,当然,前提需要你弄到个好的相机
除此之外,但凡高大上的设计,都需要修图以及调色的能力
如果会C4D等3D软件那更是如虎添翼
如果能从在这个基础上再掌握一些字体设计的技巧,那更画龙点睛
(PS:好的游戏网页还会出现很多有趣的动态效果,涉及到flash设计,本文暂且不讨论)
一方面,确实在有团队配合的情况下,每人专司一职页面效果能达到最佳,几个人脑海的碰撞和摩擦,从不
同角度各个方面去考虑会更加周到,大家一起头脑风暴的结果会更加成熟.
一方面,个人多掌握几门和网页设计有关的技能,能帮助你在网页上做到更多他人难以做到的,更出色的效果。
毕竟,不是每个项目都需要借助团队的力量,更多时候,设计师都需要有独当一面的能力,
(请注意,这个观念和前文是不冲突的,我不提倡设计师什么都会,所有流程都大包大揽,但我提倡设计师根据现有的环境,去多发展一到两门对现有工作有更多帮助的技能)
在不同的设计的设计公司,你所需要具备,未来所要培养的能力和发展方向是不同的,但不论在什么地方,你长期养成的良好的设计和思维习惯,你通过常年欣赏好的作品,培养出来美感,你对设计的热爱和坚持,才是你在这个行业的立足之本。
说了这么多,其实要引出的关于网页设计第一个类别,也就是游戏视觉设计
不管别人怎么说怎么想,在我眼里所有网页设计,单从视觉角度上来说,游戏网页设计是最吸睛,表现力
最强的。
从表现手法来看,游戏网页充满了创造力和想象力,其中氛围感,趣味性光效,质感是游戏网页重中之重,
这就是为什么扁平化风格不适合大部分游戏网页设计案例
此外,自晋小彦著书立说一来,形式这一词汇出现在大众视野,什么是游戏网页中的形式感,请看下图
以上案例都是网页排版形式的高层次的运用,大胆的打破了传统网页的束缚.从此,游戏网页中参杂扁平化风格,成为可能!
igame团队最新作品的出现,也让游戏网页从此迈入一个新的层面.我们在igame的稿子中看不到多少复杂的光效和质感,但是依然觉得这样的稿子精致并且有细节,充满美感。
从另一个方向,大白会所两位设计师的新作在设计的质感和技术上也逐渐接近国际水准。但因为这样的稿子是纯视觉方面的应用,商业程度低,页面内容少,实用性欠缺。
扁平化设计存在的意义在哪?
因为这类质感的设计,若是频繁添加,删减内容,去改动,或者让设计师做一整套效果,包涵首页+内页+论坛等等等等一系列设计,设计师能做出首页,但其他更多页面,一套下来十几页,能完成么?那必定是呕心沥血。
当然,我佩服每一个坚持做质感的设计师,他们具有比普通设计更加执着,认真的态度。
曾经和人探讨过身为设计师的使命和价值是什么,设计师一定要是一个前卫的职业,身为设计师,出生在这个互联网高速发展的时代,我们的思维方式必须超前,给大众带来希望和可能,如果没有设计师先行去构思去设计,他们很久很久才能感受到,接触到那些新东西,iphone的发明就是如此。
很多设计师都热衷于概念设计,不管是类似兰博基尼新款车型还是iphone8之类新一代手机,都会有很多设计师自发去设计,可能他们设计出来的产品不一定实用,或者以现有的科技手段根本做不出来,譬如iphone手机的无边框效果,或者机身透明效果,这些也许暂时无法实现,但是就是有了设计师脑子里这些想法,并让图片成型,才给了我们研发人员一个目标, 焉知未来就没办法做到吗?
再说一下国外的游戏网站,我没有一丝想贬低国人的意思,我也不是从洋媚外的人,但确实国外游戏网页高出国内一个档次是事实,但由于环境不同,没什么可比性。
学生时代上那会教科书上写物质文明决定精神文明,物质文明是精神文明的基础。我那会不信,觉得不管贫穷与富贵,只要自己精神能满足就好,但现在信了。比不上人家是正常,国外网页发展多久,国外网络是个什么速度?下个做设计素材打开个高大上的网页做参考是分分钟的事。国外做设计这行生活富足,受人尊敬,国内60%以上的设计,还是在温饱线上徘徊。(每年存款能超过5W的设计可以不理会我这句话)
大部分外国人和大部分国内设计做东西有着本质区别,一个是出于热爱,不计较利益,成本,一个是为了谋生,想早日完成任务,赚更多钱,好早日娶妻买房。
我记得有个酷友评论游戏网页是最好做的设计,也是最难做的设计,它提供过来的高档次的素材,就具备了打造酷炫,具有视觉冲击力效果的一切条件,一方面游戏网页需要设计能搭配着背景和游戏素材能提炼或者自己绘制同样风格的网页元素与之相配,但当设计师达不到能与之相衬的创建素材的能力,就有点捉襟见肘了,一方面若是当本身原画和背景绘制得出色,素材充足的情况下,拿过来做设计是很爽的件事情。让游戏网页就算一般刚入行的人拼拼凑凑就有好的整体效果,在不懂设计的人眼里似模似样。
但就像之前有篇文章写道设计师和策划之间存在恩怨一样,但焉知设计和原画之间就没有恩怨呢?
游戏行业对某些公司来说,就是暴利行业,但自从越来越多的游戏公司如雨后春笋般冒出,整个行业变得趋向于急功近利,毕竟落后一分,意昧着着市场被竞争对手所抢占,在这种情况下,原画师又怎么会有充裕的时间去做图,很多风格,人物的造型各种抄袭借鉴也毫不奇怪。(吐槽下最近偶尔玩的几款游戏APP,名字我又不提了,作为已经拥有广大fans群体的同人改编游戏,游戏中的人物形象角色能画更像玩家心目中的主角形象点么?为了满足老板需求赶进度打酱油画出来的东西,节操何在?要么就是很低俗的露胸露大腿,就为吸引宅男玩家,可是你不想想传播这些东西对青少年有多少危害)
而作为下游的网页设计自然受到不少牵连,当然,这些都是题外话了
进一步的根据功能去细分,游戏设计也包含登陆(下载)页,专题页,官网首页+内页,以及线下海报宣传推广,国内游戏网页设计,确实还是首推TG,因为TG做到了设计商业化和艺术化的融合,网页不仅仅是好看,也有更多的实际用途,每一个功能点都能兼顾浏览者的需求,给到玩家所要了解到的东西,同时也推送了很多卖点,通俗点说就是勾引到玩家为游戏付费买单。其实进入游戏行业对设计师是件很幸福的事情,因为你作品的受众都是年轻人,大家都喜欢酷炫的效果,都热爱追逐潮流。也就是说你完全可以自由发挥而不担心自己的稿子需要做太死板.当然,有些设计师死也无法开窍,不适合做游戏除外……
电商范围有点大,如果说游戏行业圈钱还是比较隐晦,一副你要在游戏里混得比别人流弊,更有身份,更有面子,就最好投钱的话,那电商行业就是打扮得各种花枝招展的明目张胆的向人抛媚眼:客官,快来买吧,奴家渴望你的到来。所以电商设计给人的感觉就是五花八门,色彩靓丽抢眼。
首先要说到电商网站第一个类别:
(购物)平台型网站
也就是我们常见的淘宝,京东,易迅,所有电商网页都有一个同类特征,以产品展示为主,必带搜索按钮,首页必定有N个店铺入口。分类列表那是必不可少,重中之重。
估计知名的那几个平台大家看腻了,放出几个新的例子,包括淘宝腔调频道练习稿,韩国排行第一的购物网站Gmarket 以及专卖正品的购物网11st。
电商设计的难处就在于……这么多产品,都要罗列在同一个页面,要怎么才能展示出来会比较有层次,而显得不乱,看起来有序且整齐,又不会忽略每个地方,一些广告如何能适当的处在页面中最合理的位置,而不会让人产生反感。
前2个案例是设计效果最好看的,但不得不承认,这2个设计有着满足设计师追求视觉和审美的个人爱好之嫌,适合高端大群,但对普通大众缺乏亲和力和吸引力,不适用于现有的时代和环境。想想淘宝的普通用户都是些什么人就知道了……另一方面,网民确实需要更加实用,易用的东西,你设计得再高档次,who care?
但未来有天,这样的风格,我想终会大行其道。为什么?就像建国初期,文化普及程度,普通话掌握程度,全国这个百分比超级低。而现在没上过大学,不会讲普通话的的人群成了少数,国民的素养一直在不断提升中。当民众生活越来越富足,他对设计对美将会有更高的追求。
设计师的苦也苦在这里,明明你做的是件有格调的事情,但偏偏不被大多数人理解,不是你自己的审美,欣赏眼光出了问题。。。而是他人跟不上……
除此之外,这类网站还有一个小分支,也就是团购网站,建设一个平台型网站,所需要投入的资金和时间,所要耗费的心思和精力,是普通网站根本无法比拟的。几十个页面,每个页面都要做好用户体验,也就是阿里巴巴有这个实力,没事改改版,新版天猫首页出好几个版本了.这类型的网站,因为设计带给人的成就感就是做出来的东西会有无数人使用了,但确实有太多条条框框,太多约束。很多框架都已经在一开始被限定死。
双十一节,双十二已经成为阿里巴巴硬生生创造出来的购物节日。在这个大前提下,为了让商家赚得盆满钵满,双节的主会场设计就成了重中之重。可以看到经过多年的发展,天猫的设计已经形成了一种固定的风格,通常图片中会有一两个色彩靓丽的人物或者产品配合着色彩强烈,高饱和的背景。搭配着一些被菱形,扁平化的小元素,连续2年都是如此,期待未来能够看到更新颖的设计。
另外这么多会场的设计,很明显不是出自同一个设计师之手,好的设计师,就是当一个主设计风格被确定下来,然后交给你依据这个来做,你做出来的效果和风格,和同事做出来的并无二致,看上去出自同一个设计师之手。一个好的团队,就是能让设计更加统一化,规范化,呈现出行业的特性。这也是每个初入这行的设计要晋阶所需要注意的。
再说说电商设计另一个类别:
商城店铺装修
如果说平台型网站是一道道的可口美味的点心拼凑的全席,让你怎么吃都吃不腻的话,那么淘宝店铺装修设计带给你的,是场视觉盛宴。
什么?网页看不懂?不明白设计的这个氛围,合成的这个背景和产品有啥联系?没关系,我们要的就是视觉冲击力,我们要做的就是品牌文化。在电商行业,我们可以看到很多独树一帜的店铺,天马行空的创意,用摄影的话来说就是超现实主义。
电商设计的品牌化已经成型,风格乃至模特都是固定,以致每当我们看到网上流出的某个无标识的设计作品,我们都会知道,啊,这一定是哪家那家店出品的。
更多电商案例赏析:
其中,以风格分类,电商也分为若干个方向,象朱尔的设计,经常会采用到大自然的背景,将森林,动物,模特相结合,用滤镜让整个背景呈现出油画般的感觉,一个banner经常流光四溢。在光的使用上,达到了极致。(见例一)
如初语的设计,都是仿佛置身于童话般的魔幻场景,充满着想象力,当然设计是极好的,只是那个model的妆容……(见例二)
然后就是扁平化手绘风格,阿芙精油圣诞专题页将视幻的概念融入到设计中,谁说扁平化就是真的做起来简单了?只是大多数扁平化设计因为刚兴起,没有做到那个最高层次而已。(见例三)
淘宝有年双十二的钻展设计也让人眼前一亮,充满着趣味性,将热点时事,网络流行语与之联系起来,让网民更加有亲切感。这也是手绘风运用极好的例子。(PS:在这里,手绘风并不代表扁平化,只是包含扁平化。另外网页banner广告算不算网页设计?我认为是的,虽然是做平面效果,但承载它的媒介是网络)(见例四)
但是近年来,随着天猫进一步开放后台,让店铺更充满个性化,极简化化风格也开始存在在电商中,象陈聪的坚果店铺设计.林思文的女包,侯帅的茶叶页面。(见例五,例八)
当然设计并非是最适合的解决问题,达到让店铺品牌化的唯一方案。在很多天猫网店中,存着着这么一批单纯靠摄影吃饭的。毕竟要合成一个场景,并且还要好看,所花费的精力,多于没有一个熟练,有条件可以实现好的拍摄效果的摄影师。当然摄影和设计常常是相辅相成的。所以他们的店铺装修,经常是首页banner一张带产品的好看的摄影图+文字就搞掂。(见例六)
另外,随着杰视帮的发展壮大,欧美古典风也开始占领了电商设计一片天。这样的设计对设计师的意境以及基础的光影把握能力极高,才能将人物以及产品图毫无破绽的合成融入到环境中。(见例七)
电商设计的迅猛发展势头让某个以培训网页设计闻名的学校将授课内容全部转化为与电商相关的内容。因为电商网页设计待遇普遍比官网设计待遇高,当然这样做无可厚非。
但电商最致命的缺陷一个是在网页的规整度上,让初入行的电商设计师忽略了这方面能力的培养,而网页与平面不同其实是门精确到像素的学问,另一个就是过于追求视觉,这也是我过去常犯的错误,很多时候,我们在页面上看到的只是图片好看,他的速效性让更多设计师处于1,2天一个首页或者专题的境地,没办法做出好东西。
设计师内心的想法看不到,更多时候,我们看到的没有思路后的各种模仿,有时候,也是单纯的一些图片素材的累加。这真的能算好设计么?作为设计师,我们不能把练习或者模仿当成自己实力的体现,真正的提升,是当你没有网络,没有参考,你还能脑子里灵感一现,做出拥有你自己创意的设计.
好的设计是能与品牌化结合在一起的,能不断推出新的东西但围绕着一个核心主旨,不停在人们脑子里重复再重复,让人拥有深刻的记忆。
而不好的设计,就是同类化,当你看到行业内某个店铺的设计特别出众让你眼前一亮,你去模仿他家的风格,力求也达到别家设计师那样的技术,去实现那样的效果。这样意义缺乏的,除非你在人家现有的基础上还能进一步提高,有更多的创新,从模仿到超越。不然你永远只是他人的影子。(当然,新手还是在初期是从一步步模仿走来的,我这么说只是针对一些懒惰的,技术到了一定程度就不想去突破的人)
当然,我所能囊括的案例,我所了解到的知识也是有限的,在电商网页设计的了解可能比不上更多做这行的童靴,所以有什么没讲到位的地方,还望大家指正。
本文地址:http://www.tuquu.com/tutorial/di2658.html