多案例浅谈网站反馈式交互设计

来源:网络 责任编辑:栏目编辑 发表时间:2013-07-02 02:25 点击:

  出色的设计源于生活,那么我们就从生活中说起,我们依照用户生活的使用情景来设计一款产品,我们不需要重新培养的用户的使用习惯,用户可以在第一次使用你的产品来完成自己的目标,并且不需要他人的指导。比如说苹果公司在设计第一代iMac的过程中,乔纳森及其团队前往日本,曾向日本某糖果行业的人请教,如何在生产糖果颜色的电脑外壳的同时,保持其一贯的半透明度。

  

苹果电脑

 

  在下文中我们将聊聊反馈式交互设计对于网站设计重要性,在这之前我们有必要了解相关的概念:

  何为反馈?

  来自的维基百科解释:反馈又称回馈,是现代科学技术的基本概念之一。一般来讲,控制论中的反馈概念,指将系统的输出返回到输入端并以某种方式改变输入,进而影响系统功能的过程,即将输出量通过恰当的检测装置返回到输入端并与输入量进行比较的过程。

  何为交互设计

  交互设计,又称互动设计,(英文Interaction Design, 缩写 IxD 或者 IaD),是定义、设计人造系统的行为的设计领域。人造物,即人工制成物品,例如,软件、移动设备、人造环境、服务、可佩带装置以及系统的组织结构。交互设计在于定义人造物的行为方式(the "interaction",即人工制品在特定场景下的反应方式)相关的界面。 交互设计师首先进行用户研究相关领域,以及潜在用户,设计人造物的行为,并从有用性,可用性和情感因素(usefulness, usability and emotional)等方面来评估设计质量。

  结合上述概念我们综合来说,反馈和交互意味着通过合适的反馈以及和程序之间的交互从而让用户时刻知道现在发生了什么,而不仅仅是当事情出错时显示一个警告。我们暂时将反馈分成2种类型:一种正面反馈,另一种为负面反馈。对网站用户而言反馈属于提示信息类型的一种,从用户注册账号输入错误的提示,到退出成功的提示,都是属于反馈式交互设计的范畴。www.pmtoo.com

  反馈式交互设计如此重要

  让我们来想象生活中的几种情景,假设你在乘坐地铁需要换乘时,此刻如果地铁没有换乘的指示标识,会让人摸不着东南西北,非常容易让人迷惑,不知道哪条通道才是正确的换乘通道。地铁的建设者各换成通道上增加醒目的提示文字,很直观清楚就让你知道哪条通道正确的换乘路线。

  

伦敦地铁

 

  (london:地铁换成指示牌)

  以网购当中的交易流程为例,在用户提交了订单之后,如果系统的处理时间较长,导致后续页面加载迟缓,而这当中没有任何反馈提示,那么用户很有可能会认为自己的订单并没有提交成功。这种情况下,可以在页面加载的过程中向用户提供一些正面反馈信息,例如告诉他们“系统正在处理订单,请稍候”一类,这样可以防止用户由于不明真相而点击后退按钮。

  

\

 

  (某网站购物车)

  以安装软件为例,通常来说软件的文件较大,安装文件加载的时间会稍微长一点,软件界面没有任何反馈提示,想象一下你置身于中的情景,是不是非常容易让人感到烦躁不安,原因是由于安装软件过程是由用户主导的,用户安装软件目的是为了完成他自身目标,而此时界面无任何提示,用户对此突然失去了控制,导致目标中断无法完成。此时此刻户关闭软件重新安装,如果较长时间还没有响应,用户会选择离开。

  我们通过什么方法来避免或彻底解决这些问题呢?我们前面提到了两种机制,分别是“正面反馈和负面反馈。”我们是不是可以在安装的过程的界面增加一个安装进度条,数值和进度同时变化,这样不会偏离用户把控范围,如安装进度条,邮箱表单账号输入正确时,界面回馈给用户的对勾提示状态,称之为正面反馈。

  

\

 

  (photoshop安装安装进度提示条)

  

\

 

  (序列号输入正确对勾提示状态)

  通过正面反馈机制,我们可以逐渐帮助用户打消这些顾虑,帮助他们建立信心,让他们感到一切都在顺利的进行着,防止用户在做了正确的事情之后由于担心自己操作有误而撤消之前的

    相关新闻>>

      发表评论
      请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
      用户名: 验证码:点击我更换图片
      最新评论 更多>>

      推荐热点

      • WordPress添加百度喜欢按钮小技巧
      • Wordpress 博客如何实现自定义Gravatar头像
      • 网站设计分析:建立良好的视觉层级
      • 网站设计分析:“中国式设计”的三个方向
      • 案例分析:奥巴马筹款网站的制作过程
      • 7大主流B2C首页导航栏设计对比分析
      • 创建不平衡的平衡:在网页设计中使用不对称设计
      • Wordpress页面模板制作方法及使用
      • css控制文字前的小图标
      网站首页 - 友情链接 - 网站地图 - TAG标签 - RSS订阅 - 内容搜索
      Copyright © 2008-2015 计算机技术学习交流网. 版权所有

      豫ICP备11007008号-1