2023 – 26 · qq music for car

车载音乐的
系统级体验升级

围绕快速开始、主动找歌、持续收听与场景推荐,重构首页、音乐馆、播放器、桌面卡片与跨端流转。

role独立负责 5+ 音乐业务线 0 → N 交互设计
collab15+ 人跨职能团队·产品 / 视觉 / 开发
status核心架构已上线/AI 推荐策略落地中
项目立意
01CONTEXT · 项目背景

车机 AI 承载底座(胶囊 / 卡片 / 小窗)已就绪,多媒体业务方向共识前的窗口期

02PROBLEM · 核心问题

同一套推荐能力进入真实用车场景后,触发时机、推荐目标和承接方式都会变复杂

03MY ROLE · 我的职责

同步做 4 层升级:内容、体验、推荐、沉浸主线压在推荐层:建立一套"何时出现、用哪种形态承接、出现后怎么收敛"的完整规则。

04STATUS · 项目状态

设计主导的前期推演,作为后续业务讨论的起点参考

MARKET OBSERVATION

我观察到的行业空白:
目前没有品牌把"主动判断时机""多媒体推荐"做在一起

01 内容竞争 在升级
02 体验竞争 在外溢
03 推荐竞争 在前移 本项目主线
04 沉浸竞争 在变深
03 / Stage Zoom

推荐这一层
正在从入口往前移

从"打开 App 找",到桌面场景卡片主动建议。但行业里走到这一步的品牌仍是少数——这正是本项目的主线

六品牌当前位置 ↓
NIO / 蔚来

NOMI DJ 读取偏好 + 出行场景生成歌单

XPENG / 小鹏

DMS 疲劳检测 → 推醒脑歌单

AITO / 问界

车控已有推荐框架,音乐未进入

LI AUTO / 理想

未进入推荐层

XIAOMI / 小米

未进入推荐层

TESLA / 特斯拉

未进入推荐层

CORE INSIGHT
场景感知 时机判断

行业已经能感知场景、也能推荐内容,但推荐仍是被动响应。本项目要补上的,是系统该在什么时机主动出现、以什么方式介入、被拒后怎么收。

概念已验证
MY FIRST DECISION

我做的第一个判断:
推荐的第一动作不是"推什么",是「该不该出现」

IN · 100% 所有上车场景 100% 01 SAFETY · 驾驶 02 INTENT · 意图 03 VALUE · 价值 04 FEEDBACK · 反馈 → ALL PASS 推荐才出现

每道闸独立否决。任一未过 → 沉默;
四道全过 → 推荐才值得出现

01

驾驶负荷过高,让出视听通道

高速连续变道 导航连续播报
本次静默
02

用户已表达意图,不覆盖

刚手动选了歌 主动按了暂停 蓝牙续播中
系统不覆盖
03

介入价值不足,不打断节奏

短途通勤 15 分钟到 副驾有人在聊天
不主动触发
04

已表达拒绝,学到不再问

本行程已被划掉 连续 3 次同场景被拒
降频或冷却
ALL PASS全过

推荐才值得出现

沉默是默认 出现是例外
少数时刻

我从用户旅程里挑出
几个值得 AI 出场 的时刻

00
CLUSTER · F · 基础机制
日常通勤 Daily Commute
「先给 AI 推荐划边界——已经形成的习惯不去打扰,推荐优先出现在习惯之外」——通勤是最稳定、最重复的场景,用它示范这套学习机制
形态
卡片 → 胶囊
信号
时段场景乘员组合
偏好
应用 · 内容形态
LIFECYCLE · Habit Learning Loop 习惯生命周期 · 看见 → 接管 → 协商
Day 7
LEARNING
学习期
看到稳定,
问一次

同一个人在不同情境下偏好可能完全不同——独处、孩子在场、朋友长途,各自一套。系统学的不是"用户喜欢什么",是"在这个情境下喜欢什么"。

"记为习惯"对用户是个承诺。给条退路:"播放 1 次"——观望两天再定。

车机 UI · 一次性出现
你最近常听谐星电台
工作日早晨独处 · 连续 5 天
Day 30
EXECUTING
执行期
解释一句,
悄悄退场

