文章列表
 
您正在查看 "设计" 分类下的文章

2010-01-23 18:47

原文:Common Visual Design Misconceptions

作者介绍:Luke Lebowski雅虎的首页设计架构师,是畅销设计书籍Web Form Design (2008) 和Site-Seeing: A Visual Approach to Web Usability (2002)的作者。

最近有一次机会让我重新反思了人们对“视觉设计”的几种常见误解。这些误解仍然普遍存在于很多高层管理者、产品领导者、工程经理及营销专家中。

有什么办法能够让设计师纠正人们通常对于“视觉设计”概念的错误理解?应该怎么去做,才能展示“视觉设计”的实质?

尽管视觉设计师在不同的产品领域和职业阶段会遇到不同的阻碍,但是对于“视觉设计”普遍存在三种误解:

1、 视觉设计只是把东西做得更好看

2、 使元素更突出,可以提升视觉设计

3、 可以将视觉设计分割成部分进行孤立地评估

观点1:视觉设计只是把东西做得更好看

尽管很少有人赤裸裸地要求设计团队只要把东西做得好看就好,但是长久以来,人们仍认为“视觉设计”就像是蛋糕上的糖衣一样,是在工序的最后阶段在产品上加的蝴蝶结,只是为了使产品看起来更吸引人一点。

也许这种观念源于工业设计时代大众对设计的初步认识。在那个时代,人们对产品的风格进行了各种尝试,有些风格在此之前闻所未闻。那时的工业设计师们如Raymond Lowey在改良过去呆板产品上做出了巨大的美学贡献,他们及他们所使用的方法得到了前所未有的吹捧。

显然,视觉设计可以提高产品的美感,但是它的潜力还不仅限于使东西好看。通过对元素进行视觉组织,视觉设计师可以将以下关键问题的答案传达给人们:

1、 这是什么?

2、 我可以如何使用它?

3、 为什么我要关心它?

让人们认识到这些对提高产品的有效性和可用性非常重要,尤其对交互性强的产品。我可以通过例子来说明这一点。

图1-图3表示某一个互联网应用的同一组基本功能。它们使用了相同的字体、颜色、渐变和图片,主要不同是元素在屏幕上的组织方式不同。这一不同引导出用户对该应用的三种不同使用方式。
图1:


图1中,该应用的呈现层清楚表明,这个应用的主要功能是查找客户的联系方式。其次,用户可能通过注释来删除、修改或者补充这些信息。

在图2中,重点是突出客户和公司之间的交流,其次,用户可以查看、编辑和删除联系信息。

图2:


最后,图3将重点放在了编辑客户信息上。而“查看联系信息”和“跟踪对话”这两个功能则被弱化了。

图3:


可以看到,同一应用的三种不同视觉组织形式,给用户提供了3种不同的基本功能:查看联系信息、管理用户反馈和维护客户档案。在这3种情景中,核心的视觉设计元素是相同的:相同的字体、颜色和图片。

很显然,视觉设计不仅仅是使东西看起来更好看。它在提升产品美感的同时,向用户传达了产品的核心功能——这是什么?我该怎么用?

观点2:能设计得更突出吗?

利益相关者通常要求设计师对某些视觉元素进行强化,从“把图标弄得大些”(说明:这是一国外网站的名字)这类网站的流行可见一斑。尽管这一观点有时能够帮助我们确定哪些是设计中最重要的元素,但它们同时也表明了人们对视觉设计的另一个误解:为了改进一个网站的视觉设计,你必须将东西弄大、弄粗、弄红,甚至在有些情况下,你得将东西弄得又大又粗又红。

但是,一个元素在界面中的相对重要性最终是由其周边的元素决定的。在一张白纸上划一个红圈,会得到相当强烈的注意。在10个粉红的圈旁边加一个红圈,这个红圈则不会突出。因此,如何突出重要元素是对整体设计进行管理的过程。它不仅仅是改变单一的页面元素,如果只为单一的视觉元素增加权重会改变界面布局的平衡,扰乱相关元素和主要行为之间的重要关系。

如果你按照每个利益相关人的要求,将他们关注的元素设计得更吸引人,最终的结果就是,界面上的每一个元素都在争夺用户的注意力,从而它们谁也别想被用户注意到。

比较图4和图5中的两个浏览器下载页面。火狐的首页将用户的注意力吸引在下载这一行为上,其他的内容如Thunderbird和 the Mozilla store都没有干扰用户。

图4


图5中,设计师想在Flock的下载页面上突出很多元素,最后设计师不得不在页面中放上四个“下载”:右上侧、左侧菜单底部、新闻板块和页脚。如果不是想强调那么多元素,Flock就可以像火狐那样,只需要一个下载按钮就可以了。

图5:


观点3:可以将视觉设计分割成部分进行孤立地评估

