产品需求
用户痛点
交互设计
简要流程
效果
百度音乐安卓端 5.6.0.版本
场景电台项目
产品
产品简介 项目需求
产品简介
需求描述
DAU 200W+ 周留存50%+
登录用户40%
+
市场占有Top5
用户集中使用在本地音乐 使用模块功能集中在本地、在线、
以前做过什么
在不同场景下，满足用户的听到
版权限制，主流版权被买断
自己喜欢音乐的需求
用户点播听歌的流程会被影响
痛点1
如何满足用户在当前场景的场景音乐推荐？
描述 痛点1 用户打开百度音乐，在任何时间和场景下，都能选择到自己符合当下情景的电台；场景改变，切换亦容易切换、改变
解决方案 - 首页推荐
15分钟
11:56
A B C 活动
满足在15分钟内，从服务器请 求一次，刷新适合次15分钟内 的场景列表
比如在路上/咖啡时光
场景电台
A D
B E
D
运营>活动
优先展现了运营类的场景，比如情人节
E
情绪>活动
优先展现情绪类的场景，比如快乐，痛苦，
C
2分钟 2分钟以内，渐隐渐现的效果， 刷新首页的6个场景，触发时机 在离开并回到首页时
因为此类场景的命中率相对较低
F F
个人喜好
6/20
比如用户常听场景-北京，80后，则推荐类似场景在此部分
K
适应每次从服务器请求20个场 景，保证20个场景可以满足如 上的不同类型
解决方案 选择场景 11:56
11:56
11:56
场景电台
民谣
K
首页推送的要求详见痛点第一页
场景按大类分别排列，可以横滑切换浏览内容，也可以
横滑大类；此页面暂为临时页，不与点播页形成关系
用户可以直接从播放页 调回到场景选择页
痛点2
用户如何在场景中使用个性化？
描述 痛点2
通常意义上，夜晚推送给用户的场景是夜晚/吉他/钢琴或者等等相对柔和的场景；而用户的需求集中在只适合夜晚的摇篮曲，或者只适合夜晚的民谣；
解决方案 增加二级场景分类，可以叠加选择，如在路上+华语
方案一
方案二
方案三
11:56
11:56
在路上
在路上
五道口 王庄路
全部
11:56
华语音乐，陪你回家
中国移动
在路上
五道口 王庄路
89%
11:56
在路上 五道 口 王庄 路
五道口 王庄路
去上课
CD
CD
专辑封面
民谣
民谣
民谣
CD 民谣
Mary you Bruno Mars
Mary you Bruno Mars
Mary you 3:20
Bruno Mars
3:20
全部 词
Mary you Bruno Mars
词
去上课
词
3:20
3:20
全部
赴约
去上课
好想快点到呀！
词
华语音乐，陪你回家
结论
方案一
贴合了当下场景的选择，横滑的手势易操作，易懂；
二级文案的长度，二级场景的个数的可拓展性，局限性很大；
方案二
保证了整个播放页的播放体验，对核心操作展现清晰；
二级隐藏有认知风险；
方案三
二级分类可拓展性强，操作横滑简单易懂；
页面局促；相比1 2 更适合。
痛点3
普通播放页的操作不满足不同场景电台的听歌体验
描述 痛点3 场景电台，用户以伴随的状态，收听流媒体，不关注播放列表，用户对歌曲的操作变得轻量级 解决方案 – YY方案 - 语音输入
播放中
收藏 - 上滑
垃圾桶 - 下滑
11:56
切歌 – 左/右滑
11:56
11:56
11:56
在路上
在路上
五道口 王庄路
五道口 王庄路
CD CD
CD
民谣
民谣
民谣
CD Mary you Bruno Mars
Mary you Bruno Mars
民谣 3:20
Bruno Mars
3:20
Mary you Bruno Mars
3:20
全部
全部
去上课
去上课
方案手势
世界末
Mary you
保留横滑切歌的手势
3:20
周杰
设计
交互设计
首页、场景选择页
去往：
点击
首页
场景播放页
场景选择页 点击
11:56
我的
发现
K歌台
活动
情绪
语言
曲风
年代
主题 功能
1. 在tab区域左右滑动可以浏览tab选项，点击选中并切换tab
场景电台 为您 推荐
页面。（类似网易新闻的频道tab）
工作 心思 去旅行
工作
电台分类Tab
心思 去旅行
在路 上
在路 上
2. tab的选中态的位置不固定，随tab选项的位置移动。 3. 在tab下方的列表区域左右滑动也可切换tab。滑动切换后， 当前选中的tab选项若不在画面内，需自动移动到可视范围内。
更多
开车
摇滚
点击
工作
K 30首
公交 车上
有氧 运动
开车
地铁 你好
瑜珈
陷在 椅子里
12首
本地 音乐
下载 管理
我的K歌
**需支持根据服务端指令重排tab顺序和增删tab。
电台列表加载中
加载错误\无网络
无缓存时出现
无缓存时出现 11:56
我收藏的歌单
Cover
闺蜜 小聚
逛街
家庭 聚会
活动
情绪
语言
曲风
年代
主
11:56
活动
情绪
语言
曲风
年代
主
世界末日 周杰伦 02:00/03:36
电台列表 1. 电台列表由两部分组成：预置电台+网络配置电台 2. tab下有预置电台默认展示，在线电台获取成功后一次性显示出来。
正在为您准备电台...
（需有淡入效果）
网络好像有点问题 重新加载
3. 如果tab下有缓存电台列表，也不显示加载状态或错误提示， 待列表更新完成后再替换缓存列表。
展示规则： 无网络状态下，应该是只显示预置和有本 地音乐的电台和分类； 若一个分类下没有可显示的电台，则此分 类也不展示；
仅wifi联网处理情况 加载错误 并已开启仅wifi联网，则显示仅 wifi联网的页面
设计
交互设计
播放页细节交互_二级分类 进入场景，加载场景数据 11:56
中国移动
11:56
在路上
场景名
收起分类方式
Mary you
专辑封面
专辑封面
专辑封面
民谣
民谣
正在为您准备分类...
全部
1. 在二级分类区域上滑 2. 点击箭头按钮
去上班 回家
进入场景后默认播放全部分类。切换分类后， 当前正在播放的分类替换显示在第一个位置。
场景歌曲和分类分开加载； 分类有加载状态 （加载刷新只在切换进入场景时进行）
去上课 回家
去上课
回家
赴约
走在空旷的街道上
好想快点到呀！
想象正要去郊游
回家
1. 在最小高度和最大高度区间内，依据分类个数自适应高度。 2. 在分类个数无法占满最小高度时，下方空白区域可随机显示一些文案内容。 3. 当分类个数超出菜单最大高度时，可在菜单区域内进行滑动。
网络加载失败-场景
点击 切换分类
播放页_拉取歌曲列表
播放页_无二级分类
播放页_拉取歌曲 失败
11:56
11:56
11:56
父亲节
场景名
中国移动
89%
11:56
在路上
在路上
祝全 天下的 父亲健 康快乐^_^
五道 口 王庄 路
专辑封面
专辑封面
网络好像有点问题
民谣
民谣
正在为您挑歌...
重新加载
Mary you 3:20
Bruno Mars
Mary you Bruno Mars
3:20
词
全部
去上班 词
去上课
回家
此分类暂无歌曲，请尝试其他分类吧
词
场景歌曲未加载出，全不显示，如上； 分类未加载出，单独显示；
无二级分类时，页面需有布局调整。
去上班
全部
赴约
走在空旷的街道上
去上课
回家
好想快点到呀！
想象正要去郊游
点击分类后开始拉取此分类下的歌曲。 界面布局不变，在卡片上显示加载动画和文案。
3:20
想象正要去郊游 词
重新进入此场景后，改分类不再显示
去上课
回家
赴约
走在空旷的街道上
好想快点到呀！
想象正要去郊游
,果断干掉它~
二级分类浮层展开后有最小高度（例如能显示8个分类）和最大高度限制（例如显示14个分类）。
否
走在空旷的街道上
好想快点到呀！
二级分类列表展开
点击 切换分类
赴约 Mary you
词
遇到不喜欢的歌曲点
去上课
回家
Bruno Mars
去上班
词
展开分类方式
去上课
3:20
Bruno Mars
去上班
民谣去上班
全部
Mary you
词
全部
在路上 五道 口 王庄 路
3:20
89%
11:56
在路上
Bruno Mars
全部 词
中国移动
五道 口 王庄 路
Mary you
3:20
Bruno Mars
89%
11:56
五道 口 王庄 路
1. 点击蒙层区域 2. 在列表区域下拉 3. 点击任意分类 4. 点击箭头按钮
正在为您挑歌...
中国移动
在路上
专辑封面 民谣
89%
11:56
场景名下方可显示 场景相关信息，例 如地理位置等
五道口 王庄路
此场景 是否有二级分类
播放页_二级分类展开最大高度
播放页_二级分类展开最小高度
播放页_有二级分类
设计
交互设计
设计
交互设计
场景播放页_切歌、歌词、更多操作
点击专辑封面或右上角按钮
播放页_有二级分类 中国移动
播放页_歌词 89%
11:56
播放页_更多操作
中国移动
89%
11:56
在路上
中国移动
89%
11:56
中国移动
89%
11:56
在路上
在路上
点击场景标题处
播放页_无二级分类（二级分类加载失败）
父亲节 祝全 天下的 父亲健 康快乐^_^
去往：
场景选择页
let the choir bell sing like ooh ooh ooh so what you wanna do ooh ooh
专辑封面
if we wake up and you
民谣
点击播放\暂停按钮
上一首\下一首
Mary you
1. 右滑\左滑卡片
3:20
民谣
that's cool ooh ooh so what you wanna do
分享 歌曲
ooh ooh
去上班
去上课
回家
查看 专辑
3:20
Bruno Mars
ooh ooh
Mary you 词
点击
Mary you 全部
查看 歌手
Mary you
no i won't blame you
2. 点击卡片左右两侧 词
专辑封面
民谣
want to break up
播放\暂停
Bruno Mars
专辑封面
lets just run girl
Bruno Mars
3:20
图
去上班
Bruno Mars
3:20
词
去上课
回家
显示歌词 点击歌词按钮，隐藏专辑图、卡片区域变大并显示歌词。 歌词区域可上下滑动。
关闭歌词 点击歌词区域或者点击“图”按钮，返回到专辑图模式。
点击
设计 设计
交互设计
非wifi下网络各页面变化
点击
首页 播放页_提示条缩小为入口
播放页_有本地歌曲
优先推荐有本地歌曲的场景，下方显示本地歌曲数
我的
发现
五道 口 王庄 路
场景电台 为您 推荐
现在是运营商网络
心思 去旅行
5首本地
5首本地
5首本地
点击 更多
开车
工作
9首本地
10首本地
2首本地
本地播放
本地\在线切换提示条 提示条进入每个场景时都会先展示出 来，过几秒后缩小成小入口
此场景 是否有本地歌曲
Mary you
Mary you 二级分类状态变化 1. 本地播放时: 二级分类仍可点击， 点击后，弹出消耗流量弹出框（当前 app耗流量测率相同） 同时，弹出条的本地播放选中态，切 换到在线播放显示；
词
我的K歌
世界末日
点击
周杰伦 02:00/03:36
点击
场景选择页
情绪
语言
心思 去旅行
工作 5首本地
去上班
去上课
回家
3首本地
曲风
年代
11:56
否
在路上
主
在路 上 8首本地
公交 车上
开车
地铁 你好
5首本地
3首本地
8首本地
以下场景没有本地歌曲，建议联网后再播放
场景选择页 1. 有本地歌曲的场景显示在页面上 方，显示场景内本地歌曲数。 2. 无本地歌曲的场景用文案区隔，不 显示本的歌曲数。
本场景暂时没有本地歌曲 连网后可以为您推荐在线歌曲
试试其他场景 有氧 运动
2. 在线播放时： 二级分类是正常可用的状态，与Wifi 下相同。
播放页_无本地歌曲/无网络下网络配置电台（无歌曲） 11:56
活动
全部
瑜珈
陷在 椅子里
听在线歌曲
3:20
Bruno Mars
3:20
Bruno Mars
我收藏的歌单
Cover
民谣
是
12首
下载 管理
专辑封面
民谣
K 本地 音乐
本地
几秒后
在线播放
专辑封面
在路 上
摇滚
30首
在路上
在路上
K歌台
工作
11:56
11:56
11:56
词
全部
去上班
去上课
回家
流程
初始化流程
播放与提示逻辑
初始化流程
网络不给力啊，先听听本地歌曲吧
当前为2\3g网络
播放在线歌曲
是
我知道了
仅wifi已开启，准备场景数据 将关闭开关消耗少量流量，是否继续 取消
网络不稳定，歌曲准备发生了点错误
继续
重来一次
后台继续初始化
后台继续初始化 错误提示2 初始化小条变为失败状态 重试两次都失败文案修改为提示3
仅wiifi联网的弹窗（弹窗）
是
是
初始化未完成 点击某场景
wifi环境
2G/3G 网络
开通 流量包
否
是否成功 达到可播阈值
否
是否开启 仅wifi
是
否
按正常播放逻辑（第2页）处理 根据是否有本地歌曲和开启仅wifi 出相应2、3g弹窗
亲，没网小度没法分类本地歌曲啊.. 先随机听听本地歌曲吧
是 无任何网络
初始化未完成 开机后检测到有wifi或2、 3g未开仅wifi
是否有 本地音乐
不进入场景 引导去本地播放
当前无网没有可播本 地歌曲呢
否
后台继续初始化
以后再试
页面提示：用户 无法使用此功能
否
否
不进场景 前台显示 初始化小条
稍等，正在为您准备场景歌曲...
是， 初始化小条消失
是否成功 达到可播阈值
流程
初始化流程
播放与提示逻辑
播放与提示 逻辑 是
进入播放页 播放本地+在线歌曲 无本地\在线切换提示条
用户触发场景播放
是否为 WiFi环境 或流量包
2/3/4G 网络 (包括开启仅WiFi)
此场景是否有 本地音乐
是
进入播放页 显示提示文案和选项
否
无任何网络
此场景是否有 本地音乐
进入播放页 播放本地歌曲 （不拉取在线）
是
进入播放页 播放本地歌曲 无本地\在线切换提示条
否
进入播放页 显示提示文案和选项
效果
视觉
主题视觉效果
首页
场景选择页
场景播放页
场景播放页