完全沉默会让用户困惑"为什么是这个"。胶囊露一下脸交代为什么,3 秒后退场——既给了交代,也不打扰。

仍保留在通知中心,用户随时可以改。

车机 UI · 极轻露出
谐星电台
基于 工作日早晨独处
3s 自动收起 → 通知中心可改
Day 60
RE-NEGOTIATE
变化协商
跟上变化,
主动问

同一情境下用户连续两周换了内容——不是没遇到老内容,是不爱听了

系统不装看不见,主动把旧习惯停下来问一声:要不要换。

车机 UI · 系统主动发起
你最近改听日谈公园了
工作日早晨独处 · 14 天没听谐星电台
03
CLUSTER · A · 成员变化
亲子同行 Parent-Child
「撑住孩子的车上时间,关键时刻提示父母」——内容给后排,操作给前排
形态
卡片 + 小窗 · 多屏分发
信号
乘员构成OMS 状态路况 / 时长

一台车有多块屏。
同一条推荐,推到哪块屏,决定它是给谁的。

推荐是否直达给孩子,要看孩子的年龄和独立选择能力。具备的话,就把内容路由到他面前的后排屏——孩子自己挑。

但孩子大了也未必能挑得动——内容池里有几十个选项,孩子可能一首也选不出。所以我们承担兜底:每张卡都备一个「随便播一个」按钮——选不出也能玩。

REAR · 后排屏
宝宝,想看点什么?
最近观看 / 海绵宝宝
点击卡面 推荐内容 3 项 随便播一个
FIG 1 · 后排屏 · 卡片 → 小窗 → 随便播一个

"父母手不能动,但脑子要拍板。"

另一面,孩子哭了、可能睡着了、可能要晕车了——这些不是孩子能决定的事。我们把这些卡片推到主驾,让父母拍板。

但即使是这种"父母拍板"的卡片,也有 3 个具体设计判断:拒绝替父母决策——状态读得再准,操作权始终在父母手里;拒绝事后补救——晕车 OMS 看不到,改用路况 + 时长综合预测;拒绝做选择题——一张卡只配一个按钮,父母不必在驾驶时挑选。

FRONT · 主驾屏
宝宝哭了,播点什么安抚一下?
切到「轻柔摇篮曲」
触发:OMS 检测哭声 30 秒以上
孩子像是睡着了,降低音量?
当前音量 60% → 30%
触发:OMS 检测呼吸 / 姿态趋稳
前方山路,开防晕车模式?
关闭画面 + 节奏稳定的音频
触发:路况蜿蜒 + 行程 > 1 小时
FIG 2 · 主驾屏 · 哭闹 / 睡着 / 晕车 · 各一张单按钮卡

最后还有一条贯穿性的判断——习惯记忆通用,一次确认,下次直接执行——这套机制 cm-moments 整章共享。

NEEDS · 诉求 ↔ 设计响应

每条诉求对应一个具体的设计动作——
从访谈/归纳,到屏上能看见的判断。

01
Education

教育启蒙

不浪费车上时间——按年龄段提供:0-3 磨耳朵、3-6 诗词科普、6-12 名著故事。

INFERENCE · 设计推断
基于多维感知模型「亲子互动」意图标签的延展
设计响应
DESIGN RESPONSE

后排屏按年龄段铺开内容池,让孩子能直接拿到「磨耳朵 / 诗词科普 / 名著故事」分类入口——不需要识字也不需要打字。

02
Comfort

安抚情绪

孩子上车降音量、换儿歌——音乐是父母手边唯一能调用的安抚工具。

QUOTE · 汤先生 · 二胎家庭
「孩子上车,降音量、切儿歌——还要降低音,孩子容易晕车。」汤先生 · 二胎家庭
设计响应
DESIGN RESPONSE

OMS 检测到哭声 30 秒以上,主驾弹安抚卡片——一句问、一个按钮,父母拍板即可切换。

03
Age Filter

年龄内容过滤

不同年龄段需要不同内容池——3 岁以下不识字,3 岁以上能听简单故事,6 岁以上才适合长叙事。

