当前位置: 首页 > 图文教程 > 网页制作 > 心得技巧 > 优秀的交互设计应该是最愉悦的满足用户的需求

心得技巧
IE8 Beta 1两个地方需要大家注意
提高网站性能中内容有关的10条原则
网页设计者应该从三个方面优化网页
Web 设计 实现干净代码的12条定律[图文]
网页设计必备工具 firefox Web Developer插件 CSS工具组教程
UCenter Home 站点添加统计代码
9款很棒的网页绘制图表JavaScript框架脚本
提高网站可用性的10个小技巧
网站维护页面的列表制作技巧
B2C 网站用户体验细节设计参考
收集12个实用的网页在线工具
设计参考 漂亮和原创的博客设计
收集25个知名网站标志中使用的字体
极尽简约的网站设计实例
个性化创意鲜明的网站设计实例(30个)
水平滚动的网站设计 小结
更受欢迎 更具创造性的深底色网页设计实例
有创意的关于我们网页页面设计
整洁漂亮的网页设计的4项原则
设计参考 WordPress建站成功案例

心得技巧 中的 优秀的交互设计应该是最愉悦的满足用户的需求


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-03-18   浏览: 66 ::
收藏到网摘: n/a

 本文,我主要想表达的意思是:交互设计师一多半的时间其实是在做逻辑分析,从业务逻辑到产品逻辑的迁移;然后另一部分时间是在做按钮的摆放。(注意,我说的是部分,不是全部!)在这两个过程里需要注意的最重要的问题就是不能懒!

      让我们再来重复一下那句关于交互与用户体验之间的关系的论断: 优秀的交互设计应该是用最低成本的交互,最愉悦的满足用户的需求
      那么,什么是最低成本的交互?我的理解,用户需要的时候才出现交互,用户用不到或者不能使用的时候就不出现交互;当用户需要交互的时候如果能二步完成就坚决不搞成三步。用一句通俗的话说就是:看人下菜碟。

      在大的层面上,在对产品进行需求分析的时候我们会考虑不同的用户群,他们对一个产品的使用需求和使用方式都是不同的,在这里我们对用户进行了划分。我们把这个思想坚持到交互分析里来,对于不同的用户在不同的使用环境下需要的交互方式也是不一样的。
      之前,顺网UED的同学们对用户交互行为的分析提出了“交互表格”的方法:划分2个纬度,页面元素和用户行为。最左边一列是页面可见元素(包括光标);最上面一行,是用户的行为(尽量按操作流程)。中间交叉的为场 景描述。通过这种枚举的方式可以详尽的列出所有可能存在的交互行为,然后我们对每个交互行为再划分出不同的交互方式。
    
       比如:我们要做一个积分商城的积分兑换交互。经过分析、合并,我们知道可能存在这么几个场景:①用户未登录(注册);②用户已经登录,但是积分不足;③用户已登录且积分足够。
      下面,我们选2个电子商务方面的代表网站(京东商城VS支付宝)来看一看他们怎么处理的:
      京东商城的积分商城页面里,不论你是否登录(注册)、积分是否足够,积分兑换详情页的内容永远保持“一致性”。当未登录点击兑换的时候会跳转到登录页面;当登录后积分不足点击兑换的时候会弹出窗口提示积分不足; 当登录且积分足够的时候,会显示兑换成功。
      支付宝的积分商城里对上述问题做了改进,我们看到支付宝的设计师对业务逻辑做了足够的分析:先对用户登录行为做判断;把用户所持有的积分放在了所需积分的下面;积分不足的时候给出提示。
      
       那么,这些足够了吗?不,我觉得还应该有改进空间(京东商城的设计完全不具备交互性,不做分析)。对照“看人下菜碟”的说法,我们来看看哪些是可以改进的。
       1、如果用户没有登录(注册),用户是否需要去点击“兑换”OR“评论”按钮?答案是否定的。这个时候用户最需要什么交互?是登录!
       当然,这里会存在一个用户是否需要注册的行为?我个人认为,在积分商城这个产品场景里,注册是存在几率很小的行为,完全可以放到登录的引导页面里去。(积分兑换的前提是注册用户,且在网站上发生了用户行为产生过积分才能兑换,就算是注册送积分也是需要先完成整个注册过程的 吧)

       2、如果用户登录但积分不足,用户最需要什么交互?了解积分还差多少,如何获得更多的积分。其他的交互行为对这类用户来说都是多余的。
       3、 如果用户登录且积分足够,用户最需要什么交互?兑换。这个时候用户是否需要“点评”交互?我觉得不需要,还没有兑换使用,怎么点评?“点评”这个交互行为 应该出现在用户兑换之后再次浏览到这个物品的时候。
       下面,是我对积分兑换这个交互模块做的改进。
        1、如用用户没有登录(注册):不做用户持有积分判定(当然,也没法判定);不出现“兑换”按钮,他的位置由登录提示取代。
        2、如果用户登录但积分不足:做用户持有积分判定,同时提示积分差额;不出现“兑换”按钮,他的位置由积分不足提示取代,可夹塞广告,如何获取积分。
        3、如果用户登录且积分充足:做用户积分判定;出现兑换按钮。

                          (左:支付宝的积分兑换交互;右:我的修改版本)
       当然,这里只是一个简单的交互条件限定,还可能会有更多兑换限制,从而出现更多的交互行为,比如:注册多久的用户对可兑换、实物兑换 的时候填写收货地址,发货时间段(这个很重要!)、可兑换的数量、等等。

      对于任何一个Web页面而言,都必须承担着2个功能:顺利的完成本页面的任务、流畅无误的进入下一个任务。对于如何实现这2个功能,我的土方法就是:有的时候我需要强制你专一的完成本页面的任务,不给你回路;如果这个页面上你要完成的任务太多,我可以考虑帮你拆解。
      比如,在注册页面除了注册表单什么都不放,什么面包屑导航全部去掉,甚至LOGO也要搞成不可点击的,这些都是为了“强迫”用户完成本页的任务;用户在后台录入产品的时候,可以考虑对产品的属性进行分块,然后把录入页面拆开(当然,你不能无限制的拆分!)….

      我个人的感觉是,之所以交互过程被搞的很笼统,大部分原因在于交互设计师很懒。懒的做分析,认为只有流程能走通就OK了,不愿意继续细分;懒的做交互Demo,认为这些给技术说明白就可以了。前几天做某个模块的时候我偷了个小懒,在DEMO里把工商银行写成“工行”,然后在PRD文档里做了详细说明。今天再看测试,好家伙,还是“工行”!搞的我羞愧难当,这个问题的责任完全在设计师本身,设计师懒就不能指望技术勤快!当然,这里还存在一个原型图的制作问题,改日再谈。

      PS:为了迎合“微”时代,我以后的博客都会以“本文想表达的意思是….”开头,看完导语如果你有兴趣可继续,如果觉得扯淡可以略过,省的搞到你读着伤脑筋, 我想怎么回复你的评论麻头皮