交互行为三部曲

九月 23rd, 2007

之所以会出现“交互设计”这个词儿,很大程度上是alan cooper想区别于以往的界面视觉效果设计,重新定义一下基于电脑的软件设计工作。既然是区别于原先的界面设计,我想,可以简单的不准确的概况一下这个概念:交互设计=界面设计+行为设计。界面的设计无须多说,行为的设计就有很多话题了。

之前的很多小文里也经常会提到有关行为设计的问题,几天前如厕时偶然意识到关于行为设计的一些问题联系起来考虑会更有助于设计。

啥是网页上的行为?看到一个链接,左键点了一下,打开一个新页面。
当然行为也有更复杂的,填写、提交一份注册资料;删除我日志中的垃圾评论;打开一个视频,调整音量,全屏观看…

关于这些行为,我们可以分为三个步骤,并对每个步骤提出相应的准则:
第一步.操作前,操作可识别;结果可预知。
第二步.操作时,操作有反馈。
第三步.操作后,操作可撤销。
(文字排列的还挺整齐的,怪像诗的哦。好吧,借以沉痛悼念即将远去的诗人:白龙。)

如果你深谙设计之道,恐怕已经知道我说的这几点是什么了。那么本文看到这里对你来说已经足够了。将这些设计问题联系起来考虑,在设计一个行为的过程中能有意识的考虑这一系列问题,应该会有助于你的设计。
阅读全文 »

浏览量:124,503 views 28 条评论 »

取舍问题

八月 26th, 2007

“有用户需要这个功能啊…”这个说法永远成立。每次听到这句话通常就意味着产品中又要多加一项功能了。在满足一部分用户更多需求的同时,使得另外一部分用户使用又更困难了一些。因为功能太多了,这个产品就更复杂了,只需要简单功能完成简单任务的人当然希望少些干扰。

添加更多的功能会使一部分人更爽而另外一部分人更不爽。通常在讨论的时候,会说,这是个trade off(在两者之间取舍)的问题。被这样定性之后,基本上就剩下掷硬币拿主意了。这是个取舍问题,但有些取舍问题只能靠掷硬币,而有些则不是,嗯…还可以扔鞋的…

鉴于在会议室中扔鞋或者硬币都有失斯文,我们不得不找些更体面的办法。要决定这个取舍问题只要解决一个问题就可以了:上面提到的“一部分人”和“另一部分人”都是谁?之后,我们就可以很从容的判断了,我们的产品是要讨好“一部分人”呢,还是要讨好“另一部分人”?

Alan.cooper的书里把用户分为三类:新手,中间用户、专家。我在这里只想说互联网产品,对用户的分类似乎可以更简单一点,只分为新手和老手即可。初来乍到的是新手,如果他们持续的使用这个产品则可能会转变成老手。这是套搬Alan.cooper三类用户的原理。
阅读全文 »

浏览量:117,043 views 22 条评论 »

大头贴改版设计总结

八月 8th, 2007

大头贴是QQ空间里的一个照片合成的小工具。让用户将自己给自己的照片加个画框合成一个形象照。07年6-7月,大头贴进行了重新设计,改善了之前的一些设计并添加了一些新功能。在此,将这个重新设计的过程总结下来,通过这个实例来阐述愚下对交互设计的一些理解。

改版面临的问题一:旧版设计的缺陷

旧版大头贴有一些设计上的缺陷。我们可以通过界面截图了解一二。

默认首页(照片合成页):
1.gif
阅读全文 »

浏览量:118,959 views 26 条评论 »

他想要什么?

六月 19th, 2007

先来看两个实际的问题:

第一个问题:
uploads/200706/19_233353_1.gif
点击标题,不是进入这篇文章,而是进入“图领风骚”栏目,如下图:
uploads/200706/19_233907_2.gif
这篇文章属于这个“图领风骚”栏目,但是在第一屏看不到这篇文章。
尽管还有不少人不认同,我还是觉得:这是一个简单的错误。

第二个问题:
uploads/200706/19_233927_3.gif
uploads/200706/19_233948_4.gif
点击了分类中的“MP3”,进入的页面中,第一屏满满当当的显示了“MP3”分类的下一级分类,第二屏才开始显示所以属于“MP3”分类的商品列表。
阅读全文 »

浏览量:113,066 views 29 条评论 »

五星级的厕所

五月 6th, 2007

uploads/200705/06_031415_.jpg
这张照片拍摄于一家五星级的酒店。照片中的门是男洗手间的门。门的左上角(面对门时)有一个挺大的圆形金属标志,上面画的是个gentleman,表示“男”,很有品味。或许是怕不够清楚,在这个gentleman上面又加了个十分标准的标志—小红人。

这样的指示可谓够全面了,也够有品味了。但是,我在这个楼道里停留的十几分钟内,男男女女的大约有5,6位来找洗手间,几乎没有一位能找到。

问题在于位置不对。gentleman和小红人都没放在门上。

不需要进行目标用户的调研,我们也可以描绘出人物角色和场景:XX岁的XXX,参加好友的婚礼,席间饮啤酒若干瓶,内急,需“洗手”。他来到这个楼道里,XX年的社会生活经验告诉他,洗手间应该是一个房间,并且必定有个门。强烈的自然召唤促使他不顾一切的找到那扇门,而门旁边的装饰画暂时恐怕没心情去欣赏了。

情景大概是这样了。找不到洗手间也是自然的了。

说到这里,我自然的想到了我的这个blog。(看到厕所就想到网页,这似乎不是头一回了。)
阅读全文 »