RESEARCHER · 多维感知模型 · 研究员归纳
研究员归纳:「接孩子时会主动切换到儿童故事。」多维感知模型 · 研究员归纳
设计响应
DESIGN RESPONSE

推荐前先过一遍年龄过滤——不识字的孩子不见到诗词,6 岁以下不见到长叙事内容,从内容池上做减法。

04
Eye-Care

保护视力 · 适当休息

余先生明确表示不想让孩子在车上看屏幕——优先音频、避免视觉陪伴。

QUOTE · 余先生 · 访谈原话
「不想让他看手机或者 iPad。」余先生 · 访谈原话
设计响应
DESIGN RESPONSE

亲子模式下,主推音频不推视频;后排屏只在父母明确开启时显示视频卡片——默认状态是无屏幕陪伴。

02
CLUSTER · A · 成员变化
多人同行 Group Ride
「组织共同氛围,群体状态」——有共同体验感、社交感、不冒犯
形态
卡片 → 胶囊 · 按行为记忆
信号
乘员构成行程类型
01
HERO
Solo → Group
单人 → 多人
副驾 / 后排有人上车 → 立即推一个推荐歌单
  • 01
    拒绝让群体压制个人 · 主驾自己收藏 ∩ 公共性强;不够时 AI 补结构相近、更熟悉的
  • 02
    语音多模态 · 让偏好比例的调节更轻量
    多放点我喜欢的 / 新歌多一些 / 推荐度高一些
  • 03
    拒绝做选择题 · 默认推一张
大家都在,一起听「港乐金曲」
QQ 音乐 · 25 首
忽略
大家都在,一起听「港乐金曲」
02
EVENT
Group → Solo
多人 → 单人
乘客下车 → 卡片切回主驾自己常听的
  • 01
    承担时段记忆 · 推主驾在该时段最常听的歌单
  • 02
    承担降低决策成本 · 一次「记为习惯」→ 下次同情境直接静默播放
一个人了,切回「我的收藏」
QQ 音乐
记为习惯
一个人了,切回「我的收藏」
03
EVENT
Passenger Reshape
乘员构成变化
老人 / 小孩等特殊乘员加入时,重新筛对所有人都温和的内容
  • 01
    拒绝过度敏感 · OMS 识别老人 / 小孩等特殊乘员才触发
  • 02
    承担克制 · 纯人数变化(2 → 3 人)不触发,内容可以保持
  • 03
    承担把沉默当反馈 · 忽略 → 下次同类变化降级为胶囊
大家都在,来点「经典老歌」
QQ 音乐 · 32 首
忽略
大家都在,来点「经典老歌」
NEEDS 从用户访谈归纳的内容诉求
  • 01 倾向熟悉内容 大众金曲、合唱友好(一起哼);共同话题播客、热点时事(聊天素材)
  • 02 情绪克制 避免过度激昂、过度悲伤、过度小众情绪
  • 03 语种收敛 向「车上每个人都听得懂」的语种收敛
  • 04 地域适配 多人在场时,内容的地域适配性可能成为信号
01
CLUSTER · B · 打发时间 / 调节情绪
长途巡航 Long-haul Cruise
「抗疲劳,降单调,持续陪伴」——预判式入口 · 全程并行修正 · DMS 兜底
形态
卡片 · 默认形态
信号
行程类型预计时长出发时段实时状态
长途案例 · 6h 时间轴上的介入节奏

首次介入定在首次疲劳窗口前——更早会打扰用户「硬撑」心态,更晚就从预判滑向补救。两次介入 + DMS 兜底是 6h 行程里的固定节奏。

清醒 疲愈 用户状态 2h 4h 6h 首次介入 再次介入 系统静默 DMS 接管 用户自选音乐 · 未做疲劳干预 中档维持 高档维持 疲劳持续累积 上车启程 短行程到此结束 常规长途到此结束
PRE · 01 出发时段

凌晨 / 午后低谷 → 密度 +1,相乘关系

PRE · 02 作息基线

夜间常态 / 作息差 → 整体前移

RT · 03 方向盘握力

高 → 警觉 下调介入

RT · 04 切歌频率

