精华内容
参与话题
问答
  • 交互设计

    千次阅读 2016-12-05 19:57:12
    什么是交互设计要谈什么是交互设计,先要了解这几个概念。网页设计年代,大概是从2004年开始热起来了,等到我毕业的2006年,满大街都已经是电脑培训机构,记得当时北大青鸟的百日千才培训就在我每日下班必经的十字...

    这里写图片描述

    一. 什么是交互设计

    要谈什么是交互设计,先要了解这几个概念。

    这里写图片描述

    网页设计年代,大概是从2004年开始热起来了,等到我毕业的2006年,满大街都已经是电脑培训机构,记得当时北大青鸟的百日千才培训就在我每日下班必经的十字路口。

    网页设计年代重视的是特效,说白了就是特效背后的技术,君不见当时的网页是让人看得眼花缭乱啊,这里bling bling闪闪的,漂浮框乱跳的。然后就是套各种网页设计模版,做出很多复杂的类似于右边这种典型的政府网站出来。

    这里写图片描述

    美工时代:

    网页设计时代,大批的”美工”涌现。显然人们有了更高的追求,光是bling bling的眼花缭乱的动画效果已经看厌了,网页也是需要装饰美化的。虽然网页设计论坛当时很火,但是网页设计师这个头衔仍然是一厢情愿的叫法。大多数时候,仍然是老板和客户嘴里的”美工”。

    美工时代重视的是:视觉效果。并且,原来对网页设计一窍不通的老板们纷纷成了资深的视觉鉴赏家。美工时代”美工”很痛苦——单纯靠视觉效果去评价作品好坏,太主观,太随意。于是他们通常会做N个版本,反复修改,直至美工崩溃或者老板崩溃。

    这里写图片描述

    历史迈入了伟大的UI年代

    大概是在2005年,我崇拜的网络名人从擅长鼠绘的小非变成了图标达人Rokey(时光倒流到2005年,我正在看这篇文章:灵感来源于生活-微软亚洲工程院移动设备组UI设计师张伟)。也自学了关于UI的若干知识,开始迷恋起PS像素级的奇妙世界。

    UI=User Interface. 已经将User即用户纳入界面设计考虑的重要要素。但是对于精致、质感的无极限的追求,依然会让人顾此失彼,忘记了从用户的视角去审视一个UI的作品。于是,经常会看到虽然很精致,但是很难用的软件界面。

    用户看到的部份,无可挑剔。但是实际上,使用的感受并不好。而感受部份,可以从几个角度去阐释:

    他们知道不知道这个是什么东西?他们感觉到迷惑吗?

    他们是否清楚能够通过此物做什么?

    是否清楚如何做到?

    当他们有兴趣去尝试时,他们知道如何开始吗?

    当他们开始后,知道如何进行下一步吗?

    当不想要使用时,能够快速明白如何退出吗?

    当他们退出后,下次来用,是否需要重新去学习掌握如何操作?

    每一步操作时,他们心理会感觉到愉悦还是枯燥乏味?

    当然,我们崇尚软件操作过程中的效率,但是若用户感觉到愉悦,也许就不会觉得效率太低,其实,效率是个相对的说法。归根结底,这就是用户体验。

    这里写图片描述

    UED时代——用户体验制胜我们不缺技术,我们不缺另人震撼的视觉,这些虽然过去是我们孜孜追求的东西,如今已经不足为奇。但是我们缺用户来用,我们缺用户持续来关注,我们缺用户体验。用户体验过去一直在产生影响,但是未能得到足够的重视。

    2007年,开始关注ucdchina,UED是套方法论,UCD是指导思想——User-centered Design. 不再是BCD-Boss-Centered Design.老板说了算,除非老板能够代表目标客户。这和市场营销学发展的历程有点像,从生产主导到市场主导。

    这里写图片描述

    WEB2.0后,用户的参与度越来越高,用户从被动的接受者变成了主笔,主编,摄影师,作家……他们是主角,使用中遇到问题,当然不可能靠网站的客服电话或帮助教程搞定,他们需要自助,所以,降低使用门槛,消除使用障碍,吸引他们重复使用,是每个网站致力的方向。

    这里写图片描述

    从广义来讲,一个网站的任何部门都是在为用户体验服务,从战略层的布局开始,用户体验已经开始。而狭义的用户体验设计,也就是UED部门做的事情,大部分是围绕到结构、框架以及表面层。

    这里写图片描述

    UED部门的组织架构基本如下,解决用户易用(交互、文案),以及想用(视觉,交互)的问题。而用户研究是帮我们看清用户特征、洞察及挖掘用户需求,前端是伟大的实现者。

    文案对于用户体验的重要性经常被忽视,所以,文案撰写在UED团队是很稀缺的资源。目前据我了解,只有支付宝的UED团队有此配置,其他团队大部分是由产品经理担任此职。

    这里写图片描述

    那么,交互设计到底是什么呢?

    我们不缺技术,我们不缺另人震撼的视觉,这些虽然过去是我们孜孜追求的东西,如今已经不足为奇。但是我们缺用户来用,我们缺用户持续来关注,我们缺用户体验。用户体验过去一直在产生影响,但是未能得到足够的重视。

    我突然打了一下你,你肯定会有一定的反应。首先,你的表现会吃惊或者生气,你的吃惊或者生气的程度也会受我下手的轻重和方式影响。

    我呢,对你的反应会有一定的预期,下手的时候,没有期望你会突然哈哈大笑——这就是人与人之间的交互。

    人和物也是一样,我按下电视的开关键,我预期电视会打开,并且电视如期望发生运转。若我按下电视的开关键,突然电视成了静音,这就是非期望的交互行为。

    这里写图片描述

    二. 为什么需要交互设计?

    这里写图片描述

    人和物也是一样,我按下电视的开关键,我预期电视会打开,并且电视如期望发生运转。若我按下电视的开关键,突然电视成了静音,这就是非期望的交互行为。

    人可以经由训练,改变自己对于行为的反馈,比如,妈妈教育婴儿对于他人的礼物回报以”谢谢”和微笑,不要跟着陌生叔叔走等。如果你送一个小孩子礼物,他却对于大骂,你会觉得这个小子怎么这么没教养。

    机器、系统没有生命力,则需要被赋予对于各种行为的反馈机制。将用户的期望赋予给它,让它给出合理的反馈行为。

    然而不幸的是,我们的生活里,没有教养的产品实在太多太多…

    这里写图片描述

    上图左侧是一个杯子。我让现场的同学猜这个杯子的成本价,答案集中在10元左右。但是不幸的是,我为这个杯子花费了不下600元。原因正在于不良交互。

    杯子的把手处仅容两个手指塞入,当倒入热茶后,我端起此杯,把手上部是光滑无比的玻璃,而手指又被杯壁烫了一下,结果杯子倾斜,将热茶倒入了笔记本电脑键盘里——修键盘花费了580元。

    考虑到这里,设计杯子的设计师可以考虑把把手做成磨砂玻璃,增加卖点。

    这里写图片描述

    上图是公司内部的门。基本上去个卫生间都要从此门经过,那么基本上每个员工每天进出此门不下6次吧。

    在场的同学声称每次都很紧张——为什么?怕被撞啊。你看不到对面有没有人,怕推门撞别人。自己也担心被人撞。所以,途径此门,瞳孔会不会由于紧张放大呢?还有,此门推也可拉也可,上面的”拉”字其实形同虚设。

    每天反复扇动,座位靠近此门的同学们夏天感觉到热,冬天感觉到冷。严重不低碳环保。

    原因也是不良交互设计。

    改进此门,可以设置透明的玻璃窗。或者用自动开启的推拉门代替。

    这里写图片描述

    上面是一个电梯事件。要知道电梯是个最讲究习惯统一的地方。你要经常在不同的大楼用不同的电梯。若A电梯用这种按键,B电梯用那种按键,基本上你都要重新适应。然而这个适应你又无法持续,因为你到了C电梯,仍然要重新学习。所以电梯的按键设计,基本上要有行业标准的。

    然而华星路的创业大厦就是特立独行的。大多数电梯将开门、关门的按键放到了数字键的上部。而创业大厦则是将报警按键放到此处,开门关门则放到了数字键的最下方。

    我2008年到阿里巴巴上班(当时公司就在创业大厦),觉得这里的同事很不友好。好几次晚到一步,电梯门即将合上,我大步向前,边跑边叫等一下。里面的人面带笑容,靠门的MM伸手一按键,电梯门无情地关上了。

    这里的人都太不友好了——我一直怀抱如此恶念。直到有一次我上了电梯,电梯门即将关闭时,有几个迟到的同事飞奔过来,我二话不说,直接按开门键——叮呤呤,居然响起了铃声,有个声音问:什么事?我定睛一看,原来本以为是开门键的地方,是个报警的按键!原来如此!

    上图右下方我写了一个HISTORY, 历史。这是开个玩笑。假设某人暗恋已久的人向TA飞奔过来,希望电梯等一下,结果由于此不良设计,让这个暗恋的人心存纠结,错过美好姻缘。本来两个人结合有可能生出一个能够改变历史的天才,结果错失了。

    去年11月底我再去创业大厦,发现此电梯的故事还在继续——毕竟更换电梯成本太高了!而且在报警的按钮下方,被保安贴了一张醒目的即时贴,上面写着几个大字:这是报警用的!哈哈,看来保安也不堪忍受”假报警”。但是没用,贴着这个提示并不能有效阻止错误发生——用户首先是凭借习惯,其次才是认知和学习。

    原因正是不良交互设计。

    这里写图片描述

    上图是今年去千岛湖outting拍的酒店里的门以及开关。酒店的门打开貌似是在教我们做肢体协调操,需要两个手同时按指示操作才能打开。试问门的安全性在于防止外面的人破门而入,不是为了防止屋内的人出门。不晓得这个过度设计有何作用。总之,妈妈不再敢把小孩子留在房间自己不带房卡出门。因为一个8岁以下的孩子,基本上不会开此门。

    右下角是大部份酒店都有的变态的灯。你不知道什么状态是开,什么状态是关。当然,由于酒店系统,某处灯光是由多个按键控制,无法用统一的交互解决。但是这是系统的问题,不是用户的问题。

    网页上的无教养的表现更多了……

    某日我看到一封邮件。我大概一瞄,我就看到几个关键词:免费,即可获得,10元,立即领取。

    (我和大部分用户一样,不会逐字去阅读什么什么介绍,基本上都是在抓关键词,要提高效率,请精简网页文案,强调文案重点)。

    这里写图片描述

    但是,当我点击立即领取之后,直接给我一个添堵的页面:我没有资格。(文案的重要性!)

    我不知道是不是不登陆造成的,当时的设计应该考虑各种风险给出周全的解决方案。

    从数据上去看,也许会看到活动的转化率很低很低,也许活动方会认为是投放人群不对,页面不够吸引人,或者10元的力度不够等等。但是只要认真去找问题,也许会发现不良交互产生了严重影响。

    这里写图片描述

    当然,我还搞不明白,像UIGARDEN这种盈利模式单一急需用户注册的网站为何会在注册页面和用户过不去。

    你链接不上GMAIL的服务器是你的不对,别说用户的EMAIL是无效的好不?

    这里写图片描述

    再看麦考林糟糕的经历,我不知道具体的数据如何,但是麦考林肯定有大量非商品质量问题,也非服务问题造成的退货。

    也是由于糟糕的交互设计引起的。

    这里写图片描述

    我填写了收货地址后,上图是让我指定送货方式。麦考林给出了两个方式可选,我毫不犹豫选择了邮局方式——因为EMS太贵了嘛。谁知道这邮局还真的是邮局——5天后,我收到前台给我签收的一个包裹单,让我去邮局凭借身份证领取包裹。要知道,快递送货上门时代,我怎么可能去邮局领包裹?打电话给麦网,客服小姐说,因为我的收货地址不支持快递,所以只能让我选邮局。

    我这才知道是怎么回事。原来麦网为了解决用户选的配送方式不可用的问题(淘宝也经常存在这个问题),故作聪明使用了邮编去匹配配送方式的方法。我填写的邮编他们系统解读不支持快递,因此下个页面就不给我这个选项。

    邮编在今天已经是用户认为很不重要的字段,他们会不确认就随便写。另外,麦网要避免这个问题,也可以让顾客明白有哪些配送方式不可用且告诉原因而不是简单隐藏了事。

    所以,我们需要交互设计去做什么呢?

    客明白有哪些配送方式不可用且告诉原因而不是简单隐藏了事。

    1. 发现并解决这些问题

    上面的那些交互的问题,有些人根本发现不了。有些人发现了并不知道如何解决嗯。

    交互设计师需要发现并有一套方法去解决。

    1. 平衡——引入用户视角和方法。

    还是那个老图:

    这里写图片描述

    3.控制成本,降低风险

    这里写图片描述

    交互的系统方法,让交互的输出物快速迭代呈现,并且低成本。不需要开发,不需要视觉,就能够将抽象的想法具像呈现原型,方便的且低成本的工作方法,方便项目组进行多种可能性的探索。

    在一轮轮的评审和讨论中让决策人和参与方根据项目的阶段逐步聚焦。最终输出一个最终版的原型。

    4.术业有专攻

    当然,产品经理和视觉设计师若有可能多做一些,也可以不需要交互设计师。事实上,大多数创业型的公司,确实是没有交互设计师的。但这不意味着交互设计缺失,有可能是产品经理或者视觉承担了此阶段的工作。但是,产品经理在平衡商业和用户的点上,往往会更多站在老板或者 KPI的角度,而视觉设计师感性大于理性,更加纠结于各种视觉细节,会不自觉在项目前期就引入太多视觉元素,让项目组在讨论中偏离核心方向。

    总归来说,他们的专攻方向是不一样的。

    这里写图片描述

    三. 什么是交互设计

    这里写图片描述

    我个人认为交互设计师的工作围绕以上四件事情展开。入门的人,很容易将重点落到第二点:快速迭代呈现上,所以他们会直接问:你们都用什么工具?能给我们培训一下工具吗?

    其实工具真的不是重点,想法若有,发现白纸和笔都是最好的工具。所以进阶的交互设计师后来会明白这一点,他们会回归到需求本源:这是什么?为什么要做?我们要解决的是什么问题?非要如此解决吗?

    举个例子,若有需求方说:帮我设计一个花瓶。小A设计师就直接去做花瓶去了。小B多问了几句:多大的花瓶?什么材质的?什么时候要?预算是多少?小C则问:你要花瓶做什么的?是放鲜花还是做室内装饰用的?小A肯定做出了花瓶,但是未必是顾客想要的。小B也做了花瓶,顾客也买单了,已经合格了。但是小C则有可能让顾客惊喜。顾客表面要的是花瓶,但是实际上是在寻求一种解决方案。他要解决的问题有可能是风水问题,有可能是美化家庭,有可能是装一束鲜花……若不了解这个背后,你也许只能给他一个花瓶,而不是其他的更加适合他但是他描述不出来的,甚至没意识到的。

    在实践中,我曾遇到一个需求,在一个新的频道即将发布前,需要做一个预热页面。这个预热页面比正式的页面提前几天发布。运营同事说需要提前让目标顾客知道一个新的频道要上线了,那么原来的设想就是在这个页面上介绍一下新的频道,以及新频道上线后的精彩活动。

    追问:你的目标是让这些人知道有这件事情,还是让他们知道有这件事情并且在频道发布后回访呢?需求是后者。那么一个简单的介绍页面只能达到前者的目标。这群人知道这件事情,但是一周后就会淡忘这件事情,这群人绝大多数不会成为正式频道发布后造访的那拨人,那为何还提前预热?要达成后者的目标,我们则需要放钩子,比如在预热期间让用户抢积分,免费送积分,折扣券等,并且限定了积分或者折扣券只在正式发布那天有效等。

    数据可以看出一些需求,但是数据是个有意思的武器。武器可以让用户的行为显像化直观化,但是你依然不了解这些数据的背后有什么样的顾客行为。比如,数据显示某购物网站主流用户也许是集中在25岁到29岁。这是个事实。那么我们的产品有可能会认为就是要满足这类顾客的需求。但是有可能是我们在设计上太偏重这个阶段的用户群,让其他用户更难去用我们的产品。

    另外,交互要始终平衡的除了商业与用户、技术,就是ROI, 也即投入产出比。

    解决一个问题,满足一个需求,有多种方法。有的属于过度设计。有的属于隔靴搔痒——需要多搔很长时间才能解决问题。所以交互需要有四两拨千金的意识,在探索阶段,不放过一个灵感,多做一些探索去求寻最佳解决方案。在后期则当快刀斩乱麻,当断则断。

    另外,Patterns,也即”模式”非常重要。是高级交互设计师提升工作效率的非常重要的方面。

    所谓模式可以认为是行业内的通用的已经得到过验证的交互模型。比如登陆,注册,表单校验,搜索列表,搜索筛选,评价列表……

    你不需要重头开始,更多的是借鉴改良。如果你多看多收集多思考,当开始工作时,你的脑子里会已经出现了一些成熟的解决方案。这些方案因为已经在应用,即使没有用研测试,也能够减少风险。

    交互设计师的工作——

    这里写图片描述

    在整个项目流程中,交互则在四个阶段有不同程度的参与,并且这几个阶段并不是严格的串行,而是并行中迭代的。

    这里写图片描述

    1. 需求阶段

    参与讨论,了解并挖掘需求。进行用户需求分析(也会与BI部门以及用研配合,走访用户,做用户调研等),任务分析,提供网站架构图(site map), 网页流程图(page flow)等,协助产品经理细化需求,从BRD(商业需求文档)到PRD(产品需求文档)

    这里写图片描述

    1. 原型阶段

    同步PRD进程,输出各阶段所需的产品原型,也即线框图(Wireframe). 探索满足需求的各种解决方案(包括任务流以及单页面交互),并组织评审和讨论会,在评审和讨论后,输出一个确认版的线框图以及交互说明文档。

    此阶段若有必要,也会配合用研进行可用性测试,以便提前发现问题。

    这里写图片描述

    1. 视觉-前端以及开发阶段

    演变成为UED内部项目经理,对UED整体时间进度负责,讲解需求,答疑,验收视觉以及前端、开发成果。根据他们的反馈,改进交互设计,并与产品经理协调。

    这里写图片描述

    1. 优化阶段

    观测核心数据变化,进行可用性测试和用户调研,以便优化下个版本。

    这里写图片描述

    分享下交互常用的工具和方法。继续关注哦~

    这里写图片描述

    一. 理论前提

    1. 人机交互与人类信息处理机制理论

    既然产品设计出来不是给设计师用的,而是给用户用的,他们如何理解、认知、使用产品才是最重要的。因此”定义用户”,”了解用户”,”研究用户”是交互设计前需要做的重要工作。

    这里写图片描述

    要了解三种不同的”模型”:实现模型,用户心理模型以及表现模型。在《交互设计精髓》书中(英文名:about face3.0about face3.0),作者Alan Cooper写道:设计者最重要的目标之一,就是要使表现模型和用户的心理模型尽可能地接近,因此,设计师能否详细地了解目标用户所认为的”如何使用软件”非常关键。

    这里写图片描述

    图1:实现模型,表现模型,用户心理模型

    我们举个简单的例子去阐述以上的理论。电路板……一个普通的家庭妇女一天要用到电路板很多次,早上插上豆浆机,开启微波炉,开启电饭煲,洗了头发插上吹风机,晚上按亮台灯……她只需要做的就是保持插头接入电源,然後开启电器即可。若你采访她说:你了解这些电器的工作原理吗?你知道为何会有电吗?

    除非她是个物理学家,要不然她有可能给出和我一样的答案:我以为我只要插入插头,插座里的开关就会被连接起来,电流就会从某个中心站源源不断输入到电线里,进而启动我的电器。没错,我想到就是输液一样的经验……电流正如输液管中的液体一样被输入到电器里。

    但是实际上这个简单的动作背后有着无比复杂的电路原理……请原谅我根本无法去描述这个工作原理.它想起来或许如同下图中左侧的电路板……然而实际原理比这个还要复杂。我不了解这些,但是我的认知虽然错误,但是完全不妨碍我去用”电”。因为设计人员给了我一个简单的插头和插座,以及各种简单的开关。

    这里写图片描述

    图2: 实现模型电路板和用户心理模型插头对比

    很多产品设计也是如此,你不需要教育你的用户成为精通电路板以及输电站工作原理的专家才让他们能够用你的产品。他们是如何理解的?虽然是错误的,但是这预示着你应该如何去”表现”你的设计。

    1. 了解用户—行为、态度、能力

    但凡交互设计的书籍都会从了解用户开始。可是了解用户的什么呢?

    首先了解的是人本身,人类的信息处理机制,心理学,以及消费者心理学、行为学等等。

    其次才是商业环境下的用户,再可以细分到某个行业的用户,比如电子商务购物者研究。和市场研究学对消费者的研究有所不同的时,用户体验设计部的用户研究员更关心的是用户产生的行为研究(behavior),而不是观点(view).

    这里写图片描述

    图3:用户行为变量

    以上四个领域都属于要了解用户的维度,用户体验设计部更加偏重于对于用户行为的研究,通过用户行为的观察、研究,挖掘出用户真正的内在需求。

    在目前的UED组织架构中,虽然有用户研究员这一专门的职位,但是作为交互设计师,依然要尽可能亲自参与了解用户的工作中,下图所示的了解用户的不同层次的工作,若有兴趣,可以多多涉猎。

    这里写图片描述

    图4:从了解人到了解用户,从了解心理到研究行为

    1. 可用性及交互设计十大原则

    从上世纪的80年代起,Jakob nielsen(网站:http://www.useit.com/)就一直是可用性领域的领军人物。

    他提出,通常来讲,要使产品或者服务具有可用性,至少需要考虑以下5个维度:

    可学习性: 系统应该很容易学习,这样用户就可以快速开展工作

    效率性:一旦使用即可提高生产率

    可记忆性:即使离开一个系统一段时间,之后重新使用这个系统,也不用一切从头学起。

    容错和错误预防能力:最低的错误率,让用户很少出错,即使出错也很快能够恢复,必须保证不发生灾难性的事故。

    主观满意度:使用起来令人愉悦。

    要举出这5个方面的反例,也不难,用过公司财务系统,Oracal的同学自然会清楚。为什么有些系统必须要培训了才能上手,并且一段时间不用,就会忘记掉怎么用,最糟糕的是,在使用的过程中,你充满了委屈和郁闷。

    可用性以及其他相关因素的关系(整理自《重塑用户体验》一书):

    这里写图片描述

    图5:可用性与相关因素关系

    在5大维度的基础上,Jakob nielsen发展了一套沿用至今的启发式评估指南兼原则。在用户研究领域,看一个新的产品是否达到可用性目标,除了邀请真实的客户外,也会让行业专业、用户体验设计师们,用Nielsen提出的十大交互设计原则作为启发式评估的纲领,去审视设计作品。

    这里写图片描述

    图6:十大启发式评估原则

    这应该是交互设计领域理论的沉淀结果。

    二. 意识前提

    在实际应用中,除了掌握基本的理论基础,还需要了解工作环境对于交互设计师的特殊要求。据我的经验,以下几点需要注意:

    1. 好的解决方案是平衡

    什么是好的设计方案?工作环境为结果买单,为过程喝彩。首先这个方案必然是技术可行的,这个方案必然是达到商业目标的,这个方案是在满足种种期望下,符合种种制约条件下的尽可能用户体验最优化的产物。如果用户体验是10分,你先是做到10,然後综合各种因素削减做到7。而不是死守着10不放,也不是一开始就奔着7去做。交互设计师如何拿到结果?

    1. 多谋,方能善断

    交互设计是理性的,也是感性的,更是理性的。它始终在寻求最佳解决方案——现实中往往没有出现过这个最佳方案,只有最适合的。所以交互设计师不能放弃探索。在任何一个既定的需求下,都有着无数个解决方案。除非你相信一开始蹦到脑子里的就是最适合的。否则多做一些尝试,多听一些意见,多做一些评审。

    1. 不求一次完美

    很可能到了要交付的日期,你脑子里还在探索。你又有了新的解决方案。渴求完美的心理,几乎是设计师的通病。产品上线后糟糕的用户反馈,会比你的主管给你打个糟糕的KPI的分数更让你难以忍受。但是上线后产品更加容易得到用户的行为数据和反馈,让下一次的优化更加有目标。该放手就放手吧。

    掌握节奏感,要记住自己是项目中的一环,确保项目的进程是首要任务。记下那些优柔寡断,记下那些纠结,在发布之后的用户研究需求里提出来去验证。

    三. 交互方法

    1. FLOW CHART 流程图

    流程图种类非常多,一般常用的有任务流程图(Task Flow)以及页面流程图(Page Flow).

    任务流程图(Task Flow)——为了达到某个目标,用户需要进行的各项任务,以及各项任务之间的逻辑关系,一般来讲,技术人员绘制的UML流程图以及产品经理绘制的业务流程图都属于任务流程图。

    举一个GTD(getting things done,时间管理)的任务流程图:
    这里写图片描述

    图7:GTD流程图

    我们可以根据以上的时间管理启发,轻松绘制出家庭收纳指南流程图:

    这里写图片描述

    图8:家庭收纳指南流程图

    当任务中参与部门较多时,流程图如果有必要体现出不同节点各部门、人员如何配合,改换流程图的形式,多用泳道流程图表示:

    这里写图片描述

    图9:年度预算流程图(泳道图,来源于网络)

    而页面流程图(Page Flow)则多由设计师产出,用来表示为了完成所有任务,需要的页面以及页面之间的跳转关系。任务流程图上的某些任务是在页面上完成的,有些可能不是,比如通过邮件、系统消息等。在分析任务,以及分析任务流程图并得出页面流程图的过程中,设计师基本上可以知道需要多少个页面,每个页面的目标和设计需求是什么。

    页面流程图能够提供”俯瞰全局”的视角,让设计师不陷入到某个具体页面的细节里,始终把握大局。另外能够帮助设计师查漏补缺,在没有详细开展线框图及交互细节设计之前,不是凭空去想像复杂的交互行为。

    好的页面流程图应该有各页面的编号,并和线框图的页面对应起来。它也可以在以后作为项目组进行任务走查的基础。

    这里写图片描述

    1. WIRE FRAMES 线框图

    在《聊聊线框图:那些必要的理论和前提》文中,我对那几个观点没有其他补充性的内容:

    1. 线框图不是”画”出来的,而是想出来的,是确认出来的。

    2. 精美细致并不重要。

    3. 从最简单的开始,逐渐补充细节。

    4. 选择性价比最高的工具——不要把时间花在学习工具上。

    线框图说白了,也只是工具而已。作为交互设计师,不仅仅只有这个方法才能表达产品。

    1. 讲故事

    交互设计师要有凭空想象复杂的交互行为的能力。作为一个路痴的我,根本无法凭空去想象一个火车站的架构,地铁站的架构,我一直认为自己在”凭空想象复杂的交互行为”能力方面不足。但是,我愿意去学习和弥补。利用周全的流程图即是弥补的方法之一,通过流程图,可以强迫自己把各种分支流程都考虑到,穷举出各种CASE. 而另一个好用的方法即是讲故事。

    直到现在,每当有人给我讲他的一个新的构想的时候,我总是忍不住打断他吃力的讲解,说:讲个故事吧。假设现在你的方案都实现了,假设有了这个东西,假设你的用户是小明,他……

    我们也总是能发现,讲故事除了引人入胜,更能发掘出本身不符合逻辑的事实——因为故事很容易讲不下去。但是没有故事,片段的话语很容易”蒙混过关”。

    角色模型,任务走查,故事板归根结底是为了讲需求和产品设计场景化,因此我将他们都统一为一种技能:讲故事。

    要讲一个好故事,你可能得:

    1. 设定主人公,他们是谁,有什么特征?他们的需求是什么?

    2. 设定故事的背景,要引人入胜,故事从哪里开始?

    3. 设定你的故事线,你可以凭空去讲,在你有了原型之后,也可以用页面流程图、任务流程图等将故事串起来,点击具体的页面,让项目组和你一起在故事中进行任务的走查。

    这里写图片描述

    交互设计的方法还有很多,比如卡片分类法、概念图、站点地图(SITE MAP)等,无法一一展开了。有兴趣的同学自行了解哈。

    至于交互设计的工具:

    1. 纸和笔,脑子和嘴巴——这是开始设计的第一步,通过沟通了解需求,挖掘需求,笔和纸是具像化设计的第一步。

    2. Axure——我用它来做线框图、流程图以及详细流程图,虽然它有不尽如人意的地方,但是依然是目前来看最符合交互性价比的工具。

    3. OmniGraffle——苹果系统里最好用的画图工具,自从用了它之后,流程图,概念图之类的,基本上就用它。

    来自:阿里巴巴资深交互设计师
    原文地址:heidixie.blog

    作者:Heidixie

    展开全文
  • 交互设计沉思录:顶尖设计专家Jon Kolko的经验与心得(原书第2版)》由交互设计领域的思想领袖Jon Kolko所著,是交互设计领域的里程碑之作。本书完美地将当代设计理论和研究成果融入交互设计实践中,将对交互设计...
  • 和谐界面:交互设计基础课件

    热门讨论 2010-01-24 11:22:50
    《和谐界面:交互设计基础》配套课件!《和谐界面:交互设计基础》阐述了如何将人机交互的研究和理论应用到交互设计过程中,涵盖并超越了传统的人机交互范围。每章首先讨论HCI主题或概念,然后从交互设计的视角深入...
  • 信息可视化-交互设计(原书第2版)

    热门讨论 2014-02-25 20:56:19
    《信息可视化:交互设计(原书第2版)》系统地介绍了信息可视化的概念、基本技术和应用,主要内容包括:信息可视化概念及案例、信息感知及信息表示、交互式设计、多维信息可视化、图形可视化、案例分析。通过《信息可视...
  • 交互设计原则

    千次阅读 2014-06-10 15:49:43
    交互设计原则:常见附加工作陷阱 不要强迫用户到另外一个窗口中完成影响本窗口的功能; 不要强迫用户记住他将事物放在层次文件系统中的哪个位置; 不要强迫用户调整窗口大小,当窗口在屏幕上弹出时,程序应该为其...
    交互设计原则:常见附加工作陷阱
    不要强迫用户到另外一个窗口中完成影响本窗口的功能;
    不要强迫用户记住他将事物放在层次文件系统中的哪个位置;
    不要强迫用户调整窗口大小,当窗口在屏幕上弹出时,程序应该为其内容调整合适的大小。不要让它大而空,或者小而需要不停地滚动;
    不要强迫用户移动窗口,如果桌面上存在空闲空间,将窗口放在其中,而不是直接将其放在已经打开的程序之上;
    不要强迫用户重新进入个人设置,如果已经设置了字符、颜色、缩进或者声音,确信他不需要再做一遍,除非他想改变;
    不要强迫用户在填充字段时满足完整性,如果用户想从交易登录屏幕中忽略一些细节,不要强迫用户输入,假定他不需要重输入,数据库的完整性不值得强迫用户;

    不要强迫用户请求允许,这通常是不允许用户在输出的地方输入的症状;
    不要让用户确认其行为,这隐含存在健壮的撤消功能;
    不要让用户的行为产生错误。

    交互设计原则:窗口行为
    整体的视觉隐喻是用户能否理解系统的关键。
    避免模态,模态是一种程序可能进入的状态,在这种状态下用户操作的效果与正常状态有所差异,它实质上是一种行为的转向。
    层叠窗口,层叠窗口的概念是好的,但在真实世界中却不太实际,屏幕上同时运行3个或更多的应用程序或文档用户就得经受考验。也因此促使微软引进了任栏,而苹果公司则发明了Expose,Expose很吸引人
    可以用来追踪所有打开的窗口,不过由于和Dock上最小化的程序集成的不好,所以使用起来公平是有些问题。
    多窗格应用程序
    微软的Outlook2007是多窗格应用的例子,多窗格的好处在于独立而相关的信息可以轻松地在单个独占屏幕上显示,并能将导航和窗口管理的附加工作几乎减少到零,对于任何一个复杂的独占应用程序,相邻窗格的设计尤为必要,特别是在一个窗格中提供导航或构造块,以及在相邻窗格中支持数据查看或数据构造的设计,似乎代表一种可重复的有效模式。现在的客户端技术比如Ajax,Flex本身已经可以提供类似于窗口的行为。

    交互设计原则:对话框是另一个房间,去之前要有个好理由;把功能置于需要它们的窗口中
    Adobe Lightroom比Photoshop(调节亮度对比度的对话框)进步了很多,关键的操作都按照用途被安排在一起,在主窗口上靠近了被调整的图片的位置上直接展现出来。

    交互设计原则:正确运用对话框
    一个糟糕的设计就是用户界面上充斥大量的模态对话框,用户不得不在对话框的迷宫中前行,这这创造流畅的交互带来了很多困难。
    把主要的交互操作放在主窗口中
    很多设计师认为对话框是GUI中最主要的用户界面的习惯用法,这在很大程度上是对话框太容易实现的原因造成,于是很多应用程序使用对话框来提供用户和应用交互的主要手段,因此在大多数应用程序中,使用者被迫在主窗口和很多对话框之间跳来跳去,不可避免地带来疲劳和沮丧。
    对话框适合那些主交互流之外的功能
    我们需要把使用者从主工作流中强制带出来,让他们集中注意力关注在某个特别的交互上,这时对于这种交互主流程之外的功能或特性来说是合适的。任何可能会让人困惑、危险或者很少使用的功能放在对话框中可能都会有利。一些容易产生混乱的行为对屏幕图像产生立即和总体的改变,这种改变在视觉上对用户干扰很大,应该将其与不熟悉的用户隔离。对话框常适用于表达不常使用的功能和设置,可以用对话框将这些操作与更为频繁使用的功能和设置隔离开,对话框也非常适合集中于某个主题相关的信息,与该主题相关的所有信息和控件都放在一个地方,使用者无须在界面上到处寻找,从而减少了导航浏览的附加工作。
    对话框非常适合用来整理关于某个主题相关的对象或者应用功能
    对话框主要为两个主体服务,即熟悉程序的频繁使用用户,用它们来控制更高级或者更危险的设置:不熟悉程序范围和使用的用户,以及使用对话框学习基础知识的用户,这意味着对话框必须是紧凑和功能强大,快速而流利的,并且在使用上清晰和具有自我解释性。

    交互设计原则:对话框的基础结构
    每个对话框都必须有一个标题,来标示它的用途,如果某个对话框是一个功能对话,那么这个标题就应该包含这个功能的动作,一般采用动词;如果对话框用来定义某个对象的属性,那么其标题就应该包含该对象的名字或者描述,总之在属性对话框的标题中使用对象名;每个对话框至少有一个终止命令控件,被触发时会让对话框关闭或者消失,比如“确定”和“取消”,另外右上角的关闭按钮也是一个终止命令的习惯用法。

    交互设计原则:模态对话框
    打开一个模态对话框后拥有它的程序不能继续进行,直到对话框关闭为止,这种对话框在其轨道上会停止所有的进度,单击该程序的其他任何窗口,用户都只会听到粗鲁的“嘟嘟”声表示无法反应,它的所属程序表面所有的控件和对象在模态对话框工作过程中暂停工作,当然在模态对话框打开时用户可以激活其它程序。有些模态对话框是针对整个程序或整个文档进行操作的,有些模态对话框是针对当前的选择进行操作的,在这种情况上,在使用者已经调用这个对话框后不能改变当前的选择,这是模态与非模态对话框的最要重区别。

    交互设计原则:非模态对话框
    打开一个非模态对话框可以不用打断父程序,无须停止进度,应用程序也不会冻结,主程序继续调用,你也可以重新回到主程序,你可以改变选择。在某些情况下,也可以在主窗口和非模态对话框之间拖动动对象,这种特性使其在画图类型的程序中作为工具或对象调色板时确实很有效。非模态对话框很少建立行为规范,尤其是终止命令。视觉上区分非模态对话框与模态对话框是必须的,并且为非模态对话框提供一致的终止命令,同时非模态对话框也必须特别节约像素,它占据前面的中心位置,不必要的情况下不要浪费像素,尤其在使用悬浮工具板时,应该把标题栏上的关闭框作为唯一终止控作。
    例:Adobe Fireworks MX中的停靠调色板提供了和非模态对话框相类似的交互活动,但并不需要使用者花费过多的精力和注意力调用、移动并消除对话框,不必太动脑筋,我们就可以看到它们和工具栏非常相似,它们也在用户界在,上使用标准控件来提供直接、视觉化且一致的应用功能。
    Adobe Lightroom 中的侧栏取代了几十个对话框,不同点在于侧栏不需要使用者调整其在屏幕上的位置,使用者也无须对它们一个一个地解锁或者撤销,整个侧栏也是可以隐藏的,这进一步降低了管理工作,在但在呈现功能方面超越了对话框,是显著的进步。
    Cooper设计的CRM客户关系管理系统软件,其中采用了专门的属性区域,当某个使用者选择了工作区的一个对象时(屏幕上半部分的左面),其属性就会显示在下面,这样既保持了使用者使用环境,同时也把屏幕管理工作降至最低,这里我们不说他的软件设计优劣,只谈呈现的交互设计。

    交互设计原则:不同用途的属性对话框,功能对话框,进度对话框,公告对话框
    属性对话框向用户呈现所选对象的属性或者设置,并且允许用户改变;功能对话框通常从菜单打开,它们是最常见的模态对话框,控制单个功能,如打印、插入对象或拼写检查等;进度对话框由程序启动,而不是根据用户请求启动的,它们向用户表明当前程序正在忙于某些内部功能,其他功能的处理能力可能会降低。当程序变成无响应试状态时,必须通知用户。
    例,许多程序采用把光标变成沙漏的等待光标暗示用户进度,但是进度对话框是一种更好且有信息量的解决方法,每个进度对话框有如下4个任务:
    向用户清楚地表明正在运行一个耗时的进程;
    向用户清楚地表明一切正常;
    向用户清楚地表明进程还需多长时间;
    向用户提供一种取消操作和恢复程序控制的方式。

    微软XP的进度表基本上是正确的,对于资源管理器中的任何一次移动、复制或删除操作,它显示了设计合理的进度对话框,其中提供了操作剩余时间的线索,并使用动画显示文档从左侧的文件夹飞到右侧的文件夹或垃圾箱,用户的心理模型认为计算机内部的某个事物在移动,这个精致的小图片真实的反映了移动的事物。从用户的角度看,这个对话框让人耳目一新,计算机的外部形象反映了计算机的内部操作,不足之处在于没有显示移动中剩余的文件数量,否则它可以方便地提供更好的进度反馈,这个在windows 7中得到了优化。
    网页浏览器每次加载页面时并不弹出一个进度对话框,而是在窗口底部的状态栏上显示一个进度指示器,用户可以很容易地了解到当前的进度,而面前部分加载的页面也不会被遮挡,这种情况下是非常好处的,不过在运用这种进度对话框之前,还是需要考虑它是否适合于你的用户。
    普遍存在的错误信息框是最典型的公告对话框,通常程序名在标题中显示,一些概括问题的简短文字作为显示主体,一个图像图标表明问题的严重性同学有一个OK按钮,通常这些构成了一个统一的整体,有时加上一个启动的在线帮助的按钮。
    绝不要用临时对话框作为错误信息框或确认信息框。

    交互设计原则:管理并设计对话框的内容,标签对话框,扩展对话框,级联对话框
    标签对话框,允许你在一个对话框中填充更多控件,但拥有更多的控件并不一定意味着用户会发现你的界面更易于使用或者功能更为强大,并不意味着用户会发现你是将不同窗格的内容必须有放在一起的道理,否则这种退化对程序员有利,而不是对用户有利。标签之所以如此成功是因为该习惯遵循了用户有关“事物存储”的心理模型,即单层分组,不同控件组成多了个平行窗格,只有一个层次深度,但是这种习惯用法经常被滥用。比如word2003中的options对话框竟然有12个标签堆叠在一起就破坏了这个习惯用法的作用。不要堆叠标签是一个设计原则。
    扩展对话框,在许多主流应用程序中可以找到它们,例如word的“find”(查找)对话框,扩展后显示更多控件,有“更多”和“更少”的扩展按钮,可以让对话框返回初学者状态。
    级联对话框,是一个糟糕的习惯用法,它是在一个对话框中的控件,通常是按钮,点击后会在另一个层次关系的嵌套中调用另一个对话框,第2个对话框经常覆盖第1个对话框,有时第2个还会调用第3个,幸好,级联对话框现已失宠。标签对话框的优势在于处理复杂的广度问题,而级联对话框更适合处理深度问题,问题在于层次太深是界面太过复杂时的主要症状,如果发现除了用户通常不需要的模糊信息以外,你的程序仍需要使用级联对话框,那么应该全面审查界面的整体复杂性,而不是使用这种后落的级联思想。


    交互设计原则:错语对话框,警告对话框,确认对话框,取代对话框,错误对话框
        错误消息框愚蠢地停止进度,应该避免,人们讨厌,抵触,责备发出错误消息的一方,我们要通过消除错误对话框来大幅度改善界面的质量。错误消息真正所做的只不过是保护程序不陷入麻烦,只不过是防止用户不向数字段中输入字母,它与防止用户不输入错误数字无关。让错误成为不可能是我们的目标。同时我们也要记住当系统告诉用户他们失败时,用户会觉得很没面子。一个合理的错误消息框应当是有礼貌而清楚的说明问题、有启发和有帮助的提出解决问题的好建议,如果可以将操作按钮和产生结果也描述得很清楚,它甚至没有暗示用户的行为有任何缺陷。
    警告对话框
        警告是通知用户程序的行为,而确认给用户赋予一种忽略该行为的权力,这也是要消除的习惯用法。例如,word查找对话框在未搜寻,完成相关的任务时弹出一个模态的警告对话框提示未找到,或者操作失败,在这里报告事实是查找功能的另一个功能?如果不是,为什么要用不同的对话框呢?非模态的对话框已经足够。软件需要告诉用户其行为,如果用户期望这样,它应该在主屏幕上有可视化的指示器,使用户可以获得这种状态信息,启动模态警告对知框来宣布一个没有请求的操作已经够糟,又为一个已经请求的操作再发起一个警告信息就更加荒谬。有些自动启动却杀毒失败的杀毒软件就是一个例子。
    确认对话框
         它的弹出是程序对自己的行为不自信而来询问用户的许可征求,有时程序是在对用户的行为做事后的劝告而提供确认;有时程序认为没有能力做决定,而用确认对话框让用户替它选择,无论怎么样总是来自己程序而不是用户,这意味着它们是实现模型的反映,而不是用户目标的代表,向用户展示实现模型,产生的用户界面一定是让人不愉快且低劣的用户界面,存在确认对话框是不恰当的交互呈现,我们永远不能把责任推卸给用户,我们的程序应当得到用户的永久信任,恰当的解决方法是使动作易于恢复,并提供足够的非模态反馈。大量滥用确认对话框造成的后果就像寓言故事里大叫“狼来了”的男孩,当最后真正危险时,确认对话框不难起作用,困为它在没有危险时叫了太多次。消除确认对话框的办法是:让所有的操作都可以撤消,当程序行为不合时宜时,让用户发起停止并撤消的命令,取代预先用确认对话框提问的方式。提供非模态反馈来帮助避免用户犯错误。
    取代对话框,丰富的非模态反馈
        我们否定了以上三种对话框的友好性,但是持续的反馈又是用户确实需要的,这时我们可以通过改变交互渠道来达到我们的目的,即丰富的视觉非模态反馈,听觉反馈,负面听觉反馈(宣告用户错误),正面听觉反馈。
    丰富的视觉非模态反馈
    这种类型的反馈在提供当前应用的对象或过程的状态和属性的深入信息方面非常丰富,因为它运用了屏幕的像素,它是视觉化的,非模态的,这种信息是预先显示,用户不需要特别的操作或模态变换来浏览和理解这种反馈。例如,MAC,当你从互联网上下载一个文件时,下载的文件此伏彼起为一个图标出现在桌面上,用一个小的动态更新进度栏在视觉上表明下载的百分比。创造丰富模态视觉反馈必须注意的一个要点是它不是为新手用户创建的,丰富视觉非模态反馈是用户可以实时发现的内容,当他们发现后会感到如此奇妙,但是与此同时他们也需要菜单和对话框的支持来寻找需要的信息,这意味着取代警告和严重问题警告的丰富视觉非模态反馈对用户来说必须特别清晰,必须确保这种状态在视觉上比次要的提供信息的丰富视觉非模态反馈更突出强调。
    听觉反馈
        可以用听觉来监测输入是否成功,但建议这种听觉反馈不要和错误信息框发出的嘟嘟声相同,建议作为问题反馈的听觉指示是没有声音,和正面听觉反馈相比,负面反馈才是合情合理的。
    负面听觉反馈:宣告用户错误
        伴随错误消息的刺耳“嘟嘟”的噪声是对用户错误的公然宣告,它向听力范围内的所有人公布你已经做了可恨而愚蠢的事,人类喜欢听一切正常的声音,他们也需要知道什么时候做得不太好,但是这不意味着他们喜欢听到这些,负面反馈系统明显不如正面反馈系统受欢迎。在无声和有声的负面反馈之间人们会选择前者;在无声与有噪声的正面反馈之间,人们会根据个人情况和品们选择;在无声音与柔和悦耳的正面听觉反馈之间,人们会选择后者。在程序中我们从来没有为用户提供过高质量的正面听觉反馈,所以不奇怪人们会把声音与坏的界面联系在一起。
    正面听觉反馈
        正面听觉反馈的有效性起源于人类的敏感性,没有人喜欢别人告诉他失败了,错误消息框是负面反馈,在用户做错了事时通知用户,沉默可以确保用户知道,而又没有实际告诉他失败,它有明显的效果,因为软件不必伤害用户感情,而又能完成任务。游戏一般擅长正面听觉反馈,MAC OS X还用精细的正面听觉反馈在文档保存和拖放时做了很发的工作,当然,听觉反馈必须在正确的音量状态,windows 和 MA提供了一个标准音量控件,所以良好听觉反馈的障碍已经排除,但是听觉反馈的音量不应该超过正在播放的音乐的音量。

    交互设计原则:定义视觉框架
    1)开始视觉语言研究,做一个整体格调评估,保持和交互设计的粗细程度相匹配,但不要给本来简单粗略的交互设计进行精雕细琢的视觉设计。

    2)将选择的视觉风格运用在产品原型上,在提交视觉设计前进一步使视觉风格完善,从而可以体现和反应关键的行为和信息。
    绝对不要向利益关系人展现你不满意的设计方案,可能那正是他们喜欢。

    视觉信息设计
    视觉信息设计者关心是的如何将数据,内容及导航视觉化,而不是交互功能。他们的技能对于视觉设计非常重要,尤其是具有大量数据的应用和网站,这里内容常常比功能更重要。信息设计的重点在于将将据以一种容易理解的方式表达出来,主要是通过使用视觉属性来控制信息的层次,这些视觉属性包括颜色,形状,位置及范围等。信息设计中常见的内容包括图表,图形,以及其他表示量化信息的形式。

    视觉界面设计的组成要素
    如何处理和组织好视觉元素,有效传达行为和信息。当两个对象有相同的属性时用户可以认为它们是相关,或者类似;如果两个对象中的属性存在着大量的不同,这会吸引我们的注意。
    形状
    它是圆,方,不规则的?用户习惯通过外形轮廓来辨识物体,但是形状作为辨识一个物体的一个因素具有明显的弱点,例如Apple和OSX中的DOCK即屏幕下方停靠栏,上的itunes和iDVD会经常被搞混,iweb和iphoto也容易被搞混。虽然图标的形状不同,但是大小,颜色和纹理是相似的。
    尺寸
    在一群类似的物体中,较大的物体更容易引起我们的注意,尺寸也是可以顺序和可以量化的变量,这意味着人们可以按照物体的大小自动地将它们排序,并在主观上赋予相应的值。尺寸上明显的不同也会迅速引起我们的注意,就是一张A4纸上的4种尺寸,我们便会认为,超大的文字也越重要,粗体比普通体要重要。


    在明亮的背景下,暗色的类型物体就会很突出,和尺寸一样,值可以是游离的,比如如果一个照片太亮或者太暗,那么你就很难看清楚照片拍摄的是什么,人们很容易快速地察觉到值的对比反差,因此我们可以利用值来突出那些需要引起人们注意的元素,值同样也是顺序的变量,例如,较低值(较暗)的颜色在地图上用来标识较深的水域或者较密的人口。

    颜色
    颜色的不同可以快速的引起我们的注意,会计把“红色”当作负的,把“黑色”当作正的;证券市场上的交易员知道蓝色表示“买”,红色表示“卖”(至少在美国是这样)。红色在交通信号灯中的意思是“停止”,在西方人的眼中,红色还意味着“危险”,在中国红色却意味着吉利。类似地,白色在西方代表着纯洁与祥和,但在亚洲一些国家则被用于葬礼中。和尺寸或者值不同,颜色本质不是顺序的也不是定量的,因此并不太适合表达这种类型的数据,还有由于存在着色盲现象,因此我们也不能信赖颜色,把它当作是唯一的传达矢量。

    方位
    当我们有和方向有关的信息传达时方位是个很有用的变量,例如,如果你想表示股市下滑,你可以使用一个向下指的箭头,同时标为红色。

    纹理
    在屏幕上的元素没有真正的纹理,不过它们可以具有纹理的外表,纹理很少被用来表达不同或者引起注意,因为分辩纹理需要很强的注意力,纹理通常也需要不少的像素来表达。它可以被用做重要的启示暗示。用户界面上的元素如果有突起或者隆起,则意味着这个元素是可以拖放的:如果按钮上有斜面或者有限影,则意味着这个按钮是可以单击的。
    位置
    位置它可以被用来传达层次结构方面的信息,屏幕上的阅读顺序可以帮助我们来顺序地定位元素,比如把最重要的对象放在屏幕的最左上角。也可以用位置来创造出屏幕对象和现实世界对象的空间对应关系。

    交互设计原则:交互界面设计的原则
    运用视觉属性将元素分组,创造出清晰的层次结构。
    在每个组织层次上提供视觉构架和流。
    使用紧凑,一致且上下文合适的图像。
    风格一致,功能全面并有目的性。
    避免视觉口声和杂乱

    交互设计原则:视觉模式是视觉界面的基础
    通过分组的方式我们可以将不同逻辑的控制或者数据集区别开来,我们通常按照视觉习属性来分组,比如颜色和形状,在界面上自始至终地运用这些视觉属性,你可以创造出用户可以学习识别的模式,例如,在windows xp操作系统中所有的按钮都是小圆角,所有的文本框都是方形并微微下凹,同时具有蓝色边框和白色背景,正是由于这种自始至终的一致性,所以尽管按钮和文本框有很多相似这处我们仍然可以很容易地将它们区分开来。


    交互设计原则:对齐和网格
    对齐视觉元素是帮助用户有组织而系统地熟悉产品的一个重要途径,成组的元素须在水平竖直方向对齐,屏幕上的每个元素都要尽可能和其他的每一个元素对齐,任何两个元素或者两组元素没有对齐的情况都必须有足够充分的理由,或者是要达到特别的与众不同的效果,具体来说,设计者当注意如下方面。
    对齐标签----控件的标签竖直排列要彼此对齐,在输入表单大小相同的情况下,左对齐比右对齐对于用户浏览起来会更方便。
    在控件集合内对齐----相互有关系的复选框,单选按钮或文本字段组都应该按照规则的网格对齐。
    控件组和窗格之间要对齐----控件组和其他屏幕元素都应该尽可能使用同一个网格结构对齐。


    交互设计原则:网格系统
    网格系统是视觉设计者最有效的设计工具之一,对于设计有视觉层次和功能上较为复杂的界面特别重,在交互设计者定义应用的整体框架和用户界面元素之后,视觉界面设计者应该在网格结构中把布局“规则化”,即适当地强调高层次的元素和结构,并为低层次的元素或次重要的控件留出适当的空间。
    常用比例是“黄金分割”大约是1.61,但是如果采用黄金分割比例却导致了元素放不下的情况,则对于屏幕上可读性来说一点帮助也没有。

    如果两个区域的需求不同,那么就把它们做成明显的不同,如果网格的原子单位太小,网格就会变得复杂而难于识别;如果仅仅有细微的差别,对于用户感觉起来是不稳定,尽管他们可能也不太清楚为什么会有这种感觉,最终会导致网格不能发挥其本来的功效。
    在视觉设计中运用网格系统可以带给你如下好处,可用性,由于网格会使元素的位置更加规则,所以使用者可以快速地找到关键的界面元素,如果屏幕的标题部分始终精确地出现在同一位置,用户就无须思考或者用眼睛扫描界面,一致的间隔和定位可以辅助用户内在的视觉处理机制,设计良好的网格可以极大地提高屏幕的可读性;美学上吸引人,精心运用原子网格,在屏幕的不同区域之间建立好适当的关系,这样的设计可以创造出一种井井有条的感觉,使用者会感觉到舒服,并可以吸引使用者与这个产品进行互动;提高效率,将布局标准可以减少创造高质量的视觉界面设计的反复所需要的工作量,尽早地定义并采用网格,可以减少界面设计的反复和修改。


    交互设计原则:创建逻辑路径
    布局上必须采用正确而有效的逻辑路径,用户可以沿着这个逻辑路径与界面互动,比如从左到右,从上而下。


    交互设计原则:对称和平衡的视觉平衡观点
    经验丰富的设计师善于通过控制单个元素的视觉权重来获得不对称的平衡。界面中常用的两种对称,即垂直对称(沿一根垂直线对称,此线常位于一组元素的中央)或对角线对称(沿对角线对称)。多数典型的对话框呈两种对称中的一种,对角线对称最常见。


    交互设计原则:在视觉上区分不同行为的元素
    对人物角色及其心理模型的理解为界面中使用文字语言和视觉语言奠定了坚实的基础,设计面向功能或对象的图标给设计代来有趣挑战,可以运用以下的指导原则。
    将动作和动作施加的对象同时表达有助于增进理解,名词和动词结合在一起比单纯用动词更易被人理解;小心使用与你的目标用户想象中不同的隐喻和表现方式;
    在视觉上将相关功能分组,以提供空间上的使用情境,如果不行就使用颜色或其他的视觉提供使用情境的信息;
    保持图标简单,避免过分的视觉细节;
    尽可能重用,这样用户只需要学习一次;

    交互设计原则:将功能与行为视觉化
    不要只用文字描述界面功能的结果,要用视觉元素向用户展示行为的结果是什么。

    交互设计原则:全面而有目的地把风格和功能结合起来
    界面中的每个方面都必须从视图的风格考虑,而不是单个控件或其他的视觉元素,产品的行为是品牌的一部分,用户对产品的体验反映是形式,内容和行为的合理平衡。
    在开发到某种视觉风格的过程中,应考虑控件上基本形状,行为和控件的视觉启示,并且纯粹的美学上的考虑不应该干扰到界面的含义或用户与它交互的能力。
    品牌的价值在于顾客与企业交互的总和,这种不断增加的交互通过基于技术的各种渠道,因此现在比以往任何时候都更强调用户界面品牌,如果目标始终都是促进良好积极的顾客交互,那么语言、视觉和行为的品牌信息就必须一不能致,对交互设计和行为控制,则常常是遵守视觉对用户所做承诺的最好方式。

    交互设计原则:将元素一样一样从设计中移走,直到设计坍塌,再把最后一样移走的元素放回去。
    继承设计元素的风格一致有利于用户在理解一个元素后就可以很容易的理解下一个类似的元素,并将设计元素简单化,严格限制颜色的数量,并且应该以较为不饱和的颜色或者中性的颜色为主,可以适当加入一些高对比作为强调重要信息的颜色,在同一个界面中,版式也不可以有较大的变化。控制尺寸,颜色,位置是最有效的方式。

    交互设计原则:视觉界面中的文本
    文字可以传递大量信息和细微信息,但是如果使用不当,文字是有可能把事情搞得更加复杂,而且有可能是误导用户。界面上必读的文本适用以下指导准则。
    采用高对比度文本------确保文本与背景对比明显,不要使用互补的颜色,以免影响可读性,最佳的对比度是80%,这可以作为一般的经验值。
    选择合适的字形和字号-----一般来说,整齐利落的Sans-serif字体比较适合,比如Verdana或者Tahoma就特别适合阅读,Serif字体则显得有些毛毛草草,不利索,比如Times或者Georgia字体;但是如果字体尺寸足够大或者进行了平滑处理及抗锯齿处理,则可以弥补这个不足。小于10个像素的字在大多数情况下都难于阅读,如果必须采用小字体,则最好使用Sans-serif字体,并且没有做过抗锯齿处理。
    将文本清晰地组成段落----为便于理解,用最少量的必要文字清楚地表达意思,避免用缩略语,如果必须,要用标准缩略语。

    交互设计原则:视觉界面上的颜色
    注意:颜色不能太多,饱和互补颜色的使用,过度饱和,对比度不够,对色彩缺陷注意不够;
    颜色不能太多: 大脑不得不花费额外的时间记住每种颜色的意义,降低了我们处理速度。
    饱和互补颜色的使用:互补颜色在颜色处理中是指那些相反的颜色,当这些颜色被高度饱和并且放置在一起时,就会制造出视觉假象。并且非常难以正确辨识,也非常难以让人聚精会神。
    过度饱和:高度饱和的颜色看起来会显得鲜艳,从而吸引过多的注意力,在较小的地方适当地运用饱和适中的颜色可以有效地吸引用户的注意力,但这种用法应该保守使用。
    对比度不够:如果图形颜色与背景颜色只是颜色不同,而在饱和度和亮度上没有差别,则很难辨识,图形和背景除了色调不同外,饱和度和亮度也应有区别,如果可能,应尽可能避免在彩色背景上运用彩色文本。

    交互设计原则:视觉信息设计的原则
    加强视觉对比,显示因果关系,显示多个变量,央一个显示中结合文本、图形及数据,确保内容的品质、相关性和完整性,在相邻空间上显示事物,而不按时间堆积,可量化的数据变要量化。
    加强视觉对比:为用户提供可以进行相关变量和趋势的对比手段,或者是事件前后的对比手段,对比可以产生一种情境,使信息更有价值,用户更易理解。轻易地获得交互前后的对比。
    显示因果关系:交互界面中应该使用非模态视觉反馈告诉用户其行为的可能结果或提供如何完成操作的暗示。
    显示多个变量:投资者通常对多个证券、指数及指标的相互关系非常感兴趣,多个变量随时间演变的图形可以帮助投资者揭示这种关系,在交互式显示中,用户可选择开启或关闭变量,使对比更容易,相关也更清晰。
    在相邻空间上显示事物,而不按时间堆积:如果要表达按时间发生的变化,将这些变化安排在相邻的空间上显示,而不是彼此叠加,那么用户会更容易理解。连环画就是一个这样的好例子,它在相邻空间上显示随时间推进的流和变化。除非有真正卓越的替代方案,否则必须遵守以上标准,但一致性并不意味着僵化。

    展开全文
  • Chapter5 交互设计测试与评估 第一章 为什么要开展测试与评估 用户测试:请目标用户使用产品来完成任务,观察并记录用户使用产品的整个过程. 用户测试的定义:也被称为产品可用性测试,指特定的用户在特定的使用...

    如果有需要视频资源的可以关注"AI产品经理人",回复关键字“网易交互设计微专业”获取下载链接~ 

    Chapter5  交互设计测试与评估

    第一章 为什么要开展测试与评估

    用户测试:请目标用户使用产品来完成任务,观察并记录用户使用产品的整个过程.

    用户测试的定义:也被称为产品可用性测试,指特定的用户在特定的使用场景中,为了达到特定的目标而使用某产品时,所感受到的有效性、效率以及满意度。从而找出产品可用性问题,并解决这些问题,目的是为了改善这些产品,让产品更容易使用。

    用户测试的测试目标

    • 有效性--用户能够达成自己的目标;
    • 效    率--用户能以最短路径达成目的;
    • 满意度--用户没有产品不愉快的体验;

    用户测试基本流程:

    1. 设计测试。设计参与者在测试中需要完成的任务;
    2. 招募用户。筛选符合测试要求的目标用户进行测试;
    3. 进行测试。观察并记录参与者完成任务过程中的情况。Tips:以抛出问题为主,少做建议。
    4. 分析报告。列出问题并进行分析,判定问题的严重性及特殊性。

    案例:网易云课堂

    用户测试的意义

    1. 挖掘用户的潜在需求
    2. 发现并解决产品存在的问题
    3. 降低产品周期成本
    4. 增强设计的说服力

    评估形式分类:

    • 评估主体,主要有用户评估和专家评估

    用户评估,就是用户测试,主要靠收集用户使用数据,它相对客观,但时间和费用花费较多,评估范围较宽

    专家评估,是让工程师及设计师等专家基于自身的专业知识和经验进行评估的一种方式。它相对主观,但时间和费用花费少,评估的范围较窄

    • 评估性质,主要有定性评估和定量评估

    定量评估,是指对可以计量的部分进行评价,如点击量、使用率等

    定性评估,是指对非计量性的部分进行评价,如流畅度、舒适性、创造性等

    • 评估过程,主要有理性评估和感性评估

    理性评估,相对客观,从客观角度出来判断客观事物,例如对比的是价格,我们一定会选择便宜的

    感性评估,更为主观,评估结果并没有客观规律

    以上评估方式各有优缺,需要结合起来使用。

    四种常见评估方法

    • 1、原型评估方法

    “在产品研发过程中,对于界面设计以及程序的测试来获得用户的反馈是至关重要的。以用户为中心交互式设计的重要因素之一就是原型方法,原型方法的目的是将界面设计与用户的需求进行匹配。”

    • 快速原型:原型迅速成型,系统从草案中得到完善;
    • 增量原型:需要阶段性的测试;
    • 演化原型 :对前期的原型进行不断地补充;
    • 2、简易测试评估方法(摄像机、实验室、记录员)

    “在条件不允许的情况下,可以采用简易的方法来对用户体验进行评价”

    • 3、眼动评估方法

    眼动追踪可以用来评价用户对产品设计的感性意象,评测产品设计的特性。眼动评估的指标主要有注视热点图(Hotspot)、搜索过程测量指标、兴趣区域(AOI,即用户视觉注意的交点去)

    • 4、脑电评估方法

    通过对脑电信号的分析,研究者可以探索大脑的认知加工过程和受试者的心理状况

    第二章  启发式评估

    1. 什么是启发式评估?

    定义:是专家评估法的一种,也被称为经验性评估。是一种简易的可用性评估方法,使用一套相对简单、通用、有启发性的可用性原则,让几个评审人员根据专业知识和经验来进行评估,发现产品潜在的可用性问题。

    两大要素:

    • (1)评估者

    人数:推荐3~5人,有时也会简化

    岗位:设计师、用户研究员

    身份:最好非设计者本人

    知识:同时具有可用性知识及设计知识更佳

    • (2)评估原则

    Nielsen启发式10原则、Nielsen拓展原则、Nielsen首页可用性指南、iSO9241、八项黄金法则、HHS网页设计与可用性指南

    适用阶段:

    • “评估越早越好”,一般是在交互/视觉设计阶段、测试优化阶段、正式发布阶段进行评估

    特点:

    • 优:成本低;效率高;发现大多数可用性问题;
    • 缺:不能代表真实用户,相对主观;有时发现问题过多;对评估人员知识背景要求较高;

    适用情况:

    • 适合时间、资源有限的情况下快速发现可用性问题,降低风险及成本;
    • 版本变动不大的情况下,小成本检验
    • 作为可用性测试之前的准备

    2. 如何进行启发式评估?

    Step1:评估准备阶段

    • 确定范围:整体vs局部
    • 背景信息:用户、场景、主要任务、竞品
    • 评估参考原则(如尼尔森10原则):根据评审目标和产品特性选择
    • 评委邀约:设计师、用户研究员、非本人
    • 材料准备:评估说明、用户手册、评分表等

    案例:网易云课堂

    TIPS:事先提供一些评估表,比如启发式评估表等。

    Step2:评估执行阶段

    Step3:结果分析阶段

    问题清单一般包括:问题序号、页面名称、问题维度、截图、问题/需求描述、解决方案;

    报告形式:word形式、ppt形式、表格形式(建议);

    第三章  可用性测试

    1. 什么是可用性测试?

    定义:通过观察具有代表性的用户,完成产品的典型任务,从而找出产品可用性问题,并解决这些问题,目的是为了改善产品让产品更容易使用

    适用阶段

    • “测试越早越好”,一般是在交互/视觉设计阶段、测试优化阶段、正式发布阶段进行测试

     

    可用性测试类型:

    • 1)形成式:小样本;发现问题解决问题为主;不能做定量对比(互联网产品常用:快速用户测试)
    • 2)总结式:大样本,30人以上;可以做版本的对比评估和定量评估

    可用性测试解决什么问题?

    可用性测试的特点

    2. 如何进行可用性测试?

    流程:准备阶段--->正式测试--->结果分析--->优化(迭代,很多轮)

    (1) 准备阶段

    • 确定目标
    • 测试方案

    • 测试脚本

    给用户找点事儿做,观察、提问,获得我们想要的信息;

    重点:设计测试任务

    测试任务关注点:

    • 锁定在主要任务上
    • 从用户角度出发
    • 明确起点和终点
    • 任务场景化
    • 招募用户

    招募用户时可以用过滤问卷快速筛选用户.

    招募用户案例: 

     

    • 材料工具
    1. 待测试产品素材(草图、低保真原型、高保真原型);
    2. 常用量表工具 (可用性测试量表、形容词语义量表、概念吸引力测试卡片、卡片分类内容卡片、生活形态价值观量表、彩色竞品示卡、背景信息问卷);
    3. 电子设备、桌椅、纸笔、办公区域、摄像机、录音笔等;
    4. 测试清单:测试流程、测试中用到的设备&材料等,核对清单防止遗漏!
    • 测试场地

    (1)专业实验室:

    (2)普通会议室:观察人数较少时;条件有限时;

    • 预测试

    保证测试顺利进行! 

    (2) 正式测试

    • 正式测试输出物:测试记录、录像录音
    • 测试参与人员:主持人、记录员、产品团队、用户

    • 测试前:暖场、测前访谈、简单试用

    • 测试中:用户执行任务、事后访谈

    测试过程中的观察要点:

    1. 用户是否独立完成了任务;
    2. 是否存在无效操作或者不知所措;
    3. 用户是否不满

     

    • 测试后:道别、准备下一场测试、简单总结发现

    (3)结果分析

     

    结果分析输出物:测试报告

    结果分析步骤:对发现分类、整理不确定项、评定优先级(参考常见标准)、结果记录;

    结果分析工具:贴纸归类、excel表;

    结果分析报告撰写

    1. 总体如何
    2. 有哪些问题?截图
    3. 严重程度如何?优先级的描述和排
    4. 建议是什么?
    5. 除此之外,可以问绕用户核心关注的问题和一些为满足需求做补充分析

    报告样例:

    • ppt形式:

    • excel形式:

    (4) 优化

    • 优化跟踪输出物、优化方案

    问题追踪表

    敏捷测试

    • Q1:可用性测试耗时太久,测试赶不上产品节奏?
    • A1:敏捷测试,边测试边改进;提高测试效率(建立用户库、工具模板、简化流程或报告)

    • Q2:正规测试耗时耗力?
    • A2:简易测试

    第四章 其他评估方法

    (一)问卷调查

    Q:产品上线后,想了解用户对上线后产品的满意度

    适用阶段:产品研发前(挖掘需求)、产品设计(了解用户使用习惯、偏好)、正式发布(用户满意度)

    适用场景:

    适用于做定量分析、匿名调研、对已有假设进行检验、对用户的认知和态度进行评估,不适用于发现和描述具体问题、获取创新的想法、获取精确的行为数据。

    问卷调查步骤:

    • step1:确定调研目的

    • step2:设计调研方案

    常见抽样方法:随机抽样、分层抽样、分群抽样、系统抽样;

    问卷投放量的考虑

    (1)线上问卷,一般相聚工时估计满足统计需求需要回收的量。置信区间,抽样误差,总体大小,需要交叉的变量几个因素影响;

    (2)工具各个渠道投放回收率情况,计算所需投放量或投放天数;

    投放方式选择

    问卷投放渠道 

    • step3:问卷设计

     

    • step4:问卷测试

    (1)多找几个人一起试填,检查题项表述用户是否理解,是否有歧义,逻辑是否通;

    (2)检查问卷跳转是否正常,在不同浏览器中能否正常显示;

    (3)数据回收是否正常,避免回收出现问题;

    • step5:问卷投放

    投放方式选择:

    问卷投放渠道 

    问卷回收效果跟踪

    • step6:数据分析

     案例:

     

     

    (二)产品数据分析

    1.数据分析概述

    定义:通过在网站或应用中进行数据埋点,进而获取用户对产品的使用和行为数据,并进行基于产品体验优化的数据统计分析;

    评估方法:

    适用时间:

    web端数据来源

    • 服务器日志文件记录

    • javascript页面标记

    移动端数据来源:

    常用数据监控平台:

    • 第三方网站监测分析工具​
    • 自己的数据分析平台

    数据分析流程:监控-定义-埋点-测量(获取数据)-分析-优化-监控

    2. 基础分析指标

    • web页面常用基础指标:PV、UV、UPV、访问

    识别用户的方式:IP、IP+User Agent、Cookie、User ID、设备ID、其他

    • 复合指标:跳出率(来了就走)、退出率、访问时长、访问深度、转化率

    3. 常见分析内容
    4. 常见分析思路

    展开全文
  • 为什么会有交互设计,交互设计能够做什么? ▎1.成功的互联网产品具备哪些要素? ①当你的Boss需要做个产品时,它首先必须是可实现的,这也是为什么核心程序员架构师的待遇普遍较高的原因,因为他们是生产力。...
    • 为什么会有交互设计,交互设计能够做什么?

    1.成功的互联网产品具备哪些要素?

    ①当你的Boss需要做个产品时,它首先必须是可实现的,这也是为什么核心程序员架构师的待遇普遍较高的原因,因为他们是生产力。那么成功的产品首先要具备–可实现模型

    ②产品做出来干什么?“方便用户,让用户玩的爽?”当然不是,产品的终极目标是盈利,你的领导也只关心这个。怎么才能盈利,而且是可持续的盈利。这需要具备第二个要素–业务模型

    ③有了实现模型和业务模型产品就成功了吗?以前是,但如今时代不同了,大多数的应用已经不存在技术难题,在这个企业不缺系统,互联网不缺产品而用户不懂技术的时刻,你靠什么赢得用户?强大的运营队伍也只能推动一个峰值,最根本的还是需要产品的第三个要素–使用者模型,使用者模型像水一样,可以成就一个产品,让产品走的更远,也可以毁掉一个优秀业务模型的产品。

    2.怎么去完善使用者模型?

    ①我们先看看传统的开发流程:立项→编程→测试→美化

    这样的做出来的产品大都数偏向程序员思维的实现模型或营销策划的业务模型,设计也就是加点图标上些颜色(举个例子:环球资源,大家可以点开下眼界),基本上不存在用户模型的概念。

    ②为了完善用户模型的问题,现在绝大都数公司的开发流程做出了改进,基本上基于这样的流程:立项→需求分析→设计→编程→测试

    这样的流程提高了对需求分析人员和设计师的能力要求,这样的组合必须在实现模型的前提下将业务模型和使用者模型进行一个高度融合。那么问题来了:

    ▎假设设计师只具备视觉设计能力

    大都数从事互联网产品界面设计的都是美术类出身,对业务的理解程度都要弱于表现需求,基本上是基于产品人员的线框图制作视觉稿,根本无法推动页面结构的优化。那么出来的成品还是偏向于业务需求。遇到综合型的产品经理还好,遇到业务性的产品经理就只能让蠢事继续下去了。举个例子:一些转化率低,跳出率高的页面,产品经理会觉得主要原因是设计稿气氛不够,按钮不够大。而真正的原因是因为设计师基于他的线框制作的视觉稿,目标导向和行为召唤都不够。

    ▎假设设计师具备产品策划和视觉表现能力

    这样的设计师也大量的存在,但发现与产品的沟通上效率很低,会出现以下的问题:

    1.沟通困难; 2.修改成本高;3.无法估算完成时间;4.无法说服对方;5.项目时间不允许。

    3.解决方案–UCD理念

    为了解决上述问题,UCD的理念开始逐步被大家接受和认可,其中最具有驱动方案的职位–交互设计就是顺着这样的大环境被独立出来。我们可以了解一下各大互联网公司UED的主要组织结构:

    相比之前的流程,多出了用户研究和交互设计的职位,而这两个职位对产品概念到实现的过程起着主要的驱动作用。

    4.交互设计如何开展和融入开发流程

    我们先来梳理一下之前流程上遇到的两个问题:1.使用者模型不完善;2.沟通障碍

    ▎使用者模型不完善 ;

    如何改善使用者模型,需要经历两个过程:

    ①业务模型框架化

    在产品的概念阶段时期,交互设计师需要基关注用户界面和整体结构,这个过程被称作“框架设计”,框架设计就是一种基于用户目标的导航架构和流程设计。这个阶段交互的产出物主要有导航架构图,流程图和低保真线框图。

    上述的产出物都需要和产品经理反复确认,以保证业务模型的完整。

    ②.框架界面化

    在定义完功能模块的页面结构和流程后,交互设计师还需要设计规划使用者的操作,这些包括页面元素的主次关系,小部件的处理,元素的组织,界面的引导等等。这个阶段交互设计师需要提供原型demo:

    原型demo 是一个过程,主要用于具象的表达业务需求和定义界面模型,是一种目标导向的设计过程。这个过程可以是多次迭代的,是提炼产品质量的主要手段。有了这个过程,我们之前所讲的完善使用者模型才能够得到解决,用户体验设计的理念才可以真正得到实施。

    ▎沟通障碍

    在产品开发过程中,各个部门的合作与沟通存在着障碍,而产生交互职位之后,这些问题都能够得到解决。

    ①产品与设计的沟通

    在框架阶段,交互设计师利用信息架构图和流程图能够将业务需求确定下来。

    在框架界面化阶段,对于用户的操作和界面元素也能够用原型demo表达出来,而且修改成本低,可以快速的迭代。

    ②产品、设计与开发、测试的沟通

    交互设计师利用原型demo做评审测试是个非常高效的方法,这样的方法能够不仅能够直观的表达需求,而且可以提供早期的用户测试,让很多之前无法预见的问题及时的抛出来,原型demo是贯穿概念阶段和实现阶段的最佳表达方式,而这些都对于交互设计提出了更高的要求。

    5.小结

    写了这么多内容,主要是想说明一下为什么要有交互设计和交互设计能够解决什么问题。如果决策者不能够明白这些道理,UCD的方法很难开展起来;如果从业者不能够明白这些道理,所做的工作也会是盲目和无效的。我想通过这篇文章帮助一些新手明白自己工作的任务和目的,少走些弯路。

    展开全文
  • 转载自:老二牛车教育 » 【交互设计交互设计职能介绍 上个章节讲了了解交互设计,本章主要详述一下交互设计的职能——交互设计师具体做哪些内容?  Ⅰ. 先了解一下交互设计的基本概念:    交互...
  • 游戏交互设计入门

    千次阅读 2015-04-11 00:36:46
    参考阐述手机游戏用户界面设计的8大步骤 - http://gamerboom.com/archives/53747阐述熟悉感对电子游戏界面的重要性 - http://gamerboom.com/archives/60362分析高收益手机游戏的美术设计特点 - ...
  • 本章主要详述一下交互设计的职能——交互设计师具体做哪些内容? 上个章节讲了了解交互设计,本章主要详述一下交互设计的职能——交互设计师具体做哪些内容? Ⅰ. 先了解一下交互设计的基本概念: 交互...
  • 一套入门的教程,分「了解交互设计」、「交互设计的职能范围」、「交互设计的常用方法」……几个章节把我对这门行业的理解和经验做个分享。 下面开始正题(为什么会有交互设计,交互设计能够做什么): ▎1.成功的...
  • 尼尔森十大交互设计原则

    千次阅读 2019-04-21 12:16:30
    Jakob Nielsen(雅各布·尼尔森)的十大交互设计原则。它们被称为“启发式”,因为它们是广泛的经验法则,而不是特定的可用性指导原则。因此,我们不能把它上升为一种标准,而是应该当做一种经验来学习,然后跟现实...
  • 再看语音交互设计

    千次阅读 2019-08-20 22:02:00
    行动是最好的思维方式。 赋能是人工智能对人类最重要的事情,而智能语音...但是,语音交互设计并不是新兴的技术,在20多年前老码农刚刚参加工作的时候就可能已经存在多年了。 从IVR 系统看起 交互式语音问...
  • 交互设计的KISS原则

    千次阅读 2014-06-10 16:02:08
    简单是软件设计之美, 简单的设计使得软件产品易于开发, 易于维护. 简单代表着高质量, 少加班, 每个人都希望自己的工作是简单的.    在KISS原则之外, 应该有一个更重要的原则: Useful. 满足需求是一切产品的低限...
  • 上个章节讲了为什么要有交互设计,本章主要详述一下交互设计的职能——交互设计师具体做哪些内容? Ⅰ. 先了解一下交互设计的基本概念: 交互设计是一种目标导向设计,所有的工作内容都是在围绕着用户行为去设计的...
  • 如果有需要视频资源的可以关注"AI产品经理人...交互设计师和产品经理的区别 交互设计影响用户体验 优秀的交互设计来源于生活!!! 用户体验:国际标准化组织ISO 9241-210定义:用户对于使用或期望是用的产品、...
  • AR交互设计

    千次阅读 2018-06-13 11:13:24
        研究生期间做基于MR的远程协同设计和指导技术研究,阅读和学习相关资料,学习总结了AR交互设计相关内容。     AR类产品的出现,可能是第一次实现虚拟世界与现实世相互“融合”,完成屏幕的“跨越”,人...
  • 交互设计规范

    千次阅读 2014-01-10 17:14:35
    2[产品设计规范]界面组件级交互设计规范 3[产品设计规范]BS应用界面设计规范 4[产品设计规范]CS软件用户界面设计规范组件部分 5[产品设计规范]03界面组件级交互设计检查表 6[产品设计规范]腾讯网Web设计
  • 交互设计基础

    2014-01-10 15:50:24
    交互设计的定义:  交互设计是一种如何让产品易用,有效而让人愉悦的技术。  它致力于了解目标用户和他们的期望,了解用户在同产品交互时彼此的行为,了解“人”本身的心理和行为特点。  同时,还包括了解各种...
  • 交互设计之路.pdf

    热门讨论 2009-12-02 11:46:01
    交互设计之路.pdf ,介绍设计的经典著作
  • 交互设计学习

    千次阅读 2012-11-02 11:34:52
    纪念并感谢在天国的那位尊敬的老师,prof.dr. Kees Overbeeke (1952/07/18 –2011/10/08)  以下都是他教会我的: 1 尊重 ... 你告诉了店员你要一包饼干,把钱也交给了他。店员把你要的饼干以及找回的零钱扔到你...
  • 转载自:老二牛车教育 » 【交互设计】用户体验之手势交互设计原则 手势识别指的是计算机设备侦测并识别人类手势。近几年来,随着手势识别技术的高速发展,以及3D传感器的广泛采用,手势交互已经得到广泛的普及...
  • 精选了几本好书,分享给大家: Top7:《在你身边,为你设计》 ...这本书的开头有一句话“如果你拍的不够好,那是因为你靠得不够近”给我的触动很大 ...“如果你交互做的不够好
  •  这是一次内部分享,新部门的同学们希望我聊聊我过去从事的交互设计,做个了面对入门者等级的PPT,和各位简单聊了聊。发到微博上,也敦促自己对交互设计从业经历做个简单总结。——类似的文章,貌似自己在三年前也...
  • 交互设计作业

    2019-05-06 10:21:37
    本实验主要是鼠标交互,界面上有几排灰色的圆点,通过点击鼠标可以将上方的圆点吸到界面中来,并且圆点会着色,同时在界面中展开运动,当圆点碰撞到界面的四周时,会依次回到陈列灰色圆点的地方。 编程语言:p5 ...
  • 交互设计资源

    千次阅读 2014-11-24 17:29:26
    1.苹果ios界面设计库  ...2.交互设计网站 digital web:The web professional's online magazine of choice.  http://www.digital-web.com/  3.Signal vs. Noise:37 signal的官方blog  http://37signals.com/sv

空空如也

1 2 3 4 5 ... 20
收藏数 44,777
精华内容 17,910
关键字:

交互设计