浏览量:120,990 views 34 条评论 »

web2.0是互联网上的现代主义

四月 21st, 2007

工业革命之前,设计师通过手工制作为少数权贵服务。十九世纪末二十世纪初,随着新技术的兴起,工业化大生产要为更广大的人民大众服务,需要设计出造价低廉、实用、美观的产品。陈旧的设计观念已经不能满足这样的需求了。仅仅是在组装好了的火车头上雕刻一些花纹是远远不够的。

以建筑设计为例,要让大众都能享受到工业革命的成果,需要建筑造价低、易于维修,室内宽敞、明亮。现代主义设计师大量使用了玻璃幕墙、混凝土预制件建造出了大批造型简单明快,实用性强的建筑。由注重实用性引发出的现代主义设计创造出了明显区别与以往的鲜明风格。现代主义设计思想影响深远,直至今天仍旧随处可见。小到ipod shuffle,大到北京的后现代城,都或多或少的带有现代主义风格。
uploads/200704/21_012628_ipodshuffle.jpg
Ipod shuffle

uploads/200704/21_012717_.jpg
北京后现代城

现在主义认为设计是个理性的创造过程,否定了各种古典主义中的繁复的装饰。然而,现代主义设计所造就出的作品却往往是冰冷的,缺乏人情味的。于是出现了“后现代主义”、“反现代主义”等等更人性化的设计理念。
阅读全文 »

浏览量:112,230 views 32 条评论 »

按“右箭头”按钮,往左移

二月 27th, 2007

uploads/200702/27_233541_1.gif
上图中,点击“右箭头”按钮,缩略图列表应该往左移还是往右移?

稍做尝试我们便会发现,点击“右箭头”按钮,列表向左移动是更“习惯”的,也是比较普遍的做法。比如下面几个例子:
uploads/200702/27_233623_2.gif
news.yahoo.com

uploads/200702/27_233639_3.gif
www.6rooms.com

看过了这种滚动的缩略图列表,再来看一下电子地图:
uploads/200702/27_233651_4.gif
map.baidu.com
按“右键头”按钮,地图是向左移动的。

再来看视窗界面:
uploads/200702/27_233701_5.gif
视窗界面中的滚动条,按“右箭头”按钮,界面向左移动。
阅读全文 »

浏览量:115,351 views 14 条评论 »

关于自动更新

二月 24th, 2007

前些日子,danger 说,当他打开浏览器时发现google toolbar已经自动更新成更高的版本了。没有询问,没有提示。这让他有些诧异。不过,反过来想,如果类似的操作总是先询问用户,似乎也挺讨厌的。那么,到底是事先询问一下呢,还是直接帮用户搞定呢?

很多的互联网产品中都会遇到这样的问题,比如,一个在线杀毒软件,是否要自动帮用户更新病毒库?自动的更新似乎应该是件好事儿,免去了很多手工的操作。但是,在没告知或询问的情况下就自己行事了,似乎又有些问题:没有给用户自主的权力。试想,当我打开电脑,联上网,电脑自己就开始了很多动作,我不知道它都在干些什么,后果会是怎么样的,也不知道如何才能让它停下来。嗯…我想,我会有些害怕的。
阅读全文 »

浏览量:111,737 views 22 条评论 »

拆掉窗上的把手

十二月 31st, 2006

uploads/200612/31_220652_1.jpg
这是公司吸烟室里的窗,为了避免宝贵的烟雾从这里流失,窗被封了,是用胶粘住的。虽然有很大的提示,但是,还是被人强行打开过。那时,这里是有把手的,象其它窗一样。后来把手被拆掉了,不再有人试图去开窗了。

之前虽然也有很醒目的文字提示,但是还是有人要开窗,因为上面有个把手,有把手意味着可以扳动。即使有提示,那个试图开窗的人还是会给自己想出一些看似合理的解释,比如,“是不是有人恶作剧?”“是不是说,不建议打开?其实,打开也不要紧的”……

之后拆掉了把手,不再有人去尝试强行打开了。既然不希望用户去操作,那么就不提供操作手段。仅仅是告诉了用户正确的信息还不够,还要避免出现不正确的暗示、引导。
阅读全文 »

浏览量:186,819 views 42 条评论 »

5%?

十一月 19th, 2006

前不久看到一篇文章《web设计95%是排版》,标题表达的很清楚,95%,那么,美术设计(或者称为图形设计、GUI…总之,是关于色彩、背景图、图标…的设计)只有5%的重要性吗?我们的美术设计师就这么点儿价值?

我们目前的工作中,界面原型基本上确定了网页的排版,而界面原型是由交互设计师完成的。看到这个95%的观点,我暗自欣欣然。然而,我想,这个95%的观点有待商榷。

交互设计目前的主要任务是可用性,所以排版很重要。
交互设计的任务包括:
1.创造出高可用性的界面;
2.让界面有良好的体验-让用户在使用过程中有愉悦感、成就感,感觉到被尊重…

这里所说的交互设计是指创造出用户界面以及相应的交互操作的整个设计,并不是仅仅指一些公司中被称谓交互设计师的那些人所作的特定工作。也许,您是一位美术设计师,您设计了一个表示下载功能的图标,这个图标能让用户更快的找到下载功能。您的工作也对提高可用性有贡献。因为,您设计的图标使得用户,在“找到下载功能-点击下载”这个与网页的交互过程中,效率更高了。
阅读全文 »

浏览量:19,833 views 28 条评论 »