如何进行AR交互设计?

AR类产品的出现,可能是第一次实现虚拟世界与现实世相互“融合”,完成屏幕的“跨越”,人机交互设计也开始从二维平面迈向三维世界。然而,由于市场和技术的因素,AR产品的人机交互界面仍然处于早期,各种理念和方法仍处于逐步形成与试验阶段。通过对现有AR产品交互设计的调研和思考,以及现有移动产品的对比,本文将阐述一些方法,以供思考和交流。AR效果的呈现有多种方式,市场在短期内主要分为基于手机等移动设备的移动AR和基于头显设备的AR眼镜(包括一体机...

如何进行AR交互设计?

AR类产品的出现,可能是第一次实现虚拟世界与现实世相互“融合”,完成屏幕的“跨越”,人机交互设计也开始从二维平面迈向三维世界。然而,由于市场和技术的因素,AR产品的人机交互界面仍然处于早期,各种理念和方法仍处于逐步形成与试验阶段。通过对现有AR产品交互设计的调研和思考,以及现有移动产品的对比,本文将阐述一些方法,以供思考和交流。

AR效果的呈现有多种方式,市场在短期内主要分为基于手机等移动设备的移动AR和基于头显设备的AR眼镜(包括一体机和分体机),但也包括车载HUD、商超大屏互动等等,本文将阐述较为通用的设计方法,也将包含对不同呈现方式简要介绍。

以下内容肯定有不足和不全面的地方,欢迎各位朋友批评指正,我也将及时修改和完善以下内容。


一、一些核心思想

1. 增强

针对增强现实产品的交互设计,首先要做到对现实世界信息的“增强”。

这里的信息并不局限于文本,还包括图片、3D对象、声音等等,而存在形式包含了虚拟信息和现实世界中的信息。

这里的增强包括信息宽度和深度,举个发动机的例子,用户通过AR交互分解发动机虚拟模型并了解各部分的详细规格和属性,这时得到的是发动机对象的信息深度,而同时对比同类型或同时代发动机规格或性能,则是在了解信息的宽度,换言之,在进行产品设计时,既要兼顾交互对象的自身属性和环境相关性,也要关注相关信息的联系(当然要借助信息挖掘)。

如何进行AR交互设计?

如何进行AR交互设计?


2. 清晰

无论是系统还是系统中的应用,都要能够正确直观的传达信息,这包括了内容无歧义、状态可见和显示合理。[1]

无歧义要求,在任何情况下,都能传达出一种信息,且这种信息就是用户想要或系统要求用户完成的指令或反馈。比如,在工业操作中,当要求用户“抓取眼前的箱子”,一定要指示出是“哪个箱子”,而不是仅提供一条指令。

如何进行AR交互设计?

状态可见要求系统时刻清晰的显示当前所处状态,在正确的时间提供正确的状态,让用户时刻了解刚完成什么、现在在做什么、接下来要进行什么,比如在加载内容时要提供进度条或loading图标,当加载完成要有信息提示“已完成加载”等等。

如何进行AR交互设计?

显示合理则要求以最精炼的呈现方式来传达信息,降低用户焦虑和不安,如能用图片或3D对象说明的,就不要使用文字;能用大字体,就不用小字体;等等。 对于确实需要同时展示大量消息的场景,需要提供全局放大功能。

如何进行AR交互设计?

此外,在进行设计前一定要明确,所有的设计都是建立在场景和功能之上的,一切脱离场景和功能的设计,都不再能做到清晰传达。


3. 一致性

人类的认知具有连续性,从一个阶段进化到另一个阶段的过程中,总会存在“中间地带”,这一过程中需要在两个阶段间建立连续性和传承性,帮助用户对新事物建立“心智模型”。所以在短期内,无论是移动AR还是AR眼镜,在进行交互设计时,要更多的延续现有的交互规则和设计规范,如控件的反馈、手势等等,在基础交互层面较多的保持一致。

以下为WIMP对比图,包括交互设计中最基础的4点:窗口、图标、菜单、控制点[2],通过对比PC、移动设备、AR和VR,可以看出交互在不同平台上的差别与延续。

如何进行AR交互设计?

WIMP对比图

此外,设计者应该更多的关注系统和应用内部用户体验的一致性,即同一信息、功能、操作要保持一致。这种一致包括:结构一致、色彩一致、操作一致、反馈一致和文字一致。[3]


4. 灵活自由

灵活自由指在场景需求下,所有对象都具有可变性。这种可变性的幅度随场景需求的变更而变化,比如家具应用中,虚拟的3D家具可以随需要改变颜色、大小等。所有交互对象的可变性包括但不限于位置、大小、颜色、材质、光影等,甚至环境也包含在内。这种修改是对较难修改的做出临时的可视化修改,相当于一种“超自然交互”,且拥有“上帝视角”,这也是增强现实交互的深刻体现。

如何进行AR交互设计?

“工作台”是一种典型的体现灵活自由的场景

如何进行AR交互设计?

“工作台”是一种典型的体现灵活自由的场景

此外,灵活自由也意味着不受时间和空间的限制,能够查看一切对象的历史信息、对未来的可能性做出预判,能够帮助用户掌握整个场景内的空间信息。

灵活自由的目的是为了高效。大部分新产品设计都是为了提高效率,而灵活自由的交互能帮助用户按照自己最舒服的操作方式完成任务。灵活自由不仅能帮助产出物提高效率,也能帮助生产工具,即AR系统和应用,不断更新迭代,这种迭代通过“小步快跑”的策略,从细微处开始调整改变,在进化过程中逐步迭代,才能够保证用户既不反感和迷茫,也不影响整体体验和反馈效果。最终,这不仅带来了生产工具的更新,也完成了用户向新阶段的更新。

如何进行AR交互设计?


5. 用户为中心

用户是产品的控制者,设计要始终围绕用户进行,包括环境在内的所有对象要做到状态可控、自然反馈,某些场景下还应有隐喻和可探索。

状态可控指在不同场景下都让用户对信息有可控性。除了传统的增删改查,还需要所有对象易取,易交互。在真实世界中,用户大脑默认所有主动发出的交互都具有一定可控性,这种可控性自人类使用电子产品以来一直得以延续,在AR产品中,依然需要保证所有交互对象以“人”为中心。这一方面要求产品设计的交互流程都在当前认知范围内,另一方面要求做到防错和容错,在可控范围内提供更大的产品边界,比如提供撤销/重做功能,提供可操作的错误/修改提示等等。

如何进行AR交互设计?

自然反馈要求所有信息反馈都符合自然界交互反馈和之前的用户习惯。AR产品中的可交互对象包括虚拟对象和真实对象,真实对象用户可以直接完成交互,虚拟对象却不然。为了保证虚拟和现实的交互连贯性,虚拟对象要尽可能符合真实对象的交互习惯,如一个3D虚拟对象可以被抓起或抛掷,不同对象间会发生碰撞或挤压等等;此外,当与一些UI控件和信息发生交互,效果应该按照预想的方式进行,比如一个按钮是可回弹的,当点击后就要发生回弹的反馈,不能卡住,同样这种自然反馈在音效反馈中也要成立。

如何进行AR交互设计?

因为AR产品更贴近于真实世界,这时候适当使用隐喻将会使交互对象更显“真实”。合理使用隐喻要求,即暗示了恰当的使用方法,又避免了限制[4]。如AR购物场景下,用户看见购物车本能的会将商品放进去,但购物车的容量没必要进行限制,因为人们网购时购物的量有可能远超现实中的量;但隐喻并不总是有助于理解产品功能,所以要适当的取舍。此外,在保证一定安全性的前提下,人类天性都会探索未知,通过引入一定的可探索性,有助于提高用户对产品的喜爱和忠诚度。这一切都必须以用户为中心来设计与执行。

如何进行AR交互设计?


二、几点基本的设计规范

1. 直接操作

直接和对象进行交互,减少不必要的按钮等其他控件作为“中间人”。相比于2D屏幕上的直接交互,AR界面中的直接交互更具有现实意义,因为直接交互更接近于自然交互,用户能直观的看到交互产生的结果,这能帮助用户产生更强的操纵感,能更深的沉浸在业务中。

如何进行AR交互设计?


2. 环境相容

场景中的对象不仅仅是3D对象和UI控件等,环境也是对象之一。因此,环境要时刻围绕需求产生并融入场景。环境中的每一个对象,无论虚实,都要与整体环境相容,以提高完成业务的沉浸感,减少无关信息的影响,交互设计也要尽可能符合用户在真实世界的行为和反馈[5]。此外,用户同时也是环境中的一个对象,也要融入场景环境中。场景、环境、用户,三者是一个相互融合的关系,好比流水线上的工人,时刻都在处于完成某一工作的场景,完成工作又有流水线这一环境,工人又是流水线和工作场景中必不可少的一环。

如何进行AR交互设计?

上一张托尼,虽然有不少交互设计的错误,但足够说明此问题


3. 恰当反馈:

前面提到反馈应做到自然,而反馈最应该做到的是及时与正确,否则会造成用户对系统或应用的认知错误,因为延迟反馈和错误反馈都会极大的影响产品业务流程的顺利完成,引导用户走向“歧途”。

如何进行AR交互设计?

在核心思想的“以用户为中心”中提到了容错与防错,这里在再次提及并进行引申。在进行防错设计时,一要考虑帮助用户排除错误操作的可能,二要在关键操作和可能引起重大失误的操作时,反馈“是否确认”的操作;而在设计“容错”中,不仅要反馈操作错误在哪里,而且要提供修正方案,如一个仓库场景下,当某一个货箱无法交互,除了显示原因(如“锁定”),还可以显示哪些货箱是可操作的,或者通过引导完成货箱“解锁”。


4. 美学考量

这里的美不代表通俗意义上的美观或好看,而是表示设计是否符合场景需求,比如在游戏或娱乐属性强的应用中,使用极简设计极大可能会降低用户兴趣和参与度,而在教育或学术研究型应用中使用极简设计,反而会降低用户焦虑,提升对当下任务的沉浸感。营造产品美学特点不仅需要从颜色、字体和形状,更要从材质,光影等等空间属性的角度进行考量。


三、必知的常识性规则

1. 减少操作疲劳

目前的设备,手机或平板需要长时间手持设备,眼镜或头显虽然能解放双手,但视场角较小,如果没有充分考虑交互内容的展示距离与角度,就需要频繁移动头和脖子,造成较严重的疲劳感。当然,造成疲劳不可避免,但在设计上要尽可能降低疲劳感。

如何进行AR交互设计?

其次在视觉上,通过减少无关控件、隐藏待处理信息、将核心内容尽可能多的控制在视场角范围内等方法;

如何进行AR交互设计?

第三在操作上,尽量多使用单手交互能够完成的,减少复杂手势操作、更多融入语音或眼球追踪等被动交互等等。


2. 减少干扰:

首先,“提供短平快的AR体验”(“Design your UX for short and quick AR engagement”)[8],让用户焦点时刻围绕任务和场景,避免其他信息吸引注意力。其次,要合理提示现实世界中的干扰,如开车过十字路口,要高亮提醒信号灯状态和横穿马路的行人,避免造成重大危险的干扰。

如何进行AR交互设计?

再比如针对AR营销的广告内容,要根据展示场景、传播目的来决定交互方式,如可以用唤起好奇心等多种手段引导用户打开,但不能默认播放,因为在AR的世界中视觉冲击太多,很容易让用户产生焦虑,保留适当的克制对于产品留存很重要。

如何进行AR交互设计?


3. 提供指引:

AR系统和应用将用户从2D带入了3D,认知层面发生转变,新用户对于产品需要一个学习过程,此时应该提供使用使用指引,如同手机APP对新用户提供的指引,否则焦虑感会让人很快放弃产品。此外,指引不应仅针对新用户,还应在新功能上线、关键操作(如支付)等情况下提供,且简洁合理,特别是关键操作时最好提供说明或帮助按钮,以便及时提供支持。

如何进行AR交互设计?


4. 注意物理条件限制

在进行操作之前,由于2D世界和3D世界的不同,应进行空间检测、平面(或称为“基准面”、“参考面”)检测并判断遮挡关系。这是由设备主动对环境发起的交互,可以帮助用户确定可交互对象的范围。同时也限定了用户交互的安全范围,减少操作中造成的人身伤害。

如何进行AR交互设计?


5. 其他感觉反馈必不可少

在使用增强现实产品时,用户实际置身于一个真实环境营造的“场”中,试想在现实中,我们不仅接受视觉、听觉,还有触觉、味觉,甚至各种磁场、引力场等等都围绕在周围,所以要通过不断丰富的传感器,帮助用户形成更接近真实的交互体验。


6. 合理处理中断

用户主动中断的情况下,如应用切到后台运行或重新定位检测平面等等,需要提供合理反馈,告知用户操作后果并提供是否进行的选项。

当用户被动中断时,如即将断电、有信号干扰,或是现实中有其他对象突然进入场景等等,需要提供被动交互,帮助用户了解当前状态,并且引导用户做出主动反馈。[9]

在用户被中断,重新进入系统或应用时,一定要注意此时的用户起始点,如果用户相对于场景的坐标发生了变化,就需要重新定位并检测环境,以减小操作误差。


四、设计方法与流程

在进行设计时,依然可以参考用户体验五要素的流程,即战略层(产品远景、业务需求)→范围层(需求分析、功能确定)→结构层(信息架构、页面关系)→框架层(页面布局)→表现层(视觉表现)。但在实际操作中,需要更多的关注一下三点:


1. 确认真实场景

首先要明确:不是为了AR而AR。一定要有真实的使用场景,要能解决用户问题。然而要注意,广告中加入AR做营销,确实是一种有效的手段,不属于“强行AR”的范围。

其次,AR类系统或应用场景中有大量现实世界的对象存在,由于应用内展示的信息量有限(不能影响主要任务或造成干扰),这就导致不同的应用下交互方式可能差别很大,更倾向于定制化。比如同样是面向工业,机械制造更多需要操作指引,包括标记、模型拆分与组合等等;仓储管理需要室内导航,包括目标物定位、路线指引等等。所以,确定了场景,才能细化需求,设计交互。


2. 确定合理需求

这一过程,除了和传统移动产品需求分析一样,还要注意以下三点:

首先确定,罗列的需求是否为刚需或高频发生。不是的话没有意义且浪费资源。还要清楚AR技术的使用是作为功能解决单一需求,还是作为一个用例;是体验的核心,还是只作为辅助手段。

如何进行AR交互设计?

高德导航中作为辅助功能

其次,针对迭代产品要考虑到,新增需求是否会对现有逻辑和交互设计产生较大的影响,如果是就需要联合多部门和用户共同商讨决定。

第三,在产品流程梳理中,要充分识别哪些是最需要通过AR优化的,哪些是可优可不优的,哪些是绝对不能优化的,制定出优先级。

第四,作为一款产品必然有一个潜在需求,就是传播需求。一个产品从设计之初就要天然的具有自带传播属性,为推广运营做铺垫。

最后,要充分考虑到哪些信息从云端调用,哪些放在客户端,减小延迟,提高用户体验。


3. 采用良好交互

这一过程要充分考虑:如何“增强”信息,才能满足需求。“增强”的效果,要从更好达成目标,节省更多时间,运行压力和耗电更小等等多个方面进行考量。如果“增强”过度,会造成资源浪费、增大延迟,比如购买电视机场景中,单击产品显示产品名和价格,就比完全显示产品详情、参数要好。反之,如果“增强”不足,会导致用户焦虑,甚至不能完成业务流程。

此外,3D环境下的影响也应重点考虑,毕竟2D和3D的环境不同,需要提供具有空间感的交互逻辑。

如何进行AR交互设计?


五、关于设计师的一点思考

在最后,我要说一点关于“共情”的想法。

在用户体验中,最重要的一种能力可能要算“同理心”了。同理心能帮助产品和设计人员提前去解决用户将要遇到的问题。同理心是一种天赋,但并不意味着后天不能通过练习培养。当面对AR产品设计时,更需要这种能力。因为AR系统和应用是一套全新的体验,产品设计人员更难全面的体验和统计用户感受,因此需要不断的运用同理心去模拟用户,想用户之所想,这样才能减少用户新进时的迷茫与焦虑。

运用同理心,不断试错,不断迭代,不断尝试新交互思维与方法,才能逐渐探索出合适AR产品的交互方法。

如何进行AR交互设计?

推荐阅读:

AR技术推动教育前行

AR技术如何革新制造业?

AR将颠覆制造业和物流业?

A R能给户外广告带来什么 ?

AR技术的103个应用场景汇总!

AR与区块链结合将大力促进行业发展

AR变革通讯 让场景化工作应用一目了然

AR技术发展迅猛,产业瞄准八大应用领域!

AR浪潮来袭 这些都是市面最佳增强现实智能眼镜

AR悄无声息改变我们的生活,看这39位专家怎么说


如何进行AR交互设计?

如何进行AR交互设计?点击“阅读原文”看更多资讯

原创文章,作者:交互精选,如若转载,请注明出处:https://www.iamue.com/36771/

(0)
交互精选交互精选
上一篇 2018-04-29
下一篇 2018-04-30

相关推荐

  • 基于用户体验的性能测试:模拟个别的用户延迟(续)

    本周免费下载杂志:《保健与生活》共计12本,请点击下行红色文字链接获取下载地址杂志推荐《保健与生活》3.       在TestStudio中生成时间延迟使用Rational TestStudio的VuC语言,有很多方法可以生成时间延迟。对于如何使用Think_avg及相关的命令和参数来实现,Rational的文档和培训资料已经做了详细的说明,这里不做深入讨论,只做简要介绍。这个方法只有在Think_avg命令不在计时器(Timer)里...

    2018-02-01
  • 【分享•客户体验】“互联网+”如何提升用户体验?

    “你兜售的虽然是产品,但真正能使你获益的却是服务”。为何这样讲?众所周知,顾客就是上帝。在今天,客户体验越来越多的被提及,产品得到了更多的外延及扩展,已经不再局限于产品本身的价值,而有了更多的后续价值和服务的依托。注重交付的每个环节的规范与体验,这让卖点从产品本身逐渐渗透到整个产品的生命周期中,用户对品牌的认识也开始从产品蔓延到店面、店员、交易流程是否顺畅、售后服务是否及时到位等诸多层面。换句话说,产品是基础,而优质的服务可以帮助企业赢...

    2018-02-11
  • Axure RP 7.0安装教程

    Axure RP 7.0Win版/64位下载地址:https://pan.baidu.com/s/1qN-SzT5g9U-O9OSzCMEnEw密码:8b6sAxure RP简介:Axure RP是一个专业的快速原型设计工具。使用者主要包括商业分析师、信息架构师、产品经理、IT咨询师、用户体验设计师、交互设计师、UI设计师等,另外,架构师、程序员也在使用Axure。适用系统:win7,win8,win10安装有问题或需要远程安装请联系:...

    2018-04-30
  • 有用户体验落地方法,才能让销售额增长

    图片设计 | 宗宗;编辑 | 海悦如果你觉得本期学霸有链接价值,请在【学霸十三妹】微信公众号后台回复"黄胜山"即可获取学霸联系方式。在物品富足时代,如何吸引用户的青睐,抓住用户的眼球,是很多商家不得不探索的课题。今天,在上海洽客in,学霸十三妹请来了学霸黄胜山,专注研究用户体验十年的老司机,带你揭秘用户体验那点事!黄胜山:唐硕体验创新咨询 管理合伙人,浙江大学心理学硕士,上海交大MBA和混沌商学院,14年用户体验咨询和设计经验,服务客户...

    2018-03-21
  • Axure RP 8 入门手册 – 第1章(上)

    第一篇基础第1章准备工作与注意事项第1节下载安装Axure RP8第2节原型相关的文件类型第3节文件自动备份与找回第4节功能区域的视图设置前言【网络稿】2015年夏天,经济形势日趋恶劣,小楼所在的公司业务规模大幅缩减,无奈之下,公司决定各部门进行裁员。小楼断然决定主动申请辞职。2015年8月17日,AxureRP8.0Beta版首次发布的日子,小楼提着收拾好的杂物袋,站在公司的门外,看着公司的LOGO墙,旁边是一年前来到公司的大学生苏苏...

    2018-03-29
  • 如何平衡广告盈利和用户体验?

    如果你是一名手机应用开发者,你肯定知道广告可以为你的应用提供巨大的收入潜力。可以说手机应用就是在为流量主下金子: 到2020年,将会有高达1890亿美元的收入,而其中仅应用内广告带来的收入就会达到1170亿美元。事实上,我们最近对1000多名应用程序开发者进行了调查,发现高达84%的人承认他们通过广告将应用变现 —— 61%的人声称广告带来了最多的收入。但是,一如既往,能力越大,责任越大。作为一名应用开发者,你要负责确保用户的使用体验,...

    2018-04-06
  • 用户体验地图

    利用用户体验地图实现产品的情感化设计;先来看一张图:我们可以将用户体验地图分为三个区域,其中:# ZONE A 提供了对地图的界定;# ZONE B 是视觉化的用户体验过程;# ZONE C 描述了用户的痛点;我们通过拆分各个区来实现一个用户体验地图的构建;A区:1 : 表示一个角色,即体验的用户是谁,或者说你的产品的目标客户群体是什么样类型的人;2 :表示待调研的场景,即在用户什么情景下会使用你的产品;B区:3 :可分段的体验过程,即...

    2018-03-28
  • Sketch快捷键速记表(中英对照)

    Sketch 是一款好用快捷的设计软件,很多做UI设计的同学开始从 PHOTOSHOP 转向 SKETCH,使用它不仅可以做 WEB 和 APP UI,也可以用它来制作高保真原型或交互稿。如果你刚接触这款软件,那么熟记他的快捷键会大大提高你的作业效率,下面是最新的 Sketch 快捷键一览表,可以让大家快捷查询或记忆Sketch的快键。原文地址:http://www.shejidaren.com/sketch-kuai-jie-jian...

    2018-04-16
  • 《用户体验可视化指南》视频讲书(4)

    这是《用户体验可视化指南》书中第一章的最后一个视频了。继续上个视频继续介绍几种共线图,这次横向比较各种共线图的差异,使用它们的原则和好处。点击视频观看(大约14分钟,推荐室内安静、有wifi环境下播放)兰静同学听后分享这节内容是第一章的精华,一定一定一定要边听边看书本,最好多看几遍。主要分为2个部分:在这节视频中,结合书本第3个大模块中的内容,详细讲解了这5类常见共线图的差异和各自的特色。闭上眼睛想一想,要是还想不起来服务蓝图、体验地图...

    2018-04-07
  • 百度金融用户体验中心负责人 曲佳:设计师求职七宗罪

    继上个周五 19:00 腾讯互娱游戏平台部设计总监陈维的第一节课《如何通关 UI 设计师的游戏副本》后,昨晚百度金融用户体验中心负责人曲佳联合团队的设计经理孔敏,给知群的用户们带来了「七大公司设计师面试官授课合集」的第二节课《设计师求职七宗罪》,在分享的最后环节,也给出了目前百度金融尚未对外大规模公开的招聘信息(最近有跳槽意向的设计师们抓紧时间上车)。曲佳:百度金融设计架构师,百度金融用户体验中心-百度 FDC ( Baidu Fina...

    2018-04-04