你的朝圣路

以前,我认为我们,所有的我们,包括那些曾经的我们、现在的我们和将来的我们,是一些怀着梦想,扇动着破烂的翅膀妄想飞到云端的傻瓜,是一些特别的人。现在,我不这样想了,我们只是千千万万人中的几个,并没有什么特别意义。

贫穷和自尊是两码事,根本就凑不到一块去,就如同富人同愚蠢一样。事实证明,再傻逼的富人也能把最聪明的穷人支得团团转。

以前我总有个错觉,从我个人方面,我总觉得我和阿莱之间有一个看不见也并未说出的秘密契约:即一切争执都是暂时的,终归我们总会走到一起。

不过阿莱结婚这件事触动了我,这时我才发现,所谓人的感情是一个多么不可靠的东西,个人意志又是多么的可笑。

于是,我心中关于这个世界的一切是非曲直发生了动摇,自信心也大受打击,由此,不免自暴自弃,在我抽大麻或看书时,更感到所谓人类的种种行为是多么不可理喻,其欲望是多么飘忽不定,其生存理由是多么没有依据,而其存在又是多么虚幻。

回家的路上,我第一次感到,我们对别人的好奇心消失了,我们也不愿向别人提及自己的苦闷,我们分头流落到自己的一角天地之中而羞于见人,我们对比较也失去了兴趣。

也就是说,我们都长大了。

阿莱,并不是我爱你这件事本身叫我痛苦,而是另外一件事,即你仍旧存在着这件事,想到你我共同生活在世间我就如坐针毡。真讨厌,你有自己单独的心,单独的呼吸,单独的行动,这一切叫我痛苦,叫我为你叹气,叫我伤感。

阿莱,我将叫着你的名字游荡在北京大街小巷,我将叫你跟我一起走,我将带着你穿过漫长的时间,我将叫你闭上眼睛,叫你忘记害怕,叫你得到平静,叫你感到幸福。

不可以做朋友,也不可以做敌人。没有谁对不起谁,只有谁没珍惜谁。祝你幸福!

MySpace点CN,没有惊喜

传说中的MySpace中国在凌晨上线,但是我在午夜零点后,刷新了那个干巴巴的页面N次,仍然面对着毫无生气的“中国领先的WEB2.0网站”,实在忍不住了,睡觉,心里对MySpace中国已经不爽~~~

果然,在我第一次(今天才看到,那天凌晨的守候无果后,竟然忘记了)看到M点CN的身影后,就一怔:这不就是把洋文换成了中文么?这个,就算中国领先的了?

细细一品味,实在是大失所望:

1、Top导航变化太离谱。

首页倒还好,可是一跳转到二级页面,Logo竟然不翼而飞,一个大大的Banner在那里闪来闪去。首页本来靠右上角的”国际 帮助 注册”在各个二级页面竟然位置也飘忽不定,忽左忽右的,着实令人难以理解。

MySpace Top

2、最最基本的交互细节-链接的处理及其糟糕。

仅仅在首页,就有多达数十种链接样式。搞的我实在不知道那些是可以点击的,那些是不能点击的。而链接,是网站给于用户的导航仪,引导用户去那儿,我可不能像地雷兵一样的这里点点,那里点点的去实验那里走的通啊。

Links

上图中,“忘记密码”和“高级搜索”,相隔很近,链接样式却不一样,实在离谱。同时,不理解为何“国际”在首页上加了个地球的图标,在别的页面却又是光秃秃的呢?

看看下图中,你猜猜那几个是可以点击的链接呢?

Links quit

3、登录进去后,“我的个人首页”布局实在是~~~奇特。可能是某种后现代艺术派的风格吧;

456789……

对不住了。我实在没有信心去使用这个中国领先的网站了。(我知道,写文章才这么点,实在浪费您的时间。但您也要体谅我啊,我要是在体验下去,还不吐血啊。再者,人家M点CN可不在乎这些问题呢…)

M点CN的风格完全是照搬了外国的样子,在排版布局结构上完全不适合中国人的欣赏水平和使用习惯。而这点,是国外领先网站进驻中国市场的一块硬伤。

想想当年的Ebay,我登录过几次,怎么看都觉得网站像是没有完工似的。那是完全汉Ebay国际网站的产品,我想,那也是他败给淘宝的很重要的一个原因吧。

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

