top of page
AITO Banner_0131.png
背景 & 职责

一、开篇

项目背景

市场

新能源汽车品牌蓬勃发展

​车机的智能互联成为购买决定因素

​用车的高价值场景成为卖点

华为

”构建万物互联的智能世界“

Harmony OS 支持

1+8+N 多设备成熟体系

我的角色

主要负责

信息架构

高价值用户场景挖掘
数个场景交互细节及优化

交互规范输出

密切参与

与人因/视觉/动效/开发团队密切合作
10+次设计评审和方案汇报

注:因涉及资源保密,视觉、动效均未使用项目资源,均为交互示意

产品定位

​二、产品定位与竞争力规划

1. 关键词
未来1.png
智能1.png
商务1.png
2. 竞品分析总结

扁平化设计

以驾驶体验为中心

竞品分析2.png

以智能体验为中心

拟物化设计

传统车厂

Pros

品牌形象深入人心

口碑好

用户群体大

Cons

HMI智能化水平较低

创新限制大

新势力车厂

Pros

HMI智能化设计

多端互联能力

​创新场景构建品牌

Cons

受众类型受限

​缺少品牌特征,易同质化

3. 用户研究 | 我们想要卖怎样的产品给哪些人群?

用户旅程&痛点

市场趋势&竞品数据-1.jpg
市场趋势&竞品数据-2.jpg
市场趋势&竞品数据-3.jpg
人群研究-1.jpg
人群研究-2.jpg
人群研究-3.jpg
用户旅程痛点&高价值场景-2.jpg
用户旅程痛点&高价值场景-3.jpg
用户旅程痛点&高价值场景-1.jpg
购车关注点-2.jpg
购车关注点-1.jpg
购车关注点-3.jpg

购车关注点

市场调研&竞品数据

人群研究

4. 人因研究 | 车机的人体工学与交互范式是怎样影响我们的设计的?
设计目标&原则

多模态

AI + VUI

驾驶场景感知

HMI

驾驶场景感知-3.jpg
驾驶场景感知-2.jpg
驾驶场景感知-1.jpg
多模态-3.jpg
HMI-3.jpg
多模态-1.jpg
HMI-2.jpg
HMI-1.jpg
AI+VUI-3.jpg
AI+VUI-2.jpg
AI+VUI-1.jpg
多模态-2.jpg
5. ID硬件规格
硬件1.png

硬件

屏幕配置:中控屏;仪表屏
车载多屏:无。无副驾屏、后排屏
中控屏长宽比:16:9
中控屏物理尺寸:

设计影响

信息:仪表信息和中控信息密度及展现形式

优势场景:左右分屏,观影娱乐,全屏氛围感

​多设备:手机、平板、家居互联

三、详细设计

设计目标

具有品牌识别性

首眼架构区别于竞品
重点功能有品牌特色

强调智能座舱体验

智能车控
AI推荐
个性化设置与记忆

​与手机、平板及家居互联

NFC快速投屏

One Super Device设备互联

设计原则

易于驾驶时进行交互

避开方向盘盲区
高频按钮邻近驾驶员
各组件热区较大,距离较远(基于人因研究)

多维度关注驾驶安全

交互层级较浅
降低界面信息密度
加强语音交互功能

符合车载屏幕使用习惯

重点关注高频场景:导航、空调、音乐等
突出现有驻车场景:小憩、视频等
简化社交与个人信息:新消息、个人档案

架构对比
1. 架构方案对比

1.1 架构一:侧边栏,卡片多级展开,地图为底

Pros

左边栏易于驾驶员触达
以高频使用的地图为底,使层级最浅
卡片多级展开,适应不同屏幕分区

Cons

方向盘对左边栏部分区域有遮挡
地图为底缺乏美观和品牌调性

1.2 架构二:卡片内容直达,AI推荐

frame white 1.png

Pros

大卡片主推内容露出
个性化定义桌面自由度更大

Cons

车机系统三方生态保障不足
卡片布局相对缺乏新意

1.3 架构三:底部可滑动小卡片,壁纸为底(选中方案)

frame white 1.png
frame white 1.png

Pros

架构布局新颖,识别性强
壁纸和睡眠时钟强调华为品牌特征
交互逻辑简洁

Cons

桌面信息利用率较低
底部右侧卡片距离驾驶员较远

层级详解
层级+标注1.png
2. 层级详解
典型界面及交互
桌面
3. 典型界面及交互

3.1 主屏幕

a. 功能分区

Home 注释 0531.png

b. 主屏关键入口

frame 3.png
悬浮卡片

3.2 悬浮卡片

FA cards 注释.png
FA cards 注释.png

a. 自定义悬浮卡片

frame 3.png

b. 观影交互逻辑

frame 3.png
快捷车控

3.3 快捷车控

menu bar 注释.png
frame 3.png
智慧助手

3.4 智慧助手

a. 小艺推荐:根据时间段、用户习惯、个人数据进行推荐,提供快捷入口

frame white 1.png

b. 小艺控车:连续对话,无需触控

frame 3.png
分屏导航

3.5 分屏导航

frame 3.png
多设备互联
4. 多设备互联

4.1 手表控车

frame white 1.png
手表作品集1.png

4.2 车家互联

homepage-s2-1.webp
Control center_new.png
frame 3.png
5. 设计验证

任务完成度

竞争优势

各模块体验评分

各功能及竞品对比

各功能及竞品对比-2.jpg
任务完成度-3.jpg
任务完成度-2.jpg
竞争优势-3.jpg
竞争优势-2.jpg
各模块体验评分-3.jpg
任务完成度-1.jpg
竞争优势-1.jpg
各功能及竞品对比-1.jpg
各模块体验评分-2.jpg
各功能及竞品对比-3.jpg
各模块体验评分-1.jpg
bottom of page