视界·无界2.0:写给UI设计师的设计书(全彩)
上QQ阅读APP看本书,新人免费读10天
设备和账号都新为新人

1.7 大众对UI的误解

1.7.1 UI图标不是LOGO

首先,我们来普及一下LOGO是什么。LOGO是标志或者商标的英语Logotype的缩写,起到对拥有该标志公司的识别和推广的作用,通过形象的LOGO可以让消费者记住公司主体和品牌文化。网络中的LOGO主要是各个网站用来与其他网站链接的图形标志,代表一个网站或网站的一个板块。

我们经常会遇到过这样的情况:假如你是一名平面设计师,做APP的公司会对你说:“做一个UI。”假如你是一名UI设计师,做广告的公司会对你说:“做一个LOGO。”

当然,这种情况一般会出现在大企业、大互联网公司或者一些不太专业的小公司,老板和产品经理们会提出各种各样的要求,很多时候他们可能不懂甚至完全无法区分这些有什么不一样。的确,如今,LOGO的种类更加多样化,从品牌的LOGO到游戏的LOGO,再到产品的LOGO等,并没有区分得像以前那么细致,以至于很多步入社会的设计专业的毕业生们也不了解UI和LOGO的本质区别。

LOGO的定义可远远不只是好玩、有趣味性,它具有更深远的意义。在设计LOGO之初,就应该站在品牌战略的高度,为品牌设计具有一定包容性的标志,为品牌长远发展提供延伸的空间。LOGO的图形创造,要尽可能地简练并且易用,既要保证色彩传达精准、可识别、有寓意且有延展性,又要保证LOGO符合品牌气质,并且在各种环境下使用都不会失去稳重感。例如,在图1-19中,左侧是经过细心打磨的锤子手机“一步”功能的LOGO设计,而右侧是在得到了规则、规范的LOGO设计后,根据不同风格设计的图标。

图1-19 锤子手机系统中“一步”功能的LOGO与图标

黄金分割比(接近1.618,即两个圆形的大小比例为1.618∶1),是LOGO设计的要点之一,它并不是一个噱头,而是对设计进行规范,使其符合标准的一种规则。它是经过严格的思考和设计的,包含强烈的品牌寓意和未来的延展性,它需要考虑适配任何颜色、环境、使用场景等一系列问题。比如苹果的LOGO,它会给不同的人们以不同的联想:有的人会联想到水果,让人感觉很美味;有的人认为这个品牌在传达每个人都值得拥有的概念;有的人认为这是一个上帝的禁果,让人忍不住想要尝试。一个LOGO的诞生,可能需要一个星期甚至一个月、几个月的时间,同时它给人的想象空间是无限的。

目前国内不太能接受这种黄金分割比的LOGO制定规则,大部分人都认为没有实际用途,一个简单的图形需要这么复杂的计算吗?依据我们现在已有的文献,可能很难说清楚黄金分割比的发现和演变过程。

公元前6世纪,古希腊的毕达哥拉斯学派发现了无理数,也掌握了黄金分割比的一些规则。他所认为的黄金分割比是规则的、和谐的、最美的比例,符合这一比例的图形是均衡的,而这种均衡不仅仅体现在大自然中的物体上,人们还利用黄金分割比创造出多种多样的产品。其中,《设计几何学》中提到,大众最著名的甲壳虫汽车,就是按照黄金分割比来设计的。国外深厚的设计发展史都在不断地验证黄金分割比的重要性,认为设计不仅仅是随手画个圆或画个方块,而是需要经过精密的数学计算的。目前,国内大部分设计师都意识到了这一点的重要性,也在做自我的进化。

图1-19中右侧的图标设计,增加了趣味性,可以在网页或者海报、广告上使用,但是不能作为一个企业品牌的LOGO而延续。它属于一种提升品牌趣味性的设计,是随意的、好玩的、用于特定场景的。有的企业喜欢这种有质感的LOGO,甚至注册此LOGO,但是在使用上必然会出现非常多的颜色限制和环境限制,而且在做VI(视觉识别系统)规范时,也会受到约束,存在不便,因为必然会有平面状态下的使用规范。比如,我们制作一个宣传广告,其整体风格是绿色的草地,那么使用这样的图标还能被看清吗?此时就要改变颜色,但一个LOGO是不允许随意改变颜色的。

所以,不要让UI设计师轻易担任品牌LOGO设计,如果出现不了解此类规范的企业或者不靠谱的设计师,这对双方都是伤害。

1.7.2 UI不是原画

