Work

多种车载摄像体验设计

捕捉并分享驾驶关键时刻

WAYLENS

Waylens 是一间由美国 MIT 毕业生所创办的初创公司,在车用摄像头领域具有优秀的技术,提供车载设备、数据、云服务产品。从第一个产品便与在野密切合作,在野针对不同产品的技术特点与应用方向,从0到1设计整合多个产品一致流畅的体验。

1 WAYLENS Hachi

HACHI 为配有 1.39 英寸屏幕的行车记录仪,应用程序除了产品本身,从 iOS、 Android、MAC、PC 平台到 RWD 网站都需设计开发,
包括录制、编辑和共享等功能。在野拟定了最有效率的跨平台设计计画,先在 iOS 平台定下了交互与风格,再依据不同平台的 Human Interface Guideline 进行适配,与开发团队深入协作,在最短时间内完成良好、一致的体验设计。

跨越硬件和软件边界

项目不仅仅以界面设计开始,还需要了解硬件技术的局限性,因为相机硬件对应用程序交互的方式有很大的影响。例如如何简单地设计相机和 app 连接的用户流程? 我们必须深入与工程师的合作,找到新的设计机会点来解决问题,使流程易于理解。

设计 1.39 寸的屏幕

与 Waylens 的设计师一起,在有一个 1.39 英寸的屏幕的行车记录仪上,我们负责设计一个称为 LapTimer 的车速记录的功能。 考虑到屏幕尺寸的限制,我们必须尽可能简化操作行为,每个页面都没有或仅有一个轻击操作,大部分用滑动手势来切换功能,以最大限度地减少复杂性。通过短暂的嘟嘟声和动画效果,用户仍然可以专心于驾驶。

在移动端实现智能化快速编辑分享

针对使用场景,主要操作功能按键比例较大,易于点击。动画表现产品运行状态,方便掌控与产品连接状态和信息。并且支持智能化生成短视频,驾驶可以轻松分享精彩瞬间。

在桌面上快速且高效地进行视频管理

在桌面端,我们可以使用更大的显示区来平铺素材,编辑,预览和增强的编辑区域。
电脑读取相机资料后,用户可以将其拖放到编辑区,更改资料的详细信息,同时在右侧菜单栏中添加喜欢的音乐或乐器主题,快速完成 1080p 高清视频编辑。 整个过程无需离开主面板,降低了用户的认知成本,大大提高了操作便利性。

2 WAYLENS Secure360

Waylens 推出了全新的车用安全监控摄像头 Secure360,具有独特的 “防盗” 功能,即使用户离开了汽车,它还能保持监控车里车外的环境。
在野为其 App 打造完整体验设计,帮助用户方便随时通过手机全方位查看自己爱车的周边状况。

生硬视频列表的全新表达

经过与 Secure360 开发团队的讨论,我们放弃了传统核心信息排布的方式,采用时间轴的概念去引导用户快速找到自己所需的行车监控记录。时间轴的显示更加有趣,用户只需要上下滑动可在几秒时间内查看完一天的记录,提高了操作的便利性。

色彩让筛选更快速

行车记录中会有很多无用消息,为了让用户快速筛选出所需信息,通过颜色逐渐变深来区分危险程度的递增,用四个颜色来代表四种状态,分别为 Motion 、 Hit 、Heavy Hit 、Highlight ,扁平的 icon 设计也让用户一目了然。

Motion

发现轻微撞击或者移动,例如行人经过不小心的刮蹭,用户会收到 Motion 的消息提示。Motion 为程度最轻的警告,所以选择浅黄色来代表,也有警告的暗示。

Hit

发现撞击或者其他危险,例如有小偷撬锁,用户会收到 Hit 的消息提示,Hit 为中度危险的警告。颜色上也选择了比黄色更深的橙色来呈现。

Heavy Hit

发现大的撞击,例如撞车,在用户收到消息的同时,紧急联系人也会收到电话提示。Heavy Hit 为最高等级的警告,颜色上选用红色来强调。

Highlight

用户也可以在整段记录中截取自己想要的 Higlight ,制作只属于自己的小视频。为了显示 Highlight 的特殊性,选择 App 主色调蓝色来表示。

颜色区分读取模式,避免流量损失

用户透过 4G 获取视频信息需要花费流量,我们用对比强的蓝色与橙色区分 Wi-Fi 与 4G 模式,让用户能直观切换,避免预期外的流量消费。

进入车内,app 自动进入无需流量的蓝色 Wi-Fi 模式,以时间轴展示摄像头内的长视频数据,方便用户快速浏览管理。离开车内,跳转到橙色的 4G 模式,如有状况发生,即可收到对应视频通知。

3 WAYLENS Drive360

Drive 360 拥有 360° 全景摄像头,承载信息量远远大于传统的摄像机,带来浏览剪辑分享的设计新挑战。
为了让硬件功能得以发挥最大作用,设计出可以直觉左右滑动调整视角、子母画面的操作界面,让用户可以自在选择喜欢的观看角度。
我们并提出智能场景生成的功能,让系统组织出最佳故事与视角短片。
在细节的考量上,我们从过去的 HATCHI 的操作界面为基础,让跨产品也能保有公司一贯的交互语言。

彩色滑动条引导视角切换

多视角体验是产品的核心,对用户也是新的概念。为了降低学习成本,我们用色彩对应5 个视角,前视角为起点(黄色系),前加后视角在中间(红色做为区隔),后视角为终点(绿色系),弧形的滑动条搭配画面的转场,让切换视角自然顺畅。

Front View with PIP

Front View

Front with Back View

Back View

Back View with PIP

常用功能轻量化让操作更高效

手机 Liveview 板块可时时查看摄影机的同步画面,所看即所得。我们将 Liveview 最核心的录制、标记给予最大空间,录音与全屏开关、视角切换等辅助功能群组,用浮层来收纳较复杂的视角切换,让小屏上的多功能操作也可以简洁直观。

量身打造的智能视角体验

多角度所带来的大量信息,如何快速生成值得分享的内容成为我们设计的挑战。
我们提出智能视角的概念,由程序自动选择最佳视角。无需编辑即可生成有趣的内容。

即编辑,即分享

对于一些想要时时分享最新动态的用户,他们需要的不是精美的视频编辑,而是可以快速分享。 我们降低操作难度,导入、剪裁、分享,三步完成即刻分享。

CEO HaoWei Zhang 对在野评价:

 在野 触及了我们产品的所有方面,从信息架构到视觉设计。我们的用例非常复杂:基于 Linux 的相机应用软件、移动应用 (iOS/Android)、桌面管理工具 (PC/Mac) 和 Web。

在野 能提出探索性问题、专心倾听、提炼大量信息和一丝不苟地关注细节的能力给我留下了深刻的印象。 也因此,我们的产品得以极大简化操作流程,提升用户体验