频繁 → 调整内容

RT · 05 车内对话活跃度

活跃 → 降低密度

1预先计算疲劳曲线
2主动卡片推荐
3忽略 → 降级胶囊
4点击卡面 → 进入小窗
DEFAULT · 默认形态 P 档 · 长途识别后主动弹出
卡片
出发前根据去程 / 返程上下文,主动推荐对应歌单——用户最常见的入口。
去程
公路旅行歌单
出发心情 · 轻快节奏
返程
返程了,来点有劲的
提振节奏 · 对抗后半程困意
FALLBACK · 降级 ← 卡片被忽略后
胶囊
卡片不操作 → 自动收为胶囊,无播放,等待用户主动唤起。降级而非常驻。
屏幕角落 · 待唤起
长途防疲劳歌单
点击展开
EXPANDED · 展开 ← 点击卡面(非按钮)
小窗
点击卡片卡面 → 展开小窗,呈现完整歌单与说明。直接播放从立即播放按钮走。
接下来的两小时长途,交给我吧。给你编排了一路的高能歌单——刚好扛住后半程的困意。
23 首 · 匹配 2H 立即播放
USER VOICES 用户访谈原话 · 4 类诉求
01
去程 · 共鸣放大
「路上风景好,放公路感音乐。」
—— 王先生

音乐被用来放大正向情绪,不是调节它。

02最强证据
返程 · 律动驱动
「返程放提神的,不能放轻柔的,很容易犯困,放比较兴奋律动的。」
—— 刘女士

用户原话把内容形态写死——返程必须节奏驱动。

03
媒体代劳
「长途只能专注开车,没办法选专辑,只能切歌。」
—— 汤先生

系统该出发前就接管,不是中段给选项。

04
中段不打扰
「开车比较保守,不想操作车机。」
—— 王先生

介入只在锚点出现,过程零干预

04
CLUSTER · B · 取舍清单
更多场景 More Scenarios
「想到过的所有方向 · 本轮的取舍」——3 类决定不做(带理由)+ 9 项可做但不展开(按情绪 / 行为 / 限制 分类)
范围
本轮的取舍
DELIBERATELY SKIPPED 想过、推演过、主动放弃的三类
情绪 不可控
Emotion压力大 · 开心 · 悲伤

不是所有车都能监测,且情绪切换太快——上一秒开心下一秒悲伤——不可控

氛围 太常见
Ambience日落 · 下雨 · 下雪

18:30 + 环海路 + 暖色光 → 推日落 BGM——触发条件太常见,没有差异化。

低频 · 非刚需
Concert演唱会预热

出发去演唱会路上 → 预热艺人歌单——不高频、非刚需;加上没有票务 / 行程数据源,做不了。

KEEP 可做、本轮不展开 · 按 情绪 / 行为 / 限制 分组
情绪 04 Emotion
充电留车 · 空闲无聊
堵车 · 煎熬无聊
连续晚归 · 身心疲惫
节日 / 假期前 · 音乐营造氛围
行为 03 Behavior
连续单曲循环 N 次 · 可能想听类似的
连续频繁切歌 N 次 · 可能对当前歌单不满意
人声哼唱 · 你可能想唱 K
限制 02 Constraint
偏远无网 · 在线音乐断断续续
USB 缺歌词封面 · 在线匹配前置
INDUSTRY SIGNALS

我注意到的行业信号:除了推荐,
行业的发力点已经在结构、系统、氛围三层展开