转载自臭鱼,本文中的基本结论是在和臭鱼的讨论中得出的。特转载记录于此。

/uploads/200702/27_233541_1.gif

上图中,点击“右箭头”按钮,缩略图列表应该往左移还是往右移?

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

/uploads/200702/27_233623_2.gif

news.yahoo.com

/uploads/200702/27_233639_3.gif

http://www.6rooms.com/

看过了这种滚动的缩略图列表,再来看一下电子地图:

/uploads/200702/27_233651_4.gif

map.baidu.com

按“右键头”按钮,地图是向左移动的。

再来看视窗界面:

/uploads/200702/27_233701_5.gif

视窗界面中的滚动条,按“右箭头”按钮,界面向左移动。

按“右箭头”按钮,应该是往右移啊?!

是的,按“右箭头”向右移,按“左箭头”向左移。超级玛丽中操纵玛丽兄弟就是这样的,所有的人应该都习惯吧。

横向滚动条中的“左、右箭头”按钮原本是用来控制拖动手柄的。拖动手柄在整个滚动条中的位置对应着整个界面在窗口中的显示。按“右箭头”按钮,拖动手柄向右移,窗口中应显示整个界面更靠右边的部分,因此,整个界面向左移动了。

电子地图、滚动的缩略图列表经过了“进化”,滚动条被简化了,只剩下了方向键(yahoo新闻的例子中还能看到一些进化的痕迹),而方向键实现的功能还是不变的。

在实际的设计工作中,会遇到各种不同的具体情况,不仅需要我们清楚上面所说这种种左右对应的关系,还需要能分辨出哪些是“拖动手柄”,哪些是“被间接控制的界面”。来看个实际的例子有助于进一步的理解:

/uploads/200702/27_233807_6.gif

http://qqshow.qq.com/act/2006/zrshow/upload.html

这是一个让用户自己上传图片、加工图片作为个人形象的工具。用户选中本地的图片后,图片会直接显示在331×347px的图像显示区域中。140×226px的黑线框内是个人形象应有的大小。用户可以缩放、移动图片。

方向键操纵的是图片,140×226px的黑线框是不动的。通过缩放,图片可以比整个图像显示区域(331×347px)更大或更小。

/uploads/200702/27_234558_7.gif

被操纵的图片到底是“拖动手柄”还是“被间接控制的界面”?图片被放得很大的时候,在331×347px的图像显示区域里无法完整显示,更象那张无限大的地图。图片似乎应该是“被间接控制的界面”。图片被缩得很小的时候,方向键更像是在操作玛丽兄弟。但是,显然不能随着图片的缩放,方向键的功能也变化吧。

这里提供的功能是让用户调整图片作为个人形象,在140×226px的区域内显示。140×226px的区域是真正的可视窗口。用户上传的图片应当至少是一个能充满整个140×226px窗口的图片。窗口是140×226px的黑线框,图片只会比窗口大,不会比窗口小。这样来理解,图片显然应该是“被间接控制的界面”。接下来只需要修改一下界面上的视觉效果,正确的表现出上面的理解就ok了。修改效果如下图:

/uploads/200702/27_234559_8.gif

下拉箭头在web上的应用

接上篇(下拉箭头怎么拉?),现在聊聊下拉箭头在web上的一些应用。

先给个标准的例子,来自Gmail,在打开一封邮件后,右上角的回复快捷操作和更多的操作。

gmail_reply          gmail_reply_more

很明显,间隔线前的操作是回复此邮件,后的下拉箭头表示更多针对此邮件的操作。

这里还有一个例子,来自著名的Discuz论坛,在任何一个版面都可以见到的右上角的“发新帖”的按钮。

discuz_post

直接看这种样式的设计,应该是鼠标点击“新帖”为发表一个新的帖子的意思,而点击后面的下拉箭头,就是(发表的)更多操作。

但实际上–

discuz_post_over

