文档介绍:UI设计:界面微质感探究GUI的历史一直都离不开隐喻,而这种设计手段的优劣己经有越来越多的辩论。那么时至今日,这种设计方法是否已经过时?我们是否有更好的方式?传统与新风格将怎样影响着我们?这些疑惑不禁引发了笔者的思考,因此也就有了下文。一、隐喻隐喻作为一个主流的设计方式广泛运用在界面设计中,它的历史可以追溯到GUI的创造,经典的例子便是桌面、文件夹、垃圾桶…这些老生常谈概念。因为源于真实生活,隐喻的天然优势便是利用熟悉感帮助用户理解上手,并带来亲切感。虽然常被简单认为是模拟现实世界中的物体外观(即拟物),隐喻其实是一个综合的手段:包括视觉层面的拟物;行为的模拟(常利用动画效果加强);以及对整体概念的利用。(一)先说拟物。众所周知,苹果已经将其演绎地炉火纯青。先不说macosx±各种材质和复杂光影的写实图标,曾在知乎上看到一个例子:在ios6上滑竿的金属圆形按钮不仅模仿了金属纹理,倾斜手机时还会像真的金属一样改变光泽的角度(见图1)。苹果的拟物己经达到了对细节的精确追求,暂且不论这种极致求真的细节对体验的提升到底有多大意义,但它符合苹果所追求的品牌视觉风格。在一个追求真实的原则下,那么任何对真实细节的提升都是值得钦佩赞许的。(二)再说行为隐喻。行为的隐喻同样来自真实世界,但不像拟物那样显而易见,它伴随着操作发生,口然而然。如下图滚动条的例子(见图2),当网站内容的篇幅达到一定的程度,在阅读时往下翻滚时滚动条会旁边会出现剩余篇幅的气泡提示。对比于告知还剩下多少字,预估还剩下多少阅读时间就非常符合生活****惯了。类似的还有kindle底部的阅读提示。IMINUTELEFT图2:来自iA)相较与苹果的Skeuomorphs(在这里将其译作拟物/拟真,有兴趣可口行移步wiki),Metro设计原则坚持极简、内容优先,强调排版、动态和真实的数字场景,与之产生的设计语言延伸到视觉风格便是不再利用Skeuomorphs,取而代之的是高度抽象的视觉符号和一再强调的信息,这无疑是一个显眼的革新(当然Metro的革新远不止于表面)。那么真实的数字场景是否与隐喻不再关联?回想一下win8的边缘交互支持上下左右滑动手势,在真实世界中人们在一个工作台上就可以完成多项工作,所需要的东西顺手颉来而并非只能在卧室看书或只能在书房写信。由此可见如果要完全脱离真实世界去构建一个全新的世界观并不现实,事实上,数字时代的隐喻更为深入和抽象了,体现在行为、逻辑,甚至世界观,所以才有真实这个前缀。当然深入到一定程度把它们称之为隐喻并非那么合适了,但的确曾是以隐喻为起点的。二、信息之外Metro一再强调信息,它们才是用户关注的内容。因此界面屮省去了一些控件代替以手势响应,而不能省略的也采用抽象符号。与此相反,传统的系统和应用常会有一个容器包裹在信息之外,镶嵌其间的控件图标在视觉上做了不同程度的刻画。于是在新旧观念的冲击下,信息之外的部分便开始暧昧不清了。有人尖锐指出,这些信息以外的装饰虚伪幼稚(详见JamesHiggs的。听到装饰,不少人开始要冒汗了。经历了现代主义的洗礼,如今装饰一词变得低三下四。但是阿道夫路斯(AdolfLoos)的“装饰即罪恶”也是有其上下文情境的,何况装饰在视知觉审美体验屮的地位无法忽视。冋归之前所提,关于内容本身如何界定还是一个问题。Metro认为信息才是内容,其沉浸式是沉浸在信息的海洋屮。而在传统的界面我们可以认为那些承载信息的容器环境也是内容的一部分;因此,ios的沉浸感强调的是整体氛围的融合。这样看来,信息之外的内容并非纯装饰。不过随之带来的问题主要有两个:效率与风格。关于效率。纯信息的展示更为高效,帮助人们在繁忙的生活和海量的信息中更快得达成目的,是工具化的。而对于环境的渲染更适合调动情绪或者传达某种生活的态度,例如游戏界面。而在更多的实际运用中,设计上常会有各种折衷。至于风格(style)o则属于审美的范畴而并非道徳,审美涉及到品位,因人而异,并且总是与时代和历史相关。打个不甚恰当的比方,如果将GUI产生之前比作原始时代,那么拟物和Skeuomorphs更像是古典时期,也难怪有人说metro是交互设计的包豪斯运动不过历史总是螺旋前进而非简单直线,就算“大势已去”也总会存在各种回潮。回想我们现在所处的语境,也许各取所长会是比较好的选择。三、微质感提出微质感的概念便是这种在效率和风格之间的权衡。所谓的微质感是区别于Skeuomorphs的超质感和Metro高度抽象化Z间的中间层次。微可以理解为微弱/微小,微乎其微。微本身是一种可选的程度而非定量,但这个程度并不宽广,否则就失去了个性和品牌意义。(一)克制微意味着尽可能少的添加便达到目的,质感具有隐喻的意味。也就是说灵活得运用一点隐喻