四阶段演进
01
内容竞争 · 在升级
从引入三方 App,到自研内容、空间音频、Hi-Res
NIO Radio · 问界空间音频 · 小鹏杜比全景声
02
体验竞争 · 在外溢
从播放器,到桌面卡片、小窗、多屏分发
理想电屏 · 蔚来 NIO Link · 问界碰一碰流转
03
推荐竞争 · 在前移 ★ 本项目主线
从"打开 App 找",到桌面场景卡片主动建议
问界小艺建议 · 蔚来 NOMI 主动建议
04
沉浸竞争 · 在变深
氛围灯、座椅振动、香氛、AI 音效参与表达
小鹏 Xopera 5D · 蔚来 AI 全景声 · 小米天际屏
六个核心品牌
NIO / 蔚来
自研内容深度整合
陪伴式语音人格
NIO Radio、沉浸声与 NOMI 共同组成强差异化资产。多媒体不止是功能,更是带有情绪反馈的陪伴。
NIO Radio 沉浸声全景 NOMI 情感化
LI AUTO / 理想
家庭空间中枢
全局框架极致统一
优势不在纯粹数量,而在三方应用深定制、多屏同播与统一模板,从一个应用切到另一个应用,几乎不需要重新学习。
家庭娱乐中枢 大师级定制 多屏跨播协同
XPENG / 小鹏
硬件势能放大
AI 音效能力前探
5D 座舱:屏幕、座椅、灯光、香氛与声场协同工作,AI 音效持续把"预设参数"往"动态生成"推进。
5D 沉浸座舱 AI 音效算法 Xopera 音乐厅
XIAOMI / 小米
多层生态流转
天际屏舞台化承接
内容可在 1/3、2/3、全屏与桌面固定之间持续流转。歌词被推上天际屏后,多媒体开始从主屏使用走向系统层停留。
跨界无缝流转 天际屏视觉 手车生态融合
TESLA / 特斯拉
原生流媒体布局
极简与克制主义
Apple Music 等能力作为原生入口被直接整合。它的强项是路径纯粹、层级清楚,以及足够顺手。
原生媒体流 剧场与 Caraoke 极简操作层
AITO / 问界
场景歌单预置
华为声学硬核底座
HiMix 把推荐从内容分发推进到场景服务。HUAWEI SOUND 与独立音区一起,把"听感"继续推向可编排的表现层。
HiMix 场景库 华为声学体系 小艺主动推荐
MY THREE LAYERS

接下来的设计,我从同样的
三个层面发力

从结构、体验到氛围——让界面、入口与整舱感知,一起成立。

LAYER 01
结构层
首页、音乐馆、播放器重新分工
每个页面只负责一件事
LAYER 02
体验层
跳出应用,让音乐跨越系统场景
桌面、其他应用都能一起选歌与播控
LAYER 03
氛围层
从听歌延伸到整舱沉浸感知
音响、氛围灯、座椅、HUD 联动
STRUCTURE / 01

我发现一个矛盾:推荐越精准,首页越拥挤

车里的音乐需求归结为两件事——随遇而安的推荐消费、和按心情/语种/风格/播客主动找内容

15×推荐 vs 主动分类点击率
5/12用户对推荐不满、仍以推荐为主入口
8.4×最高与最低点击率差距
USER TYPE 01
推荐依赖
随遇而安型
上车不主动选,依赖系统今天给什么听什么
推荐类入口 / 首页主导位置
每日30首
11.64%
个性电台
9.40%
收藏歌单
8.40%
"自己开车音乐随机推荐
"推荐质量不佳,收藏成型后不再使用推荐
USER TYPE 02
主动找歌
目标明确型
有明确诉求(心情/语种/风格/播客),但车机里找不到对应入口
主动分类入口 / 被推荐模块挤压至边缘
歌单/电台
1.53%
歌单分类
0.84%
歌手
0.45%
"没有按风格搜索音乐的语音功能,「播放一些开心的音乐」无法完成
"早晚高峰喜欢听长播客,小宇宙没有手机方便
矛盾所在

推荐模块扩张占据首页内容维度入口被挤压至 1% 以下心情/语种/风格/播客等需求在首页无处承接

∴ 所以

两类用户需要各自的空间,而不是共享同一个首页。

STRUCTURE / 02

我的设计决定:让每个页面只做一件事

基于两类用户的差异,我重新定义了三个页面各自的职责。任务清晰之后,结构就不该继续重叠——每个入口只负责一种状态。