当你把鼠标移动到这个按钮的任何一处,就弹出了这么一个层。当然,这个是运用的高超的ajax技术,给你带来了不需要多点击一次鼠标的便利,但他同时也给我带来了很大的困惑。

  • 鼠标一移动到“新帖”的按钮,就弹出四个选择,那么是不是,我发帖一定要选择以下四种之一呢?就是说,本站只能发以下四种帖子。(我想,Discuz的意思应该是论坛可以发以下五种帖子。但是,我一移动到新帖上,就弹出四种选项,这么强烈的吸引走了我的注意力。很容易让人觉得这个是发帖的必须选择。)
  • 鼠标移动到下拉箭头上,出来的是同样的东西。那么干嘛把“新帖”和下拉箭头分开?

根据这个设计所表达的意思,我想,只需要简单的这么处理以下,应该就能解决问题了:

discuz_post_over

鼠标移动到新帖上,点击,表示发表一个新的帖子。鼠标移动到后面的下拉箭头,自动弹出选项框,表示还可以发表更多类型的帖子。这个逻辑和Gmail的回复是一致的。

PS:这种设计形式下的交互方式是符合逻辑的,但是,跟Gmail的回复操作一样,他也不免有一些小小的弊端:后面的下拉箭头表示是跟发新帖一类的操作,但是交代的不是很清楚。

最清晰直观的解决方法就是,把这5种发表帖子一一摆开(当然可以在样式上突出第一个),类似的效果在早期的Discuz可以看到

free_discuz

但是以上只有2种类型的帖子,一一摆出来还是可以的。后面发展到了5种(说不定以后还有更多类型的帖子),一一摆开显然是不明智的做法,一是设计上不好看,二是后面四种属于不常有的操作。所以采取了放出一种常用操作(发表普通帖子)而把不常用的藏起来的做法,这时,自然而然的就想到了用下拉菜单来解决。

Discuz的想法是好的,只是在结合ajax技术运用时,一些交互的细节没有把握好。

下拉箭头怎么拉?

现在的软件越做越大,功能也越来越复杂,然而展示给用户操作的界面却有限,聪明的交互设计师们想出了很多方法来解决这类问题,比如放出常用操作,而把一些不常用的相近操作给隐藏起来。下拉箭头就是一种常用的打开更多操作的方式。

看两个标准的windows下拉箭头的例子:

下拉箭头

上面两个都是标准的图标+文字+箭头的形式,但是这两种种下拉箭头有什么不同么?我们把鼠标移上去,他们变成了这个样子:

下拉箭头鼠标触发

第一种触发后在图标文字和下拉箭头之间有一条分割线,而后面的只是一个有触发的效果;前一种分割线前面的图标文字表示一种操作,而分割线后面的下拉箭头表示更多的操作选项。后面没有分割线的触发后就只是一种更多操作的选项。

所以,目前我们分辨以上两种样式相同的下拉箭头的方法只是:移动鼠标看触发效果,有间隔线的前面是操作,后面是更多选项。而没有间隔线的就是一个下拉选项而已。

当然,这种方法不直观,你必须鼠标触发后,才知道这个下拉箭头倒是是一个什么操作。

但这种操作在Win系统的软件里面,已经很标准了。以下都是运用这个标准的一些例子。

Google toolbar  google toolbar

QQ聊天窗口  QQ

但同时,在QQ的聊天街面上,发下了一些似乎并不那么符合这个标准的按钮,比如以下这个

QQ聊天操作栏

按照以上的标准来看,第2、3、6、7的图标旁边应该加个小小的下拉箭头,鼠标触发效果应该是没有间隔线的那种。类比的可以看看msn聊天窗口的处理,似乎就比QQ处理的好(嘿嘿,这样似乎可以证明QQ不是简单的抄袭MSN呢)。

msn聊天窗口操作栏

以上聊天窗口操作栏,QQ的传图片的图标(第4个)和MSN的更改字体的图标(第5个)点击后都是弹出windows标准窗体,而其他的图标,比如选择表情,都是拉出一个类似层的界面,本质上属于更多操作。处理方法应该需要下拉箭头,鼠标触发后的效果也是图标可以箭头之间没有间隔线的。

PS:看到了更高级的应用,以下截图是是QQ的群聊天窗口。

QQ群

发现不同了么?

一个下拉箭头是在图标和字的中间,一个下拉箭头是在图标和字的右侧(和一般的一样)。据说,在箭头在中间的就是表示此操作为打开更多选项,也就是没有间隔线的;箭头在右侧的和一般的逻辑一致(一种理论:根据下拉箭头的位置判断可能的操作,直观)。

