如何进行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

相关推荐

  • Axure RP 8.0 软件激活 安装教程 激活码 序列号

    点击上方蓝字关注免费领取百度网盘超级会员等部分软件没有贴详细教程和网盘链接,可以给公众号留言发信息,也可加微信:qihai-77当你需要的软件我们没有发布时,可以给我们留言或者加微信:qihai-77反馈哦链接:https://pan.baidu.com/s/1VjyU1Ok307Go4VaV54LhcA密码:3nf7有任何需要安装的软件或问题可咨询微信客服:qihai-77链接失效可在公众号留言某某链接失效 或联系微信客服:qihai...

    2018-03-29
  • 【设计竞赛】2018UIA-霍普杯竞赛开题!扎哈事务所新任掌门人帕特里克 · 舒马赫担任主席

    编者按 :期待已久的2018UIA-霍普杯国际大学生建筑设计竞赛题目新鲜出炉啦!扎哈 · 哈迪德建筑师事务所(ZHA)负责人帕特里克 · 舒马赫担任本次竞赛主席并拟定题目。帕特里克 · 舒马赫Patrik Schumacher扎哈·哈迪德建筑师事务所负责人竞赛主题演变中的建筑Architecture in Transformation竞赛题目城市共生:定制化社区模块Urban Co-living: Customizing Modules...

    2018-02-02
  • 视频平台VS网络电视:内容营销提升用户体验是硬道理

    近年来,视频平台发展迅速,视网同步、网络独播等不断满足观众的各种需求。在“马太效应”(即强者愈强、弱者愈弱的现象)愈发明显的行业环境下,各大视频平台领跑行业,但版权购买、会员抢夺、内容营销等现象导致行业竞争持续加剧,视频网站将迎来升级。同时,随着互联网发展,“互联网+电视”的形式也在逐渐普遍,对于观众而言,足不出户便可以通过科技满足观看喜好已成为现代生活的标志之一。那么,视频平台与互联网电视有何区别呢?它们在内容选择和盈利方式上又有何不...

    2018-02-12
  • 网络心理学与用户体验:如何使用户爱上我们的产品?

    什么是网络心理学?网络心理学(Cyberpsychology)是研究人与科技交互的背景下人们的心理与行为的新兴学科。它关注网络世界以及网络对人们行为产生的影响。近年来,网络心理学逐渐脱离其他研究人类行为的学科(如社会心理学),形成了自己专门的心理学研究领域。了解来自这个新领域的研究可以帮助设计人员更准确地预测人类在使用不同技术时会如何反应。因此,在思考如何使用户爱上我们的产品时,了解网络心理学是一个非常有用的手段。通过更好地理解用户与技...

    2018-02-23
  • 刺猬公社招聘汇 | 通往offer之路

    ■更多招聘信息,以及1对1职业咨询,尽在offer之路。扫描上图二维码,即刻加入!本期招聘概览北京:商业新媒体  中国国家地理  北大出版社  音悦台  华谊兄弟    光合映画腾讯研究院猫眼电影  一点资讯  人民日报  摄影之友  经济观察报智云图  鱼眼视频上海:GQ杂志爱奇艺(绿色为正职,黑色为实习,红色可转正)全职信息1  商业新媒体 | 新媒体采编来源:@商业新媒体岗位职责1.关注并监测娱乐内容营销行业内的最新动态,策划行业...

    2018-04-08
  • 用户体验 | 6个细节成就了今天的X1 Carbon 2018(下篇)

    上篇我们聊了Logo配色、ThinkShutter以及电源键设计,这一次我们一起来看看外形设计、移动便携和扩展能力ThinkPad X1 Carbon 2018在用户体验上有什么有趣的故事吧!一条曲线的神奇虽然建筑师高迪说直线属于人类,而曲线属于上帝,而逐渐读懂曲线的意义,思考曲线与直线之间合理应用,这整个的过程正是人类自我救赎和思想进化的过程。纵观笔记本变化的历史,外形和颜色往往决定着“颜值”,改变外形或者颜色设计的情况比比皆是,连M...

    2018-03-22
  • 与经典艺术交互体验,迪士尼推出AR博物馆,“篡改”世界画作

    ——映维网——国际影响力VR信息数据平台文章相关引用及参考:vrscout怎样做到?用户能够通过移动设备扫描博物馆中的任何2D艺术品或者是书籍,然后实时更改颜色和色调。例如,你可以把《蒙娜丽莎》变成紫色的皮肤(映维网 2017年09月02日)迪士尼在2015年开发了一种可以通过实时纹理来创建彩色书籍的AR技术(一种捕获2D绘图来实时创建3D增强现实图像的过程)。自那以后,迪士尼将实时纹理技术发展成一个名为AR Museum的新AR应用程...

    2018-01-30
  • Sketch常用插件介绍

    sketch大家应该都不陌生,在互联网设计尤其是UI设计相对于老牌PS,sketch提升了工作效率,改变了以往的工作模式,sketch的强大除了软件本身,另一个不可磨灭的功劳就是丰富的插件。今天给大家介绍几款常用的插件:一、Sketch Measure一键自动生成 HTML 页面,离线下检查所有设计细节,包括 CSS 样式。在线演示: http://utom.design/news/二、Craft帮你提高效率的自动填充神器a.文本自动填...

    2018-04-12
  • 未来美甲店一定赢在“用户体验” | 互联互生

    咱们来假想一个情景,你到一个新公司第一天上班,你刚到公司门口,就有一位打扮非常正式的女士专门迎接你。她领着你在公司走了一圈,介绍了各部门的情况,然后把你送到你的办公桌。你发现办公桌上挂着一个横幅,上面写着“新人在这儿!”全公司都能看见。你打开电脑,屏幕是一张代表公司理念的美丽图片。办公桌上有一份给你的礼物,是不锈钢做的一个公司产品的模型。你刚连上电子邮件,就收到 CEO 亲自写给你的信,对你各种鼓励、希望你能度过愉快的一天,也希望你在公...

    2018-04-29
  • 用户至上——何为用户体验

    在这边学习笔记中,主要将讲用户体验是什么、UCD的设计原则、设计原则在项目中的应用和市场、商业、用户不同需求的区分这四个方面。第一:何为用户体验用户体验设计协会将用户体验定义为“用户与产品、服务和系统交互过程中感知到的全部要素。用户体验设计包含构成界面的全部要素,例如页面布局、视觉设计、文字、品牌、声音和交互等。可用性工程协调各个要素之间的关系,并为用户提供最佳的交互体验。”另一个虽然可能不是最佳答案,但是简单有效的回答——就是让技术变...

    2018-04-24