QUICK RESUME
首页
优先把用户带回上次的内容
减少上车后第一次选择的成本
推荐流主导
个性化推荐占据主要位置,内容越来越懂你
断点续播优先
上车直接回到上次播放的状态,不需要重新找
自建歌单前置
收藏和常听内容固定在前排,不被推荐流刷掉
服务用户 随遇而安型
QUICK FIND
音乐馆
集中承接所有主动找内容的需求
不和推荐流争首页的位置
内容维度完整
心情 / 语种 / 风格 / 年代 / 流派,每个维度都有专属入口
播客 / 电台接入
补全车机缺失的长音频品类,对应通勤场景的高频需求
搜索直达
目标明确时路径最短,不需要从推荐流里找
服务用户 目标明确型
AMBIENT DISPLAY
播放器
播放期间的视觉空间
让你不需要操作时,屏幕依然值得一看
多音源表现层统一
蓝牙、USB、车机内容切换时,用户感知不到界面的跳变
主题与歌词海报
让播放状态的屏幕有视觉质感,而不是功能堆叠的控制面板
低频操作收纳
播放时屏幕更干净,只留真正需要触达的控制
服务用户 随遇而安型 目标明确型

用户在什么状态、需要什么,就进哪个页面——每个入口只做一件事,不抢彼此的位置。

STRUCTURE × AMBIENT

我重定义了播放器的角色:
不只是控制面板,它要负责把这次听歌顺下去

我重构的不是一个更少功能的播放页 而是一个把操作、模式切换与主题承载重新组织的播放中枢
播放器模式切换 · 三层堆叠
明确边界 / 减少割裂 信息层级重组 · 让播放期的屏幕回到 Ambient 状态
播放中的不同内容形态,不再为列抢注意力,而是被组织成更自然的切换关系。
01
三屏滑动切换
R 歌词 / C 封面 / L 播放列表,三种模式横向随手滑动,互不打扰,也不再在主画面里彼此争抢位置。
L · 播放列表 C · 封面主屏 R · 歌词
02
收起低频操作
高频播控留在主屏可盲操;分享、定时、音效等低频项统一收纳到二级面板,避免播放中的视觉噪音。
主屏只留高频 低频入二级 盲操更顺
为什么选择「播放器皮肤」承载主题 先兼容,再增强
默认播放器
AI 播放器
星陨播放器
沉浸空间
主题作为播放器上层独立空间存在,退出后再进还是回到播放页,形态不稳定
播放器上层 路径深
动态歌词模式
歌词的沉浸态,业务有主题皮肤的诉求,两种概念独立又复杂
歌词模式的第二种形态 多功能兼容性差
播放器皮肤
Selected
动态歌词即是一个播放器主题,用户可自由选择,无多个入口
形态稳定 兼容多音源 扩展性强
无歌词场景下的兼容策略 车内除了在线音乐,还有大量 USB 与蓝牙音乐,这些内容往往没有歌词。可引导开启在线歌词,补足沉浸体验。
建立中枢 / 外延基础
同一播放状态,可以有不同前台表达
播放器、桌面歌词、卡片、小窗等入口都围绕同一状态做不同层级的呈现。
桌面歌词
桌面卡片
音乐小窗
手车流转
EXPERIENCE / 01

我看到的盲点:音乐并不总在车里开始,
进入座舱的这一步也需要被设计

音乐不是都从车机里开始。用户可能已经在手机上听着歌走向车辆,但手机能听,不代表车机能直接接。 手车两侧的账号状态、进入条件和提示时机不同,流转设计要解决的不是 "同步到了没有",而是这次内容能不能顺利被车里承接。