这里貌似是个不错的解决办法,但是他的问题是:

  • 要是我缩小了窗口,提示文字隐藏了,我该怎么去判断呢?(这个时候还是要用原始的鼠标触发方法吧。)
  • 这里的图标+下拉箭头+提示文字的组合根本不符合标准(这里文字出现的意义就是为了解释图标的,但是却被操作性的下拉箭头隔离了,那么他去解释~~~下拉菜单?)。所以根据下拉箭头判断也就无从说起了。

Update:上一个标准的例子,来自yahoo mail。直接做成按钮状的带间隔线的效果,直观,易懂。

yahoo mail

无等候电梯?电梯变聪明了还是我变笨了

无等待电梯 按键     无等待电梯 内部显示

以上两张图片是北京某知名国际大厦的电梯(感谢Sasha同学提供照片),来头可不小,美其名曰无等待电梯,这种新型的无按钮电梯又被称为“目的地直达电梯”,目前正在全世界的新楼宇中登堂入室,号称能加快搭乘速度,缩短等候的时间。

这种电梯是瑞士迅达(Schindler)的产品,据说使电梯变的更加聪明了:它在乘客进入轿厢前就预先获得乘客将要去往的楼层信息,它一方面知道有多少人在等候电梯,另外一方面也知道了进入电梯轿厢之后,有多少人要去同一个楼层,它会合理分派电梯运作,完全避免了一般电梯经常出现的一下挤进10多个人,从1层到N层几乎层层停的状况。此外,这项独特的乘梯技术还可以限制访客进入某些楼层,因此,这项技术对楼宇的安全性有了极大保障。