上文中提到的那些使设计只注重局部而不注重整体的因素,使得局部的改变也变得困难。然而,对设计师的反馈总是局限在局部上:能把logo放大吗?能改变头条的颜色吗?能换张图吗?

固然,这些反馈能够使设计师理解利益相关者和顾客想要的效果,但是它没有从整体上来考虑,而整体观是一个优秀的设计所必须的。

改变某个颜色可能意味着要重新考虑整体色调了,整体色调原有的对比度是设计师为了突出某些关键行为而准备的,现在可能不适用的;改变某张图片,可能意味着周边的元素也要被调整,因为原图所要的视觉效果已经不存在了;等等。

产品的整体视觉设计是对所有元素精心平衡的结果,它是为了向用户传达产品的有用性、可用性和用户期望值(desirability)。因此,如果一个设计师调整了某个元素,他/她需要对整个设计重新考虑,进行平衡。孤立的设计决策无法形成和谐的整体。

孤立地对基于网页的产品进行评估,更容易使产品受到损害。由于可以将设计拆分成几个部分进行测试,产品团队常将在局部测试中表现良好的部分加以整合,以为最后整合的效果也会很好。图6展示了孤立的设计决策可能导致的后果。

图6 ebay意大利首页


虽然ebay的这个头部在水桶测试(见译注1)中表现良好,Paypal的LOGO得分在焦点小组中的得分也比较高,首页相机的推广活动也得到了较好的点击率,但是这三个放在一起,就没有形成一个有效的设计,事实上,这个页面的很多元素在彼此竞争。

希望上面提供的例子能够说明对视觉设计的那些理解是错误的。但是要说服你的同事们和利益相关人相信视觉设计不仅仅是对设计风格的优化,不仅仅是使元素更突出,不仅仅是对局部设计的孤立调整,也许他们要亲自体验才能认识到视觉设计的潜力。

译注1:水桶测试是一种常有的测试方法,它度量不同的设计如何影响网站的各个维度。其基本前提是,同时运行两个相同版本的页面或一组页面,来测量它们在点击、浏览、事务处理等方面的不同。

 
2009-11-26 19:43

可以看看facebook是如何重视用户和用户需求的。

  • Universal: our design needs to work for everyone, every culture, every language, every device, every stage of life.
  • 通用性:我们的设计是为所有人、所有文化、所有语言、所有设备、所有生活阶段而做的。
  • Human: our voice and visual style stay in the background, behind people’s voices, people’s faces, and people’s expression.
  • 人性化:我们的声音和视觉风格保留在背景中,它们存在于用户的声音、用户的脸庞和人们的表情之后。
  • Clean: our visual style is clean and understated.
  • 清楚:我们的视觉风格是清楚和容易理解的。
  • Consistent: reduce, reuse, don’t redesign.
  • 一致性:减少,再用,不要重新设计。
  • Useful: meant for repeated daily use.
  • 有用:针对日常的使用。
  • Fast: faster experiences are more efficient and feel more effortless.
  • 快速:更快的体验是更高效的,花费更少的精力。
  • Transparent: we are clear and up front about what’s happening and why.
  • 透明的:我们将清楚的表现出发生了什么和为什么这样发生。 (对于这一点,经常说的一个词是visibility, 可见性)
 
2009-10-15 23:15

10条法则

1、减少(Reduce):达到简单的最简单方法,就是用心割舍。

SHE:缩小(Shrink)、隐藏(Hide)、赋加(Embody)

缩小:

简单就是要让不起眼的东西,带来意外的惊喜。

把东西做小一点,不见得能把它们变得更好,但是面对小东西,我们通常比较大量。大东西让人那肃然起敬,小东西却让人怜惜。

只要是能让人更容易接受复杂东西的做法,都是一种简化,即使这是一种欺瞒。

隐藏:

缩小形体,能够降低人们对产品的期望;隐藏复杂功能,则让使用者主动掌控自己的期望。(瑞士军刀、电脑界面)

赋加:

赋加的做法属于商业思考下的结果,而不是设计或者科技出发。这种做法可能是加入更好的材料和更精细的做工,也可能是传递一种感觉。(奢侈品)

2、组织(Organize):妥善组织能使复杂的系统显得比较简单。

SLIP:分类(Sort)、标示(Label)、整合(Integrate)、排定先后次序(Prioritize)。

人是组织的动物。看到任何东西,我们都会本能地将它们加以组织分类。(Ipod)

眯着眼睛,才能展开视野。

3、时间(Time):节省时间会让人感觉简单。

放弃选择的自由,让机器替你选择,是缩减时间的一种激进做法。(Shuffle, Amazon书店)

隐藏时间。

进度条。

告诉人家他们还得再等多久。

4、学习(Learn):知识使一切变得更简单。

BRAIN:

基本(Basic)是起步。

经常重复(Repeat)。

