1700424220
1700424221
▼首先,它们遵循的是一条流畅的路径。如果人们评论一个设计是“忙碌”或“拥挤”时,这表示这个设计确实没能顺利地引导他们在页面上移动。他们的眼睛在各种各样的元素之间跳来跳去,所有的元素都在试图引起他们的注意。
1700424222
1700424223
▼其次,在不需要用太多细节来吓倒用户的前提下,它为用户提供有效选择的、某种可能的“引导”。就像我们一直在说的那样,这些引导应该支持用户试图在此刻通过与产品交互去完成的某个目标和任务。也许更重要的是,这些引导不应该分散用户对那些“能完成目标的信息或功能”的注意力。
1700424224
1700424225
用户在页面上的视线移动并不是随机的。它是一种所有人类共有的、对于视觉刺激而产生的、一系列复杂的原始本能反应。对于我们设计师而言,非常幸运的是,这些反应并不是完全无法控制的—数百年以来,我们已经发展出了各种各样的有效的视觉手段,来吸引或分散注意力。
1700424226
1700424227
1700424228
1700424229
1700424231
用户体验要素:以用户为中心的产品设计(原书第2版) 对比和一致性
1700424232
1700424233
在视觉设计中,我们用于吸引用户注意的一个主要工具就是对比(contrast)。一个没有对比的设计,会被看成一个灰色的、平凡的东西,导致用户的视线四处游离,而无法解决任何特别的事情。把用户的注意力吸引到界面中的关键部分,对比是一个重要手段,能帮助用户理解页面导航元素之间的关系。同时,对比还是传达信息设计中的概念群组的主要手段。
1700424234
1700424235
当一个元素在设计中的显得与众不同时,用户就会注意到。这是他们不能控制的。你可以利用这个本能的行为,来使用户注意到那些“真正需要从这个页面的其他元素中突出的东西”。在网页界面上的错误提示通常会被融进页面的其他元素中;通过给文本一些不同的颜色(比如说,红色)或用一个醒目的图形将它们凸显出来,就能让整个界面完全不同了。
1700424236
1700424237
1700424238
1700424239
1700424240
一个视觉上的中性布局(左上),没有任何一个元素突出。对比可以用来引导用户在页面上的视线(右上)或将他们的注意力吸引到几个关键要素上(左下)。过度的对比导致了混乱的视觉(右下)。
1700424241
1700424242
不管怎样,这些工作的总体策略是,让“差异”必须足够清晰,用户要足够分辨出某个设计选择是特意要传达一些信息的。当两个设计元素的处理相似又不太一样的时候,用户会就会困惑。“为什么这些会不一样?它们本来是一样的吗?也许只是弄错了。还是我应该在这里注意到什么东西吗?”而事实是,我们希望这两者都能抓住用户的目光,并且让他们认为这是有意而为之的。
1700424243
1700424244
在你的设计中保持一致性(uniformity)是另一个重要的组成部分,它能使你的设计有效地传达信息,而不会导致用户迷惑或焦虑。“一致性”在视觉设计的许多不同方面都会起到作用。
1700424245
1700424246
将视觉元素的大小保持一致的尺寸,这可以使你在需要的时候把它们更容易地重新组合成一个新的设计。举个例子来说,如果你在导航中使用的所有图形按钮都是同一个高度,那么它们就可以在需要的时候被混合并匹配,而不会形成一个布局杂乱或要求重新设计的图形。
1700424247
1700424248
基于栅格线(grid-based layout)的布局是来自平面设计的一种技术,是一种对网页也同样有效的技术。这个方法通过使用“母版”来确保设计的一致性,各种布局都是根据这个模板来创建的。不是每一个布局都要使用栅格的每一个部分(事实上,大多数的布局可能只会用到很少的一部分)但是每一个元素在网格上的位置应该统一和一致的。
1700424249
1700424250
1700424251
1700424252
1700424253
创建一个栅格来指导布局工作可以保证一致性而不会牺牲统一。
1700424254
1700424255
不管怎样,由于设备、屏幕尺寸和屏幕分辨率千差万别,把栅格应用到屏幕交互式产品上不会像平面设计一样简单。你很容易就掉到“坚持使用栅格系统”的漩涡之中(或者任何一种可以保证一致的标准)甚至在它们根本就行不通的时候。在没有设计标准的情况下进行工作是不好的,但是教条地遵守设计标准,而不顾你适当的需求就可能会更糟。
1700424256
1700424257
也许产品采取了一个在栅格被开发出来的时候没有人能想像出来的新功能;也许这个栅格从一开始就不怎么行得通。不管原因是什么,重要的是,你要能认识到什么时候应该重新考虑设计系统的基础是什么。
1700424258
1700424259
1700424260
1700424261
1700424263
用户体验要素:以用户为中心的产品设计(原书第2版) 内部和外部的一致性
1700424264
1700424265
由于网站被生产出来的方法通常是在企业内部的、其他进行中的设计中,被逐渐、临时、独立生产出来的,所以它们的视觉设计的一致性已经被折腾得千疮百孔了,它们的毛病一般会有以下两种形式:
1700424266
1700424267
▼内部一致性的问题。这是说,在产品的两个不同的地方反映了不同的设计方法。
1700424268
1700424269
▼外部一致性的问题。这是说,这个产品没有在同一个企业的其他产品中,反映出被使用的、相同的设计方法。解决“内部一致性”问题比较好的办法,是建立在对网站框架的深刻理解上的。其中的关键在于,确定有可能在产品各种各样的界面、导航和信息设计等不同环境中反复出现的设计元素。在进行设计之前,从这些不同的环境中将每一个设计元素独立出来,通过这个方法,我们就可以更清楚地看到困扰我们的小规模问题,而不是被环境所造成的大规模问题分散了注意力。与其一次又一次地设计同样的元素,还不如像这样只设计一次,然后将这个设计方案应用到整个产品中去。
[
上一页 ]
[ :1.70042422e+09 ]
[
下一页 ]