越来越多的插画师(也叫原画师)想进入UI设计殿堂,就像我之前说的GUI游戏界面设计师,他们拥有傲人的绘画功底和强大的美术理论知识。但是,往往很多人错误地以为他们画得越像,就是越厉害的UI设计师,这个理解是错误的。不可否认,手绘是UI设计师需要具备的重要技能之一,但不是全部。同样,只具备强大的手绘能力,未必会成为一名优秀的UI设计师。UI更倾向于计算机绘图,而计算机绘图有很多规则可循。手绘一千个鸡蛋,也不可能会有完全相同的两张,因为唯一性是手绘的特点;而计算机绘图,别说画一千个,画一万个也能完全相似,因为我们可以利用计算机的几何图形无限复制,相同性是计算机绘图的特点。

插画师更多地转入UI行业,主要是转入了游戏UI行业,它和产品UI有本质上的区别。很多游戏类和拟物类的图标及界面,大部分都是由插画师来完成的,制作过程相当于画了一幅画,然后将其置入一个圆角矩形中作为图标。但是这也具有局限性,复杂的设计只是一味地追求视觉效果,并没有太多的规范和体验上的问题。而UI设计更多的是规则的、规范的计算机图形设计,这是本质上的区别。

我们经常会看到APP中有闪屏界面,如图1-20所示,大部分都是由插画师完成的,而并非UI设计师。因为对于人物的造型及事物的空间构图来说,插画师更能把握好,这是需要长时间的绘画磨炼才能达到的。而UI设计师在这方面能力比较弱,大多数画出的人物等的比例不够协调、画面不够和谐,往往被迫设计一些闪屏,也因此降低了整个产品的品质。

图1-20 UC移动端浏览器闪屏(设计师:sisy_ss)

有一些介绍功能的闪屏——简单的图形和界面的介绍,如图1-21所示,这种相关的设计都是可以交给UI设计师完成的,而且UI设计师懂得UI设计的规范与规则,对于像素内对齐和良好的比例等细节有很好的驾驭能力,而这也是追求画面和画风的插画师不太注重的。

图1-21 百度贴吧的引导页设计

因此,如果有复杂的插画类设计,还是交给插画师来完成,请放过UI设计师吧,难道你想因为第一次进入产品看到并不美观的画面而丢失用户吗?

1.7.3 UI不是视觉网页

前面已经说过WUI的设计职责,这里我要更加详细地介绍一下。很多企业在招聘的时候,会写上招聘网页UI设计师,这是国内大部分网站都会写的招聘职位。的确,大部分UI设计师都可以设计网页,但是需要注意的是,网页设计师和UI设计师有本质的区别。网页UI设计师只是被各大招聘网站结合使用的一种称谓。那么,到底什么是网页设计师?哪些是UI设计师职责范围内可以设计的网页?

我们日常浏览的一些门户网站,例如腾讯、网易、新浪等,是可以交给UI设计师负责的,因为界面内的Banner(网页横幅广告)及功能按钮等细节上的问题,都是UI设计师的职责。不过网页有多种类型,有一些是UI设计师驾驭不了的,它们属于纯网页设计师的职责。

我们经常看到很绚丽的产品官网,这是网页设计师的杰作,而且是UI设计师无法达到的高度。比如我们看到的JEEP牧马人网站(图1-22),其中零碎的石头、背景的山峰、阳光和蓝天、车身及车身上的灰尘都是利用软件制作而成的,而并非真实拍摄的,更多的是网页设计师的功劳。同样有趣的是,作为网页设计师,使用的最重要的工具就是Photoshop,还要辅助使用C4D、Flash、3ds Max等;而作为UI设计师,需要掌握和使用的工具都与之不同。

图1-22 JEEP牧马人活动网站(作者为灰昼)

在网页设计中,通常我们需要什么就去寻找相关素材,然后直接拿来使用,但是在UI界面设计中,哪怕是一个常规的麦克风图标,都需要设计师自己设计并绘制,因为这需要对整体风格的把控,图标恰恰是设计师工作的重中之重。

电商广告设计是网页设计的一种,设计师的工作更多的是对产品图片的修饰,把产品展现得淋漓尽致,同样需要对摄影知识和Photoshop很熟练,包括人像精修、产品修图、创意合成,可以说要具有化腐朽为神奇的能力。“双11”期间天猫做出了49张创意海报,在各大网站和Banner中出现。由此可以看出,在保持天猫这个形象的同时,利用其他元素进行设计,将元素拼接组合是非常重要的技能之一,如图1-23所示。网页设计注重整体画面的风格,控制大方向,对于细节没有专注度。而UI设计师在设计网页的时候,更多的是专注每一个细节,比如一个小按钮甚至小图标,以至于我们看到很多UI设计师设计的网页看起来很“小气”,就是这个原因。

图1-23 天猫双11创意海报

所以,如果有专题活动网页及电商网页设计,请放过UI设计师吧,难道你希望看到一个好像放大好多倍的手机应用,并且满屏幕都是图标的细节,却没有大风格方向的图标设计吗?