避免(Avoid)制造挫折感。

用实例启发(Inspire)。

不要(Never)忘记重复。

不论简单或复杂、合理或不合逻辑、国内或国际、科技狂或畏惧科技,最成功的产品设计是那些和学习与生活连接最深的东西。

5、差异(Differences):简单和复杂相辅相成。

6、背景(Context):简单的周边事物决非无关紧要。

要合成“简单”的环境体验,必须先注意到那些表面上似乎毫不想干的一切事物。

7、感情(Emotion):感情越多越好。

某些东西总是越多越好:更多的关怀、更多的爱、更多有意义的行动。

8、信任(Trust):我们相信简单。

9、失败(Failure):有些事物不可能简单。

简单的缺失1:缩写太多。

简单的缺失2:不够高明的格式塔。

最后的一项缺失:太多法则。

10、单一(The one):简单是减少明显的,增加有意义的。

3个要点

1、远离(Away):只要挪得远远的,多就会显得少。

2、开放(Open):开放会比简化复杂。

3、能源(Power):少用,会得到更多。

 
2009-09-09 19:54

今天朋友给我讲了一套儿童书,叫《我的感觉》,一共七本,分别是《我好难过》,《我好嫉妒》,《我好生气》,《我想念你》,《我会关心别人》,《我好害怕》、《我觉得自己很棒》。觉得是设计得非常好的儿童书,也很适合我们这些感觉细胞已接近闭合的大人们阅读。决定买一套送给我们家小侄儿,自己也可以沾光。
以下是《我觉得自己很棒》的摘录,什么时候我做产品能够到这种境界呢?不管怎么样,我今天也觉得很棒。

我觉得自己很棒。
有些人爱我,爱的就是我这个样子。
我不用和其他人一样,如和他们一样高,或是做同样的事情。
我就是我,这样很好。
我是某些人的朋友。
有些人喜欢我,喜欢的就是我很棒。
我不必事事第一。
我也不必是最好的。我所要做的只是尽我最大的努力。
有些事对我来说很容易;有些事对我来说很难。但是这些都不要紧,因为每个人都不一样。
我画的画,或我做的手工,和别人的都不一样。
有些人就是喜欢我画的画,喜欢我做的手工。
我是某些人的小帮手。
帮助别人的时候,我感觉好极了。
我喜欢交新朋友,我还喜欢学习新东西。
如果我没做对,我会再试一次。
我觉得自己很棒。

 
2009-07-07 8:00

“我们越来越希望我们设计的产品能够通过直接的社会参与,更直接地影响人们。那些支持全球社会创新进程的机构,例如Rockefeeler基金和Bill & Melinda Gates基金会对这些新的方法感兴趣。但是很多设计师在追求这一新的方法上表现得很犹豫。如果同意直接的行为设计,就意味着要踏出传统的以用户为中心的设计框架(UCD),而如今,UCD是大多数专业设计的基础。”

UCD的中心思想就是设计师需要深入理解用户需求(这些需求是通过观察得来的),并在此基础上设计体验。UCD建立在功能和可用性导向的哲学基础上,同时它也逐渐考虑更多的用户体验维度,包括情感需要和动机。

当使用UCD的方法时,设计师通过产品和服务来影响行为和社会实践。设计师在研究和理解用户行为的基础上设计出这些产品。同时,运用UCD时,我们鼓励设计师不将其自身的价值观加到体验上。

UCD大受推崇的同时,它的中立态度也受到的质疑。有关持续性的问题和社会变化使得设计师不能不重新考虑他们的超然身份。

Robert Fabricant VP of Creative of Frog Design)撰文探讨了设计师如何改变用户行为。在文中,他介绍了3种新的设计方法:说服设计(persuasion design)、催化设计(catalyst design)和行为设计(performance design)。

查看更多

 
2008-03-06 22:44
 
2007-09-21 15:39

User Interface Design and Usability

该页面包含了人机交互和用户界面设计相关的站点,能够在用户界面设计上对您有所帮助。链接包括公司网站,工业GUI和网页风格指南、有人机交互专业的学校和用户界面相关的活动。

This is page contains links to HCI and User Interface Design related web sites that may help you with User Interface Design. Links include corporate sites, industry GUI and WEB style guides, Universities that have HCI or User Interface Design related activities.

 
 
   
 
 
文章存档
 
     
 
最新文章评论
  

hehehe
 

回复charleszhao816:可以在新浪下载,有问题再联系我吧http://ishare.iask.sina.com
 

这本书我找了很久,请问能否发到我的邮箱:charleszhao816@hotmail.com;谢谢!
 

不错的文章
 

恩,关注核心业务很重要,是生存和发展的根本。今天你正在努力挽救的核心业务,最初
   
帮助中心 | 空间客服 | 投诉中心 | 空间协议
©2012 Baidu