恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
从移动设计到AI设计(一)- 4个维度打造优秀语音交互体验
0.0°
2017-08-22 原创文章 经验/观点 举报 2558 21 9 1


从移动设计到AI设计(一)- 打造优秀语音交互体验的4个维度


【AI给人机交互带来根本改变】

1.AI的核心能力

回顾人机交互发展是“技术进步”与“载体创新”交替螺旋促进在推动这人获取信息的效率不断提升,成本不断降低。

      AlphaGo先后打败李世石和柯洁,百度发布自动驾驶系统“阿波罗”…..这一次由Ai引领的技术进步正在发生。基于大量纯净数据的深度学习给将人工智能带来的了巨大的进步,这种进步主要体现在三个维度。

认知能力 - 基于用户行为的画像,将人机交互从“单向”关系带入“双向关系”

感知能力 - 由触摸输入到以语音输入、图像识别为核心的全自然交互

自然语音输出能力 - 带来新的”语音“设计材料

Image title


     在过去的3年时间,我先后主导贾维斯智能语音管家/百度智能家居/Duwear智能手表操作系统/情感化语音等多个人工智能项目的人机交互设计,深刻感受到这三项能力相互影响,将人机交互从移动时代的“Finger-first”带入AI时代的“Voice-first”变化。语音对于体验设计师来说是新的设计材料,它有哪些设计挑战?语音设计有框架可寻吗?有哪些设计方法?我将在下面的文章与你分享。

 

【设计挑战】

1.从“有边界”设计到“无边界”设计

当我们设计App界面,交互设计师会穷举用户在固定像素界面内所有可能的操作,一一设计恰到好处的用户反馈。但是对于语音交互用户的输入是没有边界的,用户可能的输入将远远超出你可能的穷举的范围。从”有形“的设计到”无形“的设计,视觉的设计规范在语音设计过程中将完全失效。

2.从“近场”交互到“远场”交互 

语音交互可主要分为近场交互(例如:度秘/siri)和中场交互(车载)、远场交互(智能音箱)。2015年当我负责”百度智能语音管家(Echo的同类产品)的人机交互设计时,远场交互时用户的状态对设计提出了很大的挑战。

远场交互场景具有如下特点:

a.不专注:用户与语音设备交互的过程中注意力可能在其他事情上。

b.不确定:用户如何获取当前系统的状态,“我唤醒了设备吗” “我可以说了吗” 如何让语音交互是流畅的?

Image title


【设计建议】

一.用“语音交互框架”匹配“使用场景” 


语音的交互框架:

       现在回想你让别人帮你把水杯拿过来,你与这个人的交互节点是什么样子的?

首先你要叫他的名字,如果他听到了会回答你“干嘛呀”或给你个小眼神儿,这时候你知道他在听你说话,你可以继续说了-“给水杯拿来”。他可能需要想想水杯在哪或者问你,当他去拿水杯你会看到他正在行动。将与人的语音交互节点提炼出来,你一定已经可以更容易理解交互框架: 

Image title

如上图所示语音的交互框架由以下四个节点构成,每个节点用户有相应需求:

a.唤醒:用户有得到“是否唤醒语音“反馈的需求

b.输入:用户有得到设备正在“听说说话吗”的需求(相当于loading)

c.理解:用户有得到“在帮我说事情吗?“ 的需求

d.回答/行动:用户有查看任务是否完成的需求

      语音的交互框架解释了语音交互流程,等同于触屏设备定义的”点击屏幕“”双指pinch“ ”摇一摇“。但是仅仅了解交互框架是远远不够的,比框架更重要的是语音交互场景,在不同场景下以上”唤醒、输入、理解、回答/行动“四个节点有不同设计方式。


语音的交互场景:

语音的交互场景分类近场、中场、远场三大类:

Image title

如上图在三类语音交互场景中,用户的注意力是否集中在任务上和是否有屏幕输出是主要的设计考量因素。

举个例子:在语音交互的第二个节点 - 输入中需要用”波形高低“与”语音响度高度“相匹配来给用户正在聆听的反馈,在不同场景下波形要采取不同的设计策略:

