互联网产品的交互设计指南(下)

设计研究

大多数的研究是定性的,而不是定量的。通常的情况下,都不会要求交互设计师做设计研究,设计师们一般都会更加信任自己的直觉以及创造产品的经验。在我们熟悉的领域或者是小型项目中,这或许是要正确的方法。但是如果到了大的、不熟悉的领域里,设计研究就可以帮助避免创造错误的设计。

研究方法

观察

观察也是最简单的设计研究方法,不动声色的去观察用户,例如去商场里去观察用户是如何购物的。观察者应该精心的去选择环境,要在不太会引起人们注意的地方进行观察。结合用户实际的使用场景去观察用户,记录下用户在特定场景中是如何做的。

访谈

访谈是用户研究的最基本也是最常用的方法,与人们交谈、倾听他们的故事是发现人们态度和体验的最好方法。我们可以引导被访谈用户讲故事,请用户讲述一些在特定时刻特定情境与产品或服务交互的故事,或者我们可以根据某些主题进行访谈。我们还可以让用户绘画出对某个产品或服务的使用体验,让用户表达出他们所认为的产品。

关于用户研究这块儿,网上有大量的文章,这里只列举最基本的两个。

构思和设计

构思

知道了用户的需求和期望,制定好了战略,现在要做的就是去设计什么了,开始构思并且产生概念。产生设计概念目前各大设计团队的方式会是头脑风暴,头脑风暴不是为项目寻找一个完美的设计,而是尽可能的产生许多的概念。在这个阶段最重要的是产生数量而不是质量看,要从不同的角度去产生尽可能多的想法。对于一个新的产品,有必要花费几天开展头脑风暴来产生几百个想法。

头脑风暴最便捷的工具就是纸和笔。我们需要快速地草草记下一个想法,把它放在一边,再去想另外一个。在进行头脑风暴时,不必局限于团队中的设计人员,可以邀请相关人员、开发人员、工程师甚至局外人都会提出一些让你意想不到的想法。只要确保参与者都能理解头脑风暴的原则:1.没有不好的想法,2.保持关注点,把不想关的想法放到一边,3.不要在某一个想法上花费太多时间,4.不要在头脑风暴的时候同时完成其他的任务。

当概念形成后,我们要对产生的概念进行组织,对已经提出的所有想法聚类、命名和排序,以便后续的讨论。可以把产生的概念放在一个2*2的矩阵中,来说明连续的区间中每个想法处于什么位置;或者把他们放在表格中,通过属性来标记这些概念的特性。


交互设计法则

预设用途

事物的外表都能表现给我们一种提示,表明它是如何工作的以及我们应该如何与之交互。预设用途是一种属性,这些属性能提供某种与对象或者功能进行交互的提示。椅子因为它的形状,就提供了椅子能坐的预设功能;按钮应为它的形状,就有按的预设功能;拉手由于它的形状,提供了一种可以拉的预设功能。交互设计可以看做是提供一种预设用途,以便产品的特征和功能可以被发现并被正确的使用。

反馈

反馈是某种提示,意味着某事发生过。对使用产品或者服务的人的任何动作都应该有确认,不管他们的行为多么的轻微:就像移动鼠标的时候光标跟随者移动,拨打电话时按下手一个按键手机上应该显示一个数字。如果没有立即明显的反馈,用户往往会重复刚做过的动作,例如按下按钮两次,这样做是会引发问题的,例如购买物品的时候会两次或者多次汇款。人们需要反馈。

数字产品的响应性由开始动作和产品做出反应之间的时间(延时)来确定,延时可以做如下描述:1.及时,产品或服务的响应时间<=0.1秒,用户认为反馈是及时的,并且可以在没有察觉到中断的情况下继续完后任务。2.延迟,产品或服务的响应时间在0.1秒~1秒之间,此时用户会注意到延迟。如果这样的延迟不频繁的出现用户会忽视它,反之,用户会感觉到产品或者服务是很迟钝的,例如拨号时按下数字键后,需要1秒才会显示在屏幕上,所有的按键都是1秒后才会显示,用户会变得很沮丧甚至会放弃产品。3.中断,1秒之后还是没有反应,用户会觉得他们正在做的工作中断了,他们的注意力会从手头的工作上转移到其他的产品或是服务上,例如用户点击“提交”来完成交易,几秒过后还是没有反应,用户会担心这笔交易并且怀疑是不是网站出了问题。4.异常终止,如果出现超过10秒的延迟,用户会觉得手头上的工作彻底中断了。

用户的心智模型

心智模型指的是用户对系统或对象是如何工作的理解。心智模型通常是由用户根据设计师提供的提示信息来建立,这些提示信息以预设用途和反馈的形式给出。设计师能使用这些提示信息显著的控制用户的心智模型,隐藏或者揭露出产品的内部工作方式。

费茨定律

