提交需求
赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!
车展项目设计流程和设计心得
利用展示车舱,包括透明屏、前屏、侧屏、顶屏以及多个摄像头,来识别动态手势和表情,并模拟车内驾驶、娱乐和办公场景。
之前版本是暗色基调,由于模拟车舱的屏幕为玻璃材质,像电脑屏幕一样越暗越会有强烈的反光,在观看时会有视觉干扰,而且稍显沉闷效果不佳,所以我们决定将这一版本的页面风格改为明亮的浅色。
接到设计需求后,先将自己带入参展用户的体验流程,结合公司目前的多模交互能力,分别梳理出了用户通过手势、语音和表情进入应用的主要交互流程。然后按照模块分别设计交互流程和视觉页面。
本次车展与其他车舱应用的不同之处是加入手势交互、语音和表情识别等多模态交互,根据这个特性,我们决定将设计着力点放在唇语识别、AR相机和引导设计上。
初步接到这个需求的时候,了解到唇语识别是利用唇部形态变化,在嘈杂环境中完成行车指令的识别,我司的识别准确率在业内遥遥领先,然而呈现给用户的其实就是单调的唇部识别框和接收到指令的结果页。
我在想,展会展示和实际应用的场景不同,这么厉害的技术怎么能让用户更好的感知到呢?通过对唇语识别技术流程的了解,想到可以通过炫酷的UI动效体现识别的步骤:识别面部-定位唇部-逐字展示,将技术层面可视化去表现唇语识别能力。
这个设计侧推动的方案最终获得了开发和产品的认可,得以呈现给大众。
我们在唇语识别前设计了识别框动效。该框会先识别面部位置,然后确认唇部位置,并提示用户不发声音说出指令进行唇语识别,识别成功后实时展示结果页。
随着城镇化的发展和城市范围的扩张,人们的通勤距离变得更长,花费在交通工具上的时间也随之增加。汽车在出行场景中已经不再是单一的“代步工具”,而是被赋予了更多的娱乐属性,逐步升级为智能移动空间。AR智能相机就是其中的典型产品,现已在广汽、东风等部分车型中实现量产。
本次结合车展场景,加入手势交互、语音和表情识别等多模态交互形式,让拍照体验更智能。
为了提高互动率和提升参与感,我们还设计了打印照片的动效,并设计了边框。在讲解结束后,现场工作人员将这些照片送给观众,让他们带着回家,增加记忆点。
现场打印的照片
“引导设计”并不仅仅是新用户引导。
在上一次车展中,开头会给用户播放一段视频介绍主要的功能和手势操作方法,但是也许我们都有这样的感受:在没有到达这一步的时候,提前的介绍通常会想要跳过或者看完之后记不住。
因此我们需要判断哪些是关键节点并给予用户需要的引导介绍。
另外就是在应用中,利用数字人的声音和动作给予用户引导,仿佛有一个专业的导游提供指引。
比如健康检测app是通过摄像头检测面部毛细血管以测量心率、呼吸频率等健康指标的,这个测量过程会比较长,大约30秒左右。在这个阶段,我们对数字人的语音和动作进行了设计。
开始检测时,数字人会说:“让我们开始检测,为了检测的准确性,请您面向摄像头,保持静止~”。
检测过半,为了缓解等待焦虑,数字人会说:“耐心是一切聪明才智的基础,请再坚持一会儿哦~”。
并伴随双臂展开的不同讲解动作,更加真实生动。
“健康检测”部分流程设计图
END
谢谢观看,您的点赞是我最大的动力~
Powered by Froala Editor
大牛,别默默的看了,快登录帮我点评一下吧!:)
登录 立即注册