车载场景:驾车时用户的视觉注意力被路况占据,这时候一方面需要引入”叮“的一声语音反馈,另一方面需要设计采取更强的视觉波形确保一撇既得。

语音音箱:语音音箱的场景虽然不像驾车场景注意力被强占据,但是它是没有屏幕的,这时候一般会采取带强弱有呼吸感的等效解决反馈的问题。

”无形“的语音能”附着“在各种设备上,场景也是千变万化的。在设计时要时刻记住”唤醒-输入-理解-回答/行动“的语音交互框架和每个节点的用户需求,关注用户的使用环境,和视觉/听觉注意力的占据情况,不要局限只用声音做反馈。


二.“唤醒”设计

     唤醒是语音交互的第一步,听说刚发布的某国产品牌的AI音箱选了十多个唤醒词,最后才用了“小爱同学”。虽然只是江湖传言,但也也充分说明了唤醒设计重要性。

主流的唤醒方式有以下3三种 - 实体按钮、虚拟按钮、语音唤醒,每种唤醒方式各有特点,适用于不同场景,下面我们来逐一分析一下: 

1.实体唤醒:优点是能提供触觉反馈,使用场景有两种 

当用户的视觉通道被占据时,例如车载。 近场交互且设备没有屏幕或屏幕处于熄灭状态时,例如在熄屏状态下通过长按Home唤醒siri 



2.虚拟按钮:虚拟按钮的唤醒方式有两种操作方式 - 点击和长按。两种方式的本质差别有三个-与面部距离;操作成本,长按大于点击;微信养成的语音输入习惯使得长按更符合用户习惯。

a.点击:面部与屏幕距离远,波形反馈可见,能更好的确认设备是否在收音。且成本较小。大多数的近场交互都可以使用。同时车载场景特别适用,试想在驾车情况下让用户长按输入语音简直就是灾难。

b.长按:离麦克距离比较近,能带来更好的收音效果。可以作为一种辅助的唤醒方式兼容。


3.语音唤醒:

在双手被占据和远距离场景下语音唤醒都是最佳的方式,在设计语音唤醒是要注意以下两个方面:唤醒词的形象/注意唤醒后的声音反/防止误触发

a.唤醒词的形象设计:

唤醒词的设计是机器人格的一部分。在平常的社会交往中,高雅、深邃的名字,往往会给人留下美好的印象。庸名俗字则给人一种不愉快的厌恶心理或排斥感。比如静静给人”文静,秀气”的感觉。“糖糖”给人“甜蜜”的感觉。

初期的人工智能的能力是有限的,有时会给出不尽如人意的回答。一个萌萌的有亲和力的名字能让用户有更高的宽容度。最近某国内科技公司的“小爱同学”就是很好的选择。

同时唤醒词意象要与声音特色相一致,听觉情感是非常敏感的,想象一下如果一个萌妹子说话的声音很粗犷,或者一个壮汉声音很细你是不是觉得很不舒服。去定义唤醒词对应的感知意向,在语音合成训练时匹配这种意向。

b.使用反馈音:

语音唤醒一般使用在远场交互场景,这时候用户很难能通过视觉确认是否唤醒了设备,这时要给出语音反馈  —- “叮” 或“我在呢”等等

c.防止误触发:在日常交流中我们每天会说很多重复的字或词如”你“”诶“哦”等等,在设计唤醒词时要避开这些词汇。



三.“听觉形象”的体验设计

通过“色彩、材质、形状、版式、动效、字体”塑造视觉形象,用视觉形象反应产品气质、品牌理念是GUI设计师工作之一。人工智能赋予了机器拟人化声音输出的能力,带来的语音设计材料。不同的声音带给用户的感受是不大相同的,低沉的声音给人“稳重,成熟的”的感觉,尾音语调向上的声音给人“愉悦,被尊重”的感觉。

如何用“音色、节奏、音调、响度”的语音设计要素设计恰如其分的听觉形象?

今年6月我在内部项目中对百度FEED读新闻的体验进行了重新设计。其中让AI在读不同的内容时使用不同的听觉形象大幅提升了TTS的情感化程度。下面我结合项目经验和一些研究与你分享一些流程的方法。