费茨定律建立了手指和鼠标一类设备的指向行为模型。目标越大,指向它的速度越快,目标越近,指向它的速度越快。费茨定律对于数字设备的三个指示:1.按钮等可点击对象需要合理的大小,例如iOS规范中的44*44px规则移动APP按钮做多大尺寸(引用学UI网的一个教程,如有侵权请联系我)。2.屏幕的边和角的位置适合放菜单栏和按钮这样的元素。3.出现在用户正在操作的对象旁边的控制菜单或工具栏可以被打开的更快,例如点击鼠标右键出现在旁边的菜单。

希克定律

希克定律描述的是用户做决定所需的时间由备选项的数量而定。用户会对所选内容进行细分。但是如果极端遵循这一定律,会做出可怕的设计。试想下,亚马逊或淘宝把所有的商品全呈现的主页里......所以,把相同类别的备选项做适当的分组,可以降低用户选择时所需的时间。

7加减2法则

不得不说希克定律看起来违背了7加减2规则。7加减2法则阐述,人们在记忆了5~9项信息之后,人的头脑就开始出错。有些设计师在任何时候都确保屏幕上不多于7项内容,这样做难免有些极端了,因为此法则强调的是人们最多可以在短期记忆中记住的信息的数量。当这些信息被显示在屏幕上时,人们不必存在于短期记忆里,因为随时都能看到这些信息。举一个7加减2法则的应用例子,核对电话号码或者是银行卡号时,分组显示数字会让人们更易于记忆,(155)-(5588)-(7777)。

特斯勒复杂性守恒定律

定律描述了每一个过程都有其固有的复杂性,这个复杂性存在一个临界点,超过了这个点过程就不能再简化了,只有把固有的复杂性从一个地方转移到另一个地方。例如,发送短息,两个必要的条件就是你的手机号和对方的手机号,你的手机号是不用输入的,手机会带着你的信息,对方的手机号手机也会使用常用联系人等功能做到简化。交互设计师需要知道特斯勒复杂性守恒定律,首先,设计师需要承认,无论如何完善,所有过程都有一些不能再简化的元素;其次,设计师需要找到合理的地方来转移我们设计的产品的复杂性,用户在发送每一个短信的时候是没有必要输入自己的手机号的。

防错原则

设计师在为产品设置约束来防错误的时候使用防错原则,迫使用户调节他们的行为,正确的执行操作。在交互设计中,当使用条件没有满足时,尝尝通过使功能失效来表示。尽可能的通过图标提示或其他方式表明哪些条件可以让功能生效是一个好的方式。

隐喻

隐喻是让用户理解抽象数字提供的一种方法,最著名的例子就是计算机桌面。桌面隐喻帮助用户统一了图形用户界面。macOS系统里的图标就是隐喻最好的例子。


细化的文档

草图

设计师最好用的工具就是纸和笔了,在纸张上绘制草图是具有灵活性和易用性的。(截图作者看到请联系我)

故事板

故事板技术借鉴了电影制作和广告制作,通过把故事和附图结合起来,设计师可以有效的讲述关于产品和服务的故事,并在情境中展示它的特性。故事板上的图片可以是插图或者是照片,故事板由这些图片和附文组成。通过故事板,设计师可以展示产品使用的关键时刻。(截图作者看到请联系我)

任务流程图

任务流程图展现的关系将被构造成线框图。把任务排列成流程图,可以帮助我们看到产品的初步雏形。任务流程图可以表示出产品中的页面顺序以及相关操作的流程,显示出用户需要在哪里执行哪些动作,并且显示了哪里需要包含菜单以及信息。(截图作者看到请联系我)

线框图(低保真原型)

线框图用来展示产品结构、信息层次、控件和内容。线框图(低保真原型)通常是交互设计师创造产品时最重要的文档,线框图是记录产品特性的一种方式,这些特性包括相应的技术和商业逻辑。线框图是产品的蓝图,团队中人员可以通过它全面的理解产品。

线框图应该粗略的勾勒出产品形式。包括:内容,能发现和接触功能的必要控件,访问、浏览和操作以上两个要素的方法。线框图中还应包含所有细节的注释、说明等内容。

关于低保真原型的绘制,我会在以后的文章中分享一些细致、规范性的内容。(截图作者看到请联系我)

开发和测试

到这里,交互设计师输出了DRD后,设计工作又到了另一个方向,跟进视觉、开发以及测试,保证产品按照自己的设计方案上线。此时设计师的角色变成了排除问题,调整设计以适应代码,以及与团队成员共同协作。实际上,为了保证产品达到预期的设计效果,设计师应该加入到这些过程之中,因为一旦开发开始了,肯定会出现未曾想到的问题,我们应该随时出现在工程师、测试人员身边来共同解决这些问题。

总结

互联网已经从电脑屏幕的后面来到了我们周围的各种事物中,交互设计师不仅要在创建未来新事物的准则方面发挥作用,而且还要保证未来的事物运转良好、要为用户的愉悦使用而设计。在未来的互联网世界里,我们将会看到令人吃惊的进步。交互设计师正位于舞台的中央,这是一个令人激动人心的时代!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,547评论 6 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,399评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,428评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,599评论 1 274
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,612评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,577评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,941评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,603评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,852评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,605评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,693评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,375评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,955评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,936评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,172评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 43,970评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,414评论 2 342

推荐阅读更多精彩内容