交互设计(精华)

交互设计基础Banlon2008/4/6交互行业信息交互设计方法和原则交互设计理论交互设计定义和发展您可以通过“幻灯片放映”查看这些幻灯片，也可以在普通视图中通过浏览的方式来查看。设计这些幻灯片，是为了让您在浏览“界面交互设计基础”中通过作者设定的目录结构获得一些关于交互设计理念的启发!先介绍一个人……Numal男25岁祖籍山东农村学历大学本科公司以及职业任职于知名互联网公司，从事设计相关工作性格活泼，爱开玩笑，有时候会多愁善感爱好足球、阅读、旅行、写blog补充由于生在农村，接触互联网的机会很少，直到高中毕业才知道互联网是什么。现在非常迷恋网络，每天闲暇的时候都想在互联网上闲逛。8年前，Numal高中毕业，朋友告诉他注册一个电子邮箱就可以方便的给人写信，让他也去弄一个。于是他就去上网了。他看到注册页面时，脑袋完全不清楚面前是什么东西。他有了一串疑问：电子邮箱是什么东西？新用户是什么？邮箱名是什么？……他发现自己很笨，什么都不懂，非常的懊恼。两年前，Numal推荐一个不常上网的人去使用自己设计的网站：豆瓣他朋友说发现豆瓣的注册很简洁。他朋友说很清楚自己要做什么事情他朋友说很放心他朋友说没有出错他朋友说很快完成了注册整个过程他朋友很愉快，很有安全感•是什么让网站体验几年间变得这么好？•是什么让Numal的朋友如此愉悦有安全感？交互设计定义和发展Numal大学上的是设计专业。在大学最后两年，他的方向转向了交互设计。通过学习，他了解了很多交互设计的基本概念。交互设计定义（一）简单的说，交互设计是人工制品、环境和系统的行为，以及传达这种行为的外形元素的设计与定义。不像传统的设计学科主要关注形式，最近则是关注内容和内涵，而交互设计首先旨在规划和描述事物的行为方式，然后描述传达这种行为的最有效形式。艾兰.库珀(alancooper)VB之父交互设计之父微软视窗先锋奖软件梦幻奖得主库伯交互设计公司创始人交互设计定义（二）设计支持人们日常工作与生活的交互式产品。具体地说，交互设计就是关于创建新的用户体验的问题，其目的是增强和扩充人们工作、通信及交互的方式。Winnogard（1997）把交互设计描述为“人类交流和交互空间的设计”HelenSharp从用户角度来说，交互设计是一种如何让产品易用，有效而让人愉悦的技术，它致力于了解目标用户和他们的期望，了解用户在同产品交互时彼此的行为，了解“人”本身的心理和行为特点，同时，还包括了解各种有效的交互方式，并对它们进行增强和扩充。交互设计还涉及到多个学科，以及和多领域多背景人员的沟通。DeDreamNumal在学习时，接触到了几个很容易混淆的概念。后来经过辨析，他这样理解了……几个概念•交互设计–设计行为，偏向于计算机的•人机交互–人与机器相互信息交换•交互–一种行为几个概念•可用性–标准•用户体验–目标•UCD–原则–方法交互的广义发展历程•旧石器时代–简单的–单一的•机器大工业时代–复杂的–繁琐的–出错率高的–危险的•信息时代–效率–易用性交互设计行业的发展初创期（1929-1970）•1959年，美国学者B.Shackel提出了人机界面的第一篇文献《关于计算机控制台设计的人机工程学》•1960年，LikliderJCK首次提出“人机紧密共栖的概念，被视为人机界面学的启蒙观点•1969年，召开了第一次人机系统国际大会，同年第一份专业杂志国际人机研究（IJMMS）创刊。奠基期（1970-1979）•从1970年到1973年出版了四本与计算机相关的人机工程学专著•1970年成立了两个HCI研究中心：一个是英国的Loughbocough大学的HUSAT研究中心，另一个是美国Xerox公司的PaloAlto研究中心发展期（1980-1995）•理论方面，从人机工程学独立出来，更加强调认知心理学以及行为学和社会学等学科的理论指导•实践范畴方面，从人机界面拓延开来，强调计算机对于人的反馈交互作用。人机界面一词被人机交互所取代。HCI中的I，也由Interface(界面/接口)变成了Interaction(交互)。提高期（1996-）•人机交互的研究重点放在了智能化交互，多模态（多通道）-多媒体交互，虚拟交互以及人机协同交互等方面，也就是放在以人为在中心的人机交互技术方面。学科人类工程学心理学认知科学信息学工程学计算机科学软件工程社会学人类学语言学美学……设计图形设计产品设计商业美术电影产业服务业……交互设计人机交互（HCI）交互设计的范畴交互设计的一些理论交互的三个要素人界面机器/系统可是，Numal发现在人机工程的介绍中，三要素是另外的三个……交互三个要素人环境机器–交互过程是一个输入和输出的过程，人通过人机界面向计算机输入指令，计算机经过处理后把输出结果呈现给用户。人和计算机之间的输入和输出的形式是多种多样的，因此交互的形式也是多样化的。数据交互图像交互声音交互动作交互基础的交互方式平衡5E法有效(Effective)效率(Efficient)易学(EasyToLearn)吸引人(Engaging)容错性(ErrorTolrant)交互设计的方法和原理Numal了解过了交互设计的相关知识后，想在工作中实践一下，可是怎么下手呢？接下来他开始研究交互设计的方法……UCD设计理想流程简单说明：1.创造一些用户2.找出重要的活动3.找出用户模型--用户期望如何完成这些活动4.草拟出初版的设计5.一直反复把设计修改得更容易,直到虚构用户能轻易使用为止6.找真人来看着他们试用你的软件接收需求调研分析交互设计视觉设计可用性测试上线交互设计所做的事情可识别的•形状•布局•尺寸•色彩可感知记忆的•语言的含义•色彩的隐喻•相对位置•层级、关系•……可物理衡量的•流程•点击次数•移动距离•姿势•转换方式•……交互设计的核心要素精确描述我们的用户以及用户希望达到的目标，定义几个典型角色，并用故事的形式表达出来目标•用户•产品角色•筛选•分类脚本•任务•场景目标•用户目标•生活目标•体验目标•最终目标•产品目标•利润•市场•目标是行动的驱动力，产品的功能和行为必须通过任务来解决目标•产品成功的关键是目标，而不是特性•成功的交互设计师应该对目标高度敏感Numal在思考，那么豆瓣的目标是什么呢？目标•用户目标•生活目标：一种新的消遣方式•体验目标：容易使用、方便、舒适•最终目标：撰写浏览书评，找到自己兴趣相同的人•产品目标•市场：聚集文化人群，创建文化交流社区角色•简单的说，角色就是为我们的产品虚拟的一个典型用户。我们在设计是，就可以专门为“他”设计。•角色是一种强有力的交互设计工具•角色的确定给设计带来的好处：–该做什么–便于沟通–提高效率–解决边缘设计–……角色•一般不超过两个人•一男一女•一般将用户定义为初级用户和中级用户。特殊产品才定义高级用户。•角色描述中应该包含：–一张相片–人物基本特征–于产品相关的性格、能力、爱好等介绍–会用到的产品、功能介绍Numal感觉角色设计很有兴趣，于是就针对自己负责的产品，制定了一个角色一个定义角色的例子小翠女22岁学历大学本科公司以及职业政府文员性格活泼，爱开玩笑，但很有礼貌爱好读书、旅行、写blog补充小翠的单位可以上网，他每天的工作比较轻松，经常上网看看电子版的小说、散文、诗歌等。她是文科的学生，对电脑知识了解很少，对网络的认识很浅。她喜欢交朋友，跟人属于自来熟的那种。Numal做完角色设计后，整个项目组都很认可。Numal还发现有了角色之后项目组成员间的讨论变得简单和高效了。一段经典对话定义角色之前•莫名（产品经理）：我想豆瓣用户需要打印功能•Numal：我想他们不会需要打印功能的，打印功能对豆瓣的用户没有什么意义吧•莫名：但是也许有人会希望要打印功能呢？•Numal：当然有这种可能，但是这种需求很少啊•……定义角色之后•莫名（产品经理）：我想豆瓣用户需要打印功能•Numal：小翠不需要打印功能•莫名（产品经理）：我想应该有人会用到打印功能的。•Numal：我我们是为小翠设计的这个产品，不是为其他的人。我们不需要做这个功能。•莫名：哦，那好吧脚本人和他们的活动组成的故事使用具体的故事来构造模拟用户的可能行为或者讲述设计方案关注人物角色以及其心智模型，目标和活动，有可能包括对环境的考虑•基于任务的脚本•基于场景的脚本一个场景脚本的例子1.早上，小翠来到办公室，拿起电话给朋友打了个电话，然后打开电脑，打开邮箱，开始一天的工作2.在开始工作之前，她上了一下豆瓣，看看是否有朋友给他留言或者回复了她的评论。3.小翠收到一封邮件，来此办公室主任的，告知同事strong今天请假可能来不了，如果有事情帮忙处理一下。4.如往常一样，把邮件中的一些事情处理一下，需要打印的就打印，需要盖章的就盖章。5.在工作过程中，她总是开着QQ，经常有朋友给他发个链接让她看。当她正在阅读一封刚收到的邮件时，一个好友给她发来了豆瓣的一个网址，她便会放下手头的工作开始浏览网页。......一个场景脚本的例子该脚本提纲试图解决的问题：1.产品使用时的设置是什么？2.是否会被使用。角色最终期望的结果很长时间？3.人物角色是否经常被打断？4.和它一起使用的其他产品是什么？5.人物的技巧使用频繁程度有多高？6.为了满足人物角色的目标，角色需要完成哪些主要活动是什么？交互设计时需关注的可用性指标易学习容易使用容错性有效性用户满意度安全性ISO9241/11中的定义是：可用性是一个多因素概念，涉及到容易学习、容易使用、系统的有效性、用户满意，以及把这些因素与实际使用环境联系在一起针对特定目标的评价。常用交互设计原则•可视性–功能可性越好，越方便用户发现和了解使用方法•反馈–返回与活动相关的信息，以便用户能够继续下一步操作•限制–在特定时刻显示用户操作，以防误操作•映射–准确表达控制及其效果之间的关系•一致性–保证同一系统的同一功能的表现及操作一致•启发性–充分准确的操作提示交互设计准则设计方案属性：•伦理的（能体谅人，有帮助）–不伤害–改善人的状况•有意图的，能帮助用户实现他们的目标和渴望•注重实效，帮助委托的组织实现它们的目标•优雅的–最简单的完整方案–拥有内部的一致性–合适的容纳和情感交互设计师的基础技能要求Numal做完整个项目后，团队对其专业性和技能都很满意，于是让他传授一下自己的经验。常用的交互设计工具VisioAxureillustratorFireworksWordPhotoshop交互设计师需具备的项目意识QBT质量时间成果交互设计师需了解流程流程的重要性•预防研究、设计、评估过程中的遗漏；•规范研究、设计、评估的步骤；•明确与公司研发流程的衔接；•解决整个过程中责任不明、任务不清的问题设计流程交互流程视觉流程用研流程研发流程公司级流程跨系统流程系统流程公司组织结构智能体系组织划分….交互行业的信息国内部分人机交互学术机构北京大学计算机系人机交互与多媒体研究室清华大学工业工程系人因工程实验室中国科学院软件研究所人机交互技术与智能信息处理实验室欧盟可用性中国中心微软亚洲研究院—交互设计中心UPA中国业界公司信息IBM：500人，25个可用性实验室微软：200人，30个可用性实验室Philips：100多人西门子：100人Oracle：约70人韩国三星：100多人Adobe：21人eBay：20人Tencent：30HP、Yahoo、Nokia、AOL、Intel、GE、TI、CISCO、……推荐书籍•内容：针对软件让用户感到“难用”的现状，提出软件设计的新理念和新方法，以及交互设计，目标导向，角色分析以及脚本提纲等一系列设计概念。•内容：介绍了交互设计的理论，目标，原则，以及设计方法。并介绍了系列关于原型制作，可用性评估，用户测试，调查的操作方法。推荐书籍•内容：–用户研究–界面设计–可用性评估推荐书籍•内容：以本能，行为和反思三个设计的不同纬度为基础，阐述了情感在设计中所处的地位和重要作用。并分析如何把情感效果融入产品设计中。推荐书籍•内