手机 → 车机流转
手机听歌走向车辆
车机接住音乐
CROSS-DEVICE SYNC · 已上线
账号状态不同,
流转流程也要分开设计
01
询问手车账号登录状态 判断车机与手机两侧的登录情况,决定后续分支走向
02
走近车辆,正在手机听音乐 获取手机正在播放的音乐信息,为上车承接做准备
03
音乐流转上车 按账号状态走对应的承接与登录引导
手机已登录 · 车机已登录
手机已登录 · 车机已登录 · Infinite Fantasy
手机未登录 · 车机未登录
手车均未登录 · 扫码登录后收听
手机已登录 · 车机未登录
手机已登录 车机未登录 · 一键登录 QQ 音乐收听
ENTRY POINT PERCEPTION
流转信息需要在
适当的时候出现
起初业务要求在无音乐流转时,用户一上车主动弹窗提示登录。我将这个节点从 "上车即弹" 后置到 "操作发生时再出现",减少抢先入打断。
01
走近车辆,未在手机收听音乐 获取手车账号登录状态、手机正在播放的音乐信息
02
用户播放触发登录 使用手机流转时的账号信息更快捷;提供其他通道,扫码或流转快捷登录其他账号
一键登录 QQ 音乐 · Ice Bear
建立中枢 / 外延基础
不同流转来源与流转内容,
落到同一套承接方式
来源不同,但用户的感受应该一致。统一的卡片结构、状态反馈与操作流程,让不同流转路径落到同一套理解方式里。
微信长按
音乐卡片发送
手机 Link
自动流转
多任务三指上滑
手动流转
多任务长按应用
手动流转
EXPERIENCE / 02

我让桌面先接住音乐,再让用户决定
要不要进入 App

卡片不是 App 的入口,而是 App 的前台。

车机场景下进入 App 的操作成本远高于手机。我让桌面先把音乐接住——登录、选歌、推荐、记忆全部在卡片层完成;只有当用户真的想探索更多时,才让他们主动跨入 App。

ITERATION CONTEXT · 改版背景

从"两个按钮的小卡片"
可展开的大卡片

1.0 版本的桌面卡片容量不够——只能塞进两个固定按钮,能承载的内容太少,大量推荐和状态只能等用户进入 App 才看得到。

我提出了「点击展开」的交互:桌面上保留一块小卡片作为常驻入口,需要更多内容时一键展开为大卡,承接推荐、歌单、历史、个人资产等多维内容。

1.0 原卡片 · BEFORE
原卡片:左边每日推荐,右边收藏,两个固定按钮
播放每日推荐 播放收藏
2.0 新卡片 · AFTER
新卡片:QQ 音乐 + 推荐内容 + 展开按钮,可点击展开为大卡
播放收藏 展开卡片
EXPANDED STATE · 展开态

点击"更多"后,
大卡直接在桌面承接 多维度内容

实机展示 / In-car view
车机桌面上 QQ 音乐卡片展开后的真实显示效果
已登录 · 内容承接
登录后不跳转 App,收藏歌单、每日推荐、猜你喜欢、最近播放 4 种内容维度直接在桌面呈现
已登录状态:4 种内容维度展示
未登录 · 引导态
未登录时不留空白,展示扫码登录引导,登录后按账号区分内容
未登录状态:扫码登录引导
上下电
自动恢复
每次熄火再启动,卡片记住上次停留的 Tab,无需重复选择
点击"更多"展开 10s 自动收起 或点击卡片外区域收起
THREE SHIFTS · 三个核心价值

三个"更":
用一张卡片替代一次 App 访问

我做的改版不是"加了什么功能",而是把 App 的三件核心事——看到、选到、用到——全部前置到桌面。

更直观 01
优化收藏歌单样式,把播放状态外化到卡片表面——不用进 App,也知道自己在听什么。
更丰富 02
首创"点击展开大卡"的形式,可在不跳转的前提下展示更多推荐内容供用户选择。
更灵活 03
无需进入应用,即可完成登录与选歌;点击卡片外区域即可收起,回到桌面原状态。
MAP · 项目地图

在线音乐只是更大多媒体系统的一环

同一套方法,我也用在了其他媒体业务上。

PROJECT SUMMATION

这个项目里,我重构的是
音乐在座舱里的
成立方式

01 · AI 推荐
该不该出现
推荐的第一动作不是"推什么",是"该不该出现"
把"推荐"拆成可被开发的判断规则。
02 · 结构层
页面只做一件事
每个页面只做一件事
从用户差异里,直接推导出页面分工。
03 · 结构 × 氛围
把听歌顺下去
播放器要把这次听歌顺下去
从控制面板变成统一多音源、联动整舱氛围的载体。
04 · 体验层
跨越系统场景
跳出应用,让音乐跨越系统场景
把音乐 App 放回到桌面和系统的语境里。

把交互从"画界面"推到"建立关系"——人和系统之间的关系。