1.从“先设计后开发”到“先开发后设计”一个全新的实现流程

    语音是不可见的,设计师没有“语音的PS” ,在语音形象的设计中必须先有“语音基础形象”设计师基于语音基础形象进行再设计。对百度FEED读新闻的体验重新设计时,先进行的是不同新闻情感特色的定义,基于新闻情感收集当量的”语料“数据,通过深度学习来提取每类语料数据的声音特色形成”基础形象“,在对基础形象进行”语调,速度,节奏”的微调进行升级形象设计。 

Image title



以上流程可抽象出“听觉形象”的设计流程 :“定义 - 挑选 - 训练 - 调整”

Image title


定义:根据内容/产品气质/品牌愿景定义产品的“听觉形象”,八卦的情感要用“戏谑的”,历史的听觉相应要有“仓伤感”

挑选:去语音库里挑选具有定义的听觉形象的语音片段。比如如果要产生的听觉形象是“沧桑感”时,可以挑选一些单田芳老师语音片段

训练:将大量语音片段交由技术人员进行语音合成训练

微调:通过调整“语调、速度、节奏”使之给用户的感觉更接近于先前定义的“听觉形象”


2.保持一致性

视觉的一致性是界面视觉设计的重要原则,在“听觉形象”的设计中一致性设计原则也十分重要,主要包含以下三个维度: 

Image title


a.保持“听觉形象”与“品牌情感”的一致性

在进行视觉设计时设计师要通过“色彩,形状”等设计元素支撑品牌情感,对与大型公司会要求他们的每一个产品遵循一致性的设计规范。进入“听觉形象”设计时代,当你的产品要使用语音交互时,确保产品的“听觉形象”与品牌情感保持一致,这将能够强化品牌给用户的印象。

b.保持”听觉形象“与“用户场景”的一致性:

现在回想一下机场内的语音“尊敬的旅客飞往北京的T343航班….”,这种语音形象给用户“被服务的、受到尊敬“的感觉,与用户在机场的场景相一致。而在医院,起码在中国的医院,医疗资源与患者数量极不匹配,患者与医生更像是”求助关系“而非“服务关系”, 使用过于“服务化”的语音形象反而会给用户带来强烈的落差感。

c.保持“听觉形象”与“内容“一致性

“内容”本身是具有形象属性的,比如二次元的新闻如果用粗犷的男生读出来一定会很违和。因此在进行设计时要充分考量语音所说的内容与“听觉形象”相匹配,避免出现违和感。


四.利用视觉

     语音交互的最大优势是更加直觉化,可以大大降低用户学习成本。但是语音输出的是线性的,因此它无法同时输出很多内容。这是语音最大的劣势。

    2015年当我在设计语音管家时有人提出要做个语音点外卖功能。这其实是违背语音场景的,当语音输出到第十道菜时用户已经忘了第一道菜是什么了。 所以当时在设计时当用户发起需要当量信息交互的任务时,会通过PUSH引导用户查看视觉信息。

     在设计时充分利用视觉与听觉的互补性,听觉记忆时间短暂的,不要用语音输出大量信息,尤其输出的信息是需要用户记忆时。 


【AI时代的变与不变】

       AI带来机器的认知能力和感知能力的提升,给人机交互带来的改变是根本的,传统的人机“输入 - 反馈”循环,将逐步过渡到“推荐 - 选择”循环。人机交互也将由单向从属关系,向双向训练关系过渡。这种改变将重写“设计思维、方法、流程、规范”

      然而每个时代都会有属于它的符号和偶像,对于设计师来说,赋予产品以灵魂的精神是始终不变的,从索尼到苹果设计始终引领潮流。

更新:2017-08-22

收藏

21人已收藏

我看的见六娃

我看de见六娃

  • 2

    作品

  • 31

    粉丝

  • 4

    关注

  • 换个姿势做智能手表 - 百度智能手表OS设计总结
相关标签
设计分享

    猜你喜欢

      2017-08-22 原创文章 经验/观点 举报 2558 21 9 1

      从移动设计到AI设计(一)- 4个维度打造优秀语音交互体验

      0.0°

      你确定要举报从移动设计到AI设计(一)- 4个维度打造优秀语音交互体验

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2017年08月22日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      9
      21
      1

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录