但似乎,我变笨了,因为我不会使用这种高科技的产品了。:(

就像上世纪50年代的乘客抱怨没有了电梯操作员一样,今天的乘客对于把搭乘控制权让给电脑感到很不自在。第一次使用是最困惑的,当我跳进一架打开的电梯,电梯门在面前关上时,才发现没有按钮可按。而接下来,我只是在满是镜子的封闭空间里手足无措。

和现在大多数的一般逻辑不一致,导致我根本不会注意到电梯外面的按钮,而当我进入电梯发现什么都没有了,我觉得自己就像个傻瓜。当然,任何新事物总是需要培训的。但是当我熟悉公司的乘梯方式后,回家却总忘记了按公寓楼电梯按钮,电梯半天没有反应,后进入的人打开电梯,发现这个人还在里面,怪异的看着我,于是我又手足无措了。

让我们来看看这种新式玩意儿到底有些什么问题:

  • 让首次使用者感到困惑并觉得自己很蠢。
  • 针对这个像电话按键的东西,我不知道怎样才能到达11楼。
  • 还有*号键和-键,难道这个”-”是链接两位数楼层的?那么当我输入1后,电梯不能立即反应。因它不知道我是要继续输入”-”,还是从别楼层要去1楼。那么应该还要个确定按钮?
  • 按轮椅标志会出现什么情况?
  • 我去B电梯等待,但是当我发现旁边的A已经下来并打开后,我却不能进去?
  • 进梯后,我突然不想去7楼了,我却不能改变主意。

总之,我们装了新的电梯,但却没有人知道怎么用。

当然,启用新电梯常常要教育乘客如何使用电梯。比如经常派发小册子,并在门厅举行培训课,或者在电梯厅安排了两名,负责告诉客人如何使用电梯。

但,搭乘电梯,我还有必要学习吗?

人类是很难培训的。在高峰时间,有些人就会按照一般的逻辑,想加快服务的速度,不停地按楼层的按钮,试图控制电梯的运行速度。然而,事与愿违,电梯系统反而慢下来。

“电梯里只有我们俩人,而电梯却停了五次左右,”哦,我的天。

update:看看大人物们怎么谈论这种电梯。

默多克(Murdoch):在接受《纽约客》的一次采访中,新闻集团主席也抱怨了这个事情,“有人装了新的电梯,但却没有人知道怎么用。”

汤姆.塔利斯(Tom Tullis):麻塞诸塞州沃尔瑟姆本特利学院(Bentley College)研究技术的“可用性”的教授,在波士顿第一次接触到直达电梯,吃惊不小,以至于后来他在一个技术可用性会议上做了一个名为《搭电梯不应要读用户手册!》讲座。

格拉斯伯格:《电视指南》(TV Guide)的资深副总裁,“电梯门关上后,你就没有机会改变主意了。一上了电梯,就好像得了幽闭恐怖症。”

Seven:中国唯一说这个事情的人?“我并没有去体验,只是看了几张手机拍的图片。不知道是电梯变聪明了还是我变笨了。”嘿嘿。

请给有需要人士让座

请给有需要的人士让座

我在深圳的地铁上发现了这个让座的标语,显然,这种处理方式好于我们平常所见的诸如“请给老幼弱病残孕让座”的套路。我真不知道以后还有多少需要座位的人要列到这个里面,而我们读起来是多么的费力。

这个道理,和“你的灯亮着吗?”是一样的。其实,有时候,事情就是这么简单。

只是,这个标语且出现在车厢的顶部,而不是在靠近座位的地方,算是一个小小的瑕疵吧。

归来

2007了。

套句经典台词:时间过的真快。大多数情况下,当我们意识到时间流逝,并且说出这句话的时候,脑子里一般都是一个固定的记忆。而这里的记忆,停留在去年的三月。一个小小的停顿,竟然已经过去了10个月了,时间过的还,真快。

这里的第一篇文字已经是3年前了,那是大学最后一个学期的刚刚开始。心情不好,所以是个诗人。文字抑郁的很,并且这个基调持续在整个的2004年。

在2004的最后一天,我说如婴儿般新生,干干净净。所以整个2005,这里是个大杂烩,抑郁的文字在慢慢变干净,工作学习的东西在慢慢变多。2006很寒酸,唯一的理由是忙,更大的原因却在于懒。挥霍着时间,却羞于思考。

2007了。归来。不是超人。

生活而已,有平凡的口水,有片段的画面,有工作的思考,有看,有听,有说,有想,还有很多。

欢迎回来。

Don’t Make Me Think 繁体中文版

网站使用性经典书籍Don’t Make Me Think推出了繁体中文版,不过翻译过来的名字显得很弱智,叫如何设计好网站,这种名字怎么能引起购买者的兴趣呢?听名字还以为是网络泡沫时期的又一垃圾呢。不过还好,封面没怎么改动。

简体中文版也要出来了,只是一再跳票,偶都还等Windy送我一本呢?不过,在这里可以先看看翻译的样张。

Update: 在炎热的8月,书终于出来了,虽然也有个不伦不类的名字,但味道还真不错。很快就攀升到销售榜的前列,而且这本网志年会签名版最终被拍出了原书9倍的价格,啧啧,不知道是看书呢还是看字来的。

基于日常交谈的网络对话模型

Model Web dialog on everyday talk

基于日常交谈的网络对话模型

协作翻译:Eros Chan, Joey Shi, Ivan Chen, mimiqiao, Windy 2006年1月

Web managers can take advantage of conversation as a metaphor for interaction with computers by designing self-service online interactions based on it, say Kerry Bodine, Nate L Root and Caroline L Carney.

Kerry Bodine ,Nate L Root 和Caroline L Carney认为,网络规划者能利用(现实生活的)人们之间的交谈是人机交互的隐喻这一原则,从而基于这一隐喻设计在线自助服务的交互方式。

Conversation forms the core of human communication. Because the social rules of conversation are deeply ingrained, people naturally—and unconsciously —use conversation as a metaphor for their interaction with computers. Web managers should take advantage of this connection by designing self-service online interactions that incorporate the style, pace and rules of real-life conversations.

交谈是人类的核心交流方式。因为交谈的社会性规则根深蒂固,人们自然而然地-无意识地-使用交谈作为了他们人机交互中的隐喻,网络规划者应该利用这一关系,从而设计融合了现实生活中交谈的方式、节奏与规则的在线自助服务系统交互方式。

小标题:

Make conversation a metaphor for human- computer interaction
使交谈成为人机交互的隐喻

People engage in—and enjoy—conversations
人们参与且乐意交谈

People understand how conversations work
人们知道怎样进行交谈

People treat computers like humans
人们把电脑看作人类

Web interactions should follow the rules of conversation
Web交互应该遵循交谈的规则

全文请到这里下载:http://www.dedream.com/trans/Model_Web_dialog.pdf

点这里到协作翻译现场看看:)