让按钮更有“安全感”

1 七月 2008 by OutC

OutC

发现很多国外的交互专家都提过这样一个观点:用户在浏览网页时缺乏安全感。页面的用户体验也越来越被更多的设计者重视。对于网页体验,大致可分为视觉体验、导航体验、布局体验和操作体验。今天谈谈操作体验的细节:网页按钮体验。

首先谈一下我对网页按钮的看法:

  • 网页按钮在人机交互中起着相当大的作用:用户需求命令的提交都要用到按钮
  • 视觉上应突出(凸出),至少应该让用户觉得——那是用来按的
  • 比起实际生活中的按钮,优秀的页面按钮往往多一个鼠标经过感知(自创词:事件感知)
  • 优秀的按钮即时反馈应该及时,我不推荐Google的部分按钮(下面会说到)
  • 超链接也是按钮的形式之一
  • 暂且这么多

同其他体验一样,按钮的用户体验有三个环节:感知、操作、反馈。

感知可分为视觉感知和操作感知,页面按钮比起实际生活中的按钮来说最大的区别在于虚拟性,不可触摸性,日常生活中的按钮由于是可触摸的,有触觉感知的,于是有些页面按钮便有一个“鼠标经过事件”。

但要细分起页面按钮体验流程的话,我认为优秀的按钮体验可分为五个要素:视觉感知→事件感知→点击操作→即时反馈→目标反馈

解释一下:

  • 视觉感知:对于优秀按钮的视觉要求应凸出且突出(这个“突出”的概念是相对的),一目了然。
  • 事件感知:也就是鼠标经过事件,当鼠标停留在按钮上的事件反应(豆瓣的超链接体验很不错)。
  • 用户操作:即用户的点击行为。
  • >即时反馈:大部分的手机键盘按钮按过后都会有清脆的响声,向用户反馈按下操作已完成,但在页面中用声音来表现即时反馈似乎不太现实(至少现在不现实,也会有条件限制,如需要声音输出设备等等),只能在视觉中体现反馈,不过这个反馈可能是细微的。
  • 目标反馈:向用户提交真正的目标需求(页面转向等等)。

▲个人认为按钮的即时反馈很有必要性的,可能部分用户的网络带宽不足,在点击操作之后得不到及时的目标反馈,因此按钮的即时反馈就显得比较重要。我一个朋友在一次无即时反馈的按钮操作之后也没有得到及时的目标反馈,结果他以为没按,于是给按钮一通猛点……

案例1:Wordpress

wp.gif

Wordpress的关闭公开访问按钮我还是比较欣赏的(即时反馈即为按下按钮时按钮视觉上的凹下凸起的视觉感知)

案例2:Google

gtalk.gif

对于Google Talk下载页面的下载按钮,我倒不是很推崇,尽管很突出,也够“凸出”,但也缺少了不少的感知要素。

2 条评论 to “让按钮更有“安全感””

  1. crazy:

    用户浏览时没有安全感,《Don’t Make Me Think》里好像提到过。  [引用]

  2. 漫画小强:

    继续受教~  [引用]

在此发言:

支持以下XHTML标签: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>