代码改变世界

谈一谈“符合用户心智模型”与“隐喻”

2010-02-03 10:18  一醉而过  阅读(...)  评论(...编辑  收藏

文 淡月 摘自 淘宝UED 转载请注明出处 !

 

上季度咱们组一直在整理UED的交互设计指南,每周都会进行一次讨论,这实在是个有趣的事情,也会有很多意外的收获和提高。

前几周在讨论“符合用户心智模型”时,发现这个概念跟“隐喻”有些纠结不清,我理了理思路,试图进行一些解释。

不过在此之前,先讲一个故事吧:)

有段时间,老爸老是问我一个问题:“你们网站什么时候做完啊?做完了你是不是就得下岗啊?”

很囧的问题:)实在有点回答不来,在他的一再追问下,我只好说:“北京城修了多久您该知道吧。之前的咱就不说,就说这建国后,修了人民大会堂又修歌剧院,修了国家博物馆修北京博物馆,这鸟巢水立方,也才刚竣工,中央电视台那还修着呢,您说这北京城啥时候修完啊?”老爸点点头,再也不问了。

很显然,在我老爸的理解中,建设网站就好比在修一栋房子,不管多大的房子,也都有修完的一天,这就是他在这件事情上形成的“心智模型”。而我一开始,想通过向他讲述互联网的方方面面,来使他明白。这是典型的以“实现模型”为中心的做法,虽然这样做并没有错,可惜老爸在这个问题上,只想得到一个简单的答案,而不是成为一个知识渊博的人。所以,因为我最后打的比方,也就是我的“表现模型”,与他的认知和判断比较相近,他很容易就明白了这个概念。

这里衍伸出一个问题:我通过一个比喻,解决了这个问题,“比喻”是交互设计里常说的“隐喻”吗?那我究竟是用了一个“隐喻”还是“符合了他的心智模型”?

在回答这个问题之前,我们先弄清楚“隐喻”是什么:

作为交互设计师,我们的大部分工作,都是在做信息的可视化。“信息可视化”是一个很宏大的命题,往简单了说:你日常的工作,是不是都在将各种概念和信息,用视觉的方式最后呈现出来?

在视觉化的进程中,“隐喻”是我们常用的一种方法。比如,你设计了一款写日记的产品,为了让用户更容易理解,你画了一个日记本样子的IOCN来表示它。这就是一个隐喻,用户看到这个图标,就能知道这是一个什么产品。

弄清楚这一点,前面的问题就迎刃而解:“隐喻”是做设计的方法和手段,而“符合心智模型”是做设计的原则。方法有好有坏,但原则必须遵守。很多时候,我们通过“隐喻”使产品更靠近用户的“心智模型”。

将信息可视化,常用的方法有三种:实现为中心、隐喻、习惯用法。在之前的讨论中,我发现这几个概念其实也是容易混淆的,忍不住想再罗嗦几句:

各位同学还记得DOS时代,我们是怎么与计算机交互的吗?

那个时代,你只能在学习了一大堆计算机原理和语言后,才能对着黑乎乎的屏幕,做一些枯燥的操作。。。那是一个全面以“实现为中心”的时代,虽然我们都明白这很糟糕,但那时候的交互就是这样的。

后来,激动人心的WINDOWS来了,可视化的界面让我们很快就能上手操作电脑。通过各种各样的图标,我们知道了,原来“桌面”“硬盘”“内存”就是这个样子的啊!(实际上真是这样吗?)隐喻的时代全面来临了。

“隐喻”既然这么好,很多人都会产生“隐喻是用户界面设计基础”这一错误概念。实际上,“隐喻”有很大的局限性,比如我负责的“淘江湖”这个产品的时候,需求方曾经提出,希望能把界面直接设计成充满隐喻的“江湖”模样,古香古色,有山有水,有浓厚氛围。相信如果真的这么做了,是很危险的。首先,“江湖”是什么样?如果设计师理解的江湖与客户有很大出入,怎么办?再有,这样的界面扩展性一般都很差。而且,当用户做为新手时,他们也许会容易接受,但这毕竟是一款希望用户天天使用的产品,在用户成为资深用户时,冗余的界面将成为一种负担。

那“习惯用法”又是怎么一回事呢?让我们再回忆一下,你是怎样学会用鼠标的,怎样学会使用关闭按钮、滚动条、最大化按钮。。。。在现实世界中,这些东西都没有实际的对照物,我们必须经过第一次的学习,才能理解和掌握,所幸学习他们并不难,当我们学会并反复使用后,他们就成为“习惯用法”。在用户经过长期教育后,我们的交互设计,很多解决方案,都是建立在习惯用法之上。

你会发现,“隐喻”与“习惯用法”很多时候容易混淆,其实有个很简单的区分方法,在现实世界中有对应的东西,才叫“隐喻”。而所有的习惯用法都必须学习,好的习惯用法只需要学一次。

那如何让用户进行第一次的学习呢?在这里又要引出一个概念–“手动启示”。

人们有一种天性,看见合乎手指大小的东西,总要试着去按一按,点一点。比如你看见大门上有个按钮,你伸手一按,发现原来是门铃;当然也可能伸手一按,地板裂开一条缝,原来是陷阱。

不用担心人们不会去尝试用鼠标点击一些看上去可点的东西,虽然他们很多时候并不知道点击之后会怎样。而用户的第一次教育就是这样完成的。

以上是我的一些思考,大家随便拍砖,欢迎进一步讨论!

更多关于心智模型的文章:

《探索用户心智模型 》 

《用户心智模型在HCI里的应用——以搜狗浏览器为例》

《什么是心智模型》 

维基百科: 心智模型

维基百科(英文):Mental Model

《心流理论和设计》