B站产品需求文档

B站定位是多元化视频平台,主要功能是视频播放,围绕视频播放构建的用户体验十分完善,本文只选取常用的视频播放等功能进行分析。

一、文档综述

1.1 文档属性

产品经理,产品经理网站

1.2 产品简介

产品类型:视频平台

产品slogan: 你感兴趣的视频都在B站

产品介绍:是一个围绕用户、创作者和内容,构建出一个源源不断产生优质内容的生态系统的多元文化社区。

产品定位: 中国年轻世代高度聚集的文化社区和视频平台

1.3 产品用户

用户活跃程度:

2020年5月19日,B站公布了截至2020年3月31日的第一季度未经审计的财务报告。财报显示,B站2020年一季度,月均活跃用户达到1.72亿,同比增长70%;移动端月均活跃用户达到1.56亿,同比增长77%;日均活跃用户达到5100万,同比增长69%。

在用户基数大幅增加的基础上,社区活跃度也进一步跃升。尤其是用户日均使用时长攀升至87分钟,环比提升10分钟;而社区月均互动数则高达49亿次,为去年同期的三倍之多。

1.4 需求总结

产品经理,产品经理网站

二、产品结构

2.1 产品功能结构图

产品经理,产品经理网站

右击,在新标签页中打开即可查看

2.2 产品信息架构图

产品经理,产品经理网站

右击,在新标签页中打开即可查看

三、全局说明

3.1 登录页面

权限说明:

登录状态下可以进行所有操作。

未登录状态下进入APP,除了可以观看视频,其他所有功能都不能进行。

产品经理,产品经理网站

右击,在新标签页中打开即可查看

页面名称:登录页面

页面入口:未登录状态下,在“我的”页面左上角显示“点击登录”,或者使用除了观看视频之外的所有的交互功能时,会自动跳转进入登录页面

页面功能:实现两种方式的登录——手机验证码登录、密码登录

页面逻辑内容及其交互详细说明:

手机验证码登录方式:

  • 初始界面下,呈现国家/地区选择框、手机号码输入栏、验证码输入栏、获取验证码按钮、验证登录按钮。
  • 手机号码默认+86,输入限制16位数字,当输入非数字内容时,输入栏不予显示;输入数字后,获取验证码按钮亮起;输入错误格式、无效号码时,点击“获取验证码”,弹出“手机号格式错误”。
  • 点击“获取验证码”后,会弹出一个滑图验证,“获取验证码”按钮变为“60s后重试”,倒计时结束前不能在获取验证码。
  • 验证码正确,完成登录,进入“我的”页面。

密码登录:

  • 初始界面下,右上方有密码登录按钮,点击进入密码登录界面。
  • 登录界面,呈现账号输入栏、密码输入栏、忘记密码按钮、注册按钮、登录按钮。
  • 账号输入栏支持输入手机号与邮箱,且没有字数限制、字符类别限制;密码输入栏同上也没有任何限制,输入密码时输入的字符会短暂的显示2s,然后隐藏为“*”。
  • 点击注册,进入“手机号登陆注册”页面,通过手机号验证注册账号。
  • 忘记密码时,点击“忘记密码”按钮,会弹出“已绑定手机号”、“已绑定邮箱”的选项,点击前者,跳转进入手机号验证登录方式,点击后者,通过绑定邮箱重置密码。
  • 账号密码登录成功后,完成登录,进入“我的”页面。

3.2 网络环境

此为在没有wifi,打开了数据的状态下,横屏竖屏播放的页面。

流程,先关闭wifi、打开数据,再点进视频。

结果,播放页面会提醒流量消耗。

产品经理,产品经理网站

右击,在新标签页中打开即可查看

此为在没有网络状态下,TAB栏的五个页面
流程,先关闭网络,再打开APP。
结果,前两个TAB页面不能显示,后三个TAB页面可以正常显示。

产品经理,产品经理网站

右击,在新标签页中打开即可查看

3.3 键盘输入

只有在手机号验证登录时,点击手机号输入栏/验证码输入栏,会弹出数字键盘。

其余所有的输入都是弹出字母键盘。

产品经理,产品经理网站

右击,在新标签页中打开即可查看

在竖屏播放页面,右下角有一个笑脸按钮,点击后,底侧弹出表情包键盘。
在字母键盘中,也可以点击笑脸按钮,切换至表情包键盘。

产品经理,产品经理网站

右击,在新标签页中打开即可查看

3.4 评论框

产品经理,产品经理网站

右击,在新标签页中打开即可查看

页面名称:评论页面

页面入口:在TAB栏“首页”下,任一标签页面内,点击右上角“消息”按钮,进入消息页面

页面结构:

  • 评论切换栏
  • 用户信息栏
  • 用户的评论内容
  • 对用户评论的反馈
  • 二次评论
  • 评论栏

页面逻辑内容及其详细交互:

从左到右,发送弹幕、弹幕开关。

发送弹幕,点击该按钮,按钮变为“弹幕输入中”,同时底侧弹出键盘,可以进行弹幕的发送。

弹幕开关,默认为开启弹幕;点击该图标,图标右下角显示“禁止“图标,关闭弹幕;再次点击,复原。

评论切换栏,默认“按热度”(热度按多项指标计算),所有用户的评论按热度从大到小排序;点击该按钮,变为”按时间“,所有用户的评论按时间,最近发布的排序靠前。

用户信息栏:从左到右,用户信息、关注。

显示用户头像、名称、账号等级、评论时间(只有竖屏播放-评论框内,显示了用户逇账号等级)

关注,在“按热度”下,排序靠前的三个用户会显示“关注”按钮;如果是该视频的up主的评论,不管“按热度”、“按时间”,都会显示。

点击后变为灰色的“已关注”,然后再次点击,底侧弹出窗口,点击”取消关注“即可取消关注。

用户的评论内容,点击此范围,底侧弹出键盘,进行对该用户评论内容的二次评论。

对用户评论的反馈,从左到右,点赞、不喜欢、分享、评论、拉黑按钮。

  • 点赞,按钮右方显示点赞数,点击该按钮,点赞数加1,同时按钮与点赞数变红,如果再次点击,恢复原状。
  • 不喜欢,点击后,按钮变红,如果再次点击,恢复原状(同时点赞与不喜欢不能同时点击,点击其中一个,将取消之前对另一个的点击)。
  • 分享,点击后,底侧弹出分享框,可将该用户评论分享至第三方平台。
  • 评论,点击后,底侧弹出键盘,进行对该用户评论内容的二次评论。
  • 拉黑,点击后,从该按钮弹出窗口,可选择“加入黑名单”/“举报”:点击前者,将弹出警示,点击”确认“可拉黑该用户;点击后者,右侧弹出举报页面,必须且只能选择一个举报的类型,然后点击“提交”按钮可进行举报。

二次评论:

此栏显示了用户对用户评论的评论,包括用户名称、评论内容,最下方是二次评论的数量。点击此栏,底侧弹出二次评论框,展示所有的二次评论。

评论栏:从左到右,评论栏、表情包。

  • 评论栏,点击后,底侧弹出键盘,进行对该视频的评论(可点击表情包按钮,切换至表情包键盘)。
  • 表情包,点击后,底侧弹出表情包键盘,可自由选择多种表情包。选择完毕后,可点击键盘按钮,切换至普通键盘,输入文字,完成对视频的评论。

3.5 消息页

产品经理,产品经理网站

右击,在新标签页中打开即可查看

页面名称:消息页面

页面入口:在“首页”任一标签下,点击右上角消息按钮,右侧弹出消息页面

页面结构:通讯录区、互动区、消息区

页面逻辑内容及其交互详细说明:

通讯录区:

左边的为通讯录按钮,点击后,右侧弹出通讯录页面。

右边的为消息设置按钮,点击后,弹出弹窗,从上到下分别为“消息设置”、“up主”小助手、“应援团消息助手”,点击将进入相应页面。

互动区:

此处是一个互动消息的集中,可以按照不同的互动类型查看与个人有关的互动消息。从左到右描述:

  • 回复我的:点击后,右侧弹出页面,里面从上到下按时间顺序展示了其他用户对于我发表的评论的回复。点击任一回复框,将跳转进入该回复所在的页面。
  • @我:点击后,右侧弹出页面,里面从上到下按时间顺序展示了其他用户发表的对@我的评论。点击任一评论框,将跳转进入该回复所在的页面。
  • 收到的赞:点击后,右侧弹出页面,里面从上到下按时间顺序展示了其他用户对于我的评论的点赞。点击任一回复框,将跳转进入该回复所在的页面。
  • 系统通知:点击后,右侧弹出页面,里面从上到下按时间顺序展示了系统通知。

聊天列表:从上到下按时间顺序展示了用户对我发送的私信,点击任一私信栏,右侧弹出与该用户的对话页面,类似于社交APP的对话。

3.6 分享页

3.6.1 竖屏分享页面

产品经理,产品经理网站

右击,在新标签页中打开即可查看

3.6.2 横屏分享页面

在横批播放页面,点击分享按钮,底侧弹出分享框,同时页面的其余功能按钮消失,变为播放视频的页面效果。

分享的功能同竖屏一致。

产品经理,产品经理网站

3.7 播放页面交互

此部分主要是考察,在播放视频时,单击/双击页面带来的交互及页面变化。

3.7.1 竖屏播放页面交互

产品经理,产品经理网站

右击,在新标签页中打开即可查看

3.7.2 横屏播放页面交互

产品经理,产品经理网站

右击,在新标签页中打开即可查看

3.8 播放页面功能

此部分主要是考察,在播放视频时,播放页面上的各种功能。

3.8.1 竖屏页面播放功能

产品经理,产品经理网站

右击,在新标签页中打开即可查看

3.8.2 横屏页面播放功能

产品经理,产品经理网站

右击,在新标签页中打开即可查看

四、产品流程图

4.1 登录注册流程

产品经理,产品经理网站

右击,在新标签页中打开即可查看

4.2 观看视频/购物流程

产品经理,产品经理网站

右击,在新标签页中打开即可查看

五、产品页面逻辑图

产品经理,产品经理网站右击,在新标签页中打开即可查看

产品经理,产品经理网站

右击,在新标签页中打开即可查看

六、页面详细说明页

6.1 首页页面

产品经理,产品经理网站

右击,在新标签页中打开即可查看

页面名称:首页-推荐页面

页面入口:在首页,第二栏位于“推荐”时。每次打开APP,会自动跳入首页-推荐页面

页面结构:搜索区;标签区;轮播区;展示区;TAB栏

页面逻辑内容及其交互详细说明:

整个页面:上拉可刷新

搜索区:

  • 位于页面最顶端,从左到右描述:
  • 左边是用户头像,点击后,跳转进入“我的”页面。
  • 中间是搜索栏,点击后,右侧滑出搜索页面。
  • 右边是消息按钮,点击后,右侧滑出消息页面,详见上文消息页面。

标签区:

  • 该部分可以选择进入不同页面,每次打开APP,会自动跳入推荐页面。
  • 在推荐页面,“推荐”二字加粗、变红,底部有一红线。
  • 切换页面的交互方式有两种,左右滑动以及直接点击“直播”/“热门”等按钮。

轮播区:

  • 三个banner轮流向左滑动,每次展示持续2s。
  • 右下角有三个圆点,当展示某一banner时,对应的圆点将亮起,其余的变灰。
  • 用户可以左右滑动以切换banner。
  • 点击Banner,右侧滑出相应的页面。

展示区:

  • 视频呈两栏式分布,可上下滑动。
  • 每一视频包括的信息:封面、播放量、评论、时长、视频名称、点赞数/视频类型。
  • 点击该区,右侧滑出竖屏播放页面,视频自动播放。

TAB栏:

  • 在首页页面,对应的文字、图标变红。
  • 点击其他图标,可跳转进入其他页面。

6.2 频道页面

6.2.1 频道-频道页面

产品经理,产品经理网站

右击,在新标签页中打开即可查看

页面名称:频道-频道页面

页面入口:打开APP后,点击TAB”频道“,默认进入频道页面

页面结构:

  • 标签区
  • 搜索区
  • 订阅区
  • 最近看过区
  • 详细订阅区

页面逻辑内容及其交互详细说明

整个页面:上拉可刷新

标签区:

  • 左边是频道按钮,右边是分区按钮。
  • 在频道页面,“频道”按钮显示为红色加粗,下方有一红线。
  • 在整个页面任意位置,向左滑动/点击分区按钮,将切换至分区页面。

搜索区:

点击后,右侧滑出搜索页面。

订阅区:

  • 此处展示的是用户订阅的频道。
  • 订阅的频道从左到右按订阅时间先后分布,最右边的一个是“更多频道”。
  • 点击任一订阅频道,右侧滑出该频道页面;点击“更多频道”按钮,右侧滑出“全部频道”页面。

最近看过区:

  • 此处从左到右按,浏览的时间先后展示最近看过频道。
  • 可以左滑查看更多看过的频道。
  • 点击任一频道,右侧滑出该频道页面。

详细订阅区:

  • 此处展示了订阅频道的详情,每个订阅频道展示了两个视频。
  • 可以向下滑动,查看更多频道。
  • 点击右上角“管理订阅”,右侧滑出“全部频道”页面;“进入频道”按钮的左边显示了更新的视频数量,点击该按钮,右侧滑出该频道页面;点击下方展示的任一视频,右侧滑出该视频竖屏播放页面。

6.2.2 频道-分区页面

产品经理,产品经理网站

右击,在新标签页中打开即可查看

页面名称:分区页面

页面入口:打开APP后,点击TAB频道,进入频道页面,向左滑动,进入分区页面

页面结构:标签区、类别区、TAB栏

页面逻辑内容以及交互详细说明:

标签区:

  • 左边是频道按钮,右边是分区按钮。
  • 在分区页面,“分区”按钮显示为红色加粗,下方有一红线。
  • 在整个页面任意位置,向右滑动/点击分区按钮,将切换至频道页面。

类别区:

  • 这一部分展示了所有的分区。
  • 可以向下滑动。
  • 点击任一图标,右侧滑出该分区页面。

TAB栏:

  • 在频道页面,对应的文字、图标变红。
  • 点击其他图标,可跳转进入其他页面。

6.3 动态页面

6.3.1 动态-综合

产品经理,产品经理网站

右击,在新标签页中打开即可查看

页面名称:动态-综合页面

页面入口:

  • 打开APP后,点击TAB栏“动态”按钮,进入综合页面。
  • 在视频页面任意位置,向右滑动/点击综合按钮,将切换至综合页面。

页面结构:

从上到下描述:

  • 标签区
  • 搜索区
  • 关注up主的直播区
  • 话题区
  • 综合动态区
  • TAB栏

页面逻辑内容及其交互详细说明:

整个页面:上拉可刷新

标签区:

  • 从左到右,视频、综合、编辑按钮。
  • 在综合页面,“综合”按钮显示为红色加粗,下方有一红线。
  • 点击编辑按钮,右侧滑出编辑页面,可以编辑并发布动态。
  • 点击后,底侧跳出搜索页面,可以搜索动态内容。

关注up主的直播区:

  • 此处显示的是用户关注的正在直播的up主。
  • 点击头像后,右侧滑出该up主竖屏直播页面,默认播放直播。

话题区:

  • 此处显示的是网站的热门话题以及用户的订阅话题。
  • 点击“查看更多”按钮,右侧滑出话题页面。

综合动态区:

  • 此处从上到下,按投稿时间先后展示了关注的up主的综合动态(包括专栏、视频、图文)。
  • 可以上下滑动,查看更多综合动态。
  • 点击右上角“更多”按钮,底侧弹出弹窗,页面其余部分变暗。弹窗内容包括稍后在看等功能。
  • 点击up主头像,右侧滑出up主个人空间。
  • 点击其余部分,右侧滑出竖屏视频播放页面/专栏页面/图文页面。
  • TAB栏:同上。

6.3.2 动态-视频

产品经理,产品经理网站

右击,在新标签页中打开即可查看

页面名称:动态-视频页面

页面入口:

  • 打开APP后,点击TAB栏“动态”按钮,进入综合页面,向右滑动,进入视频页面。
  • 在视频页面任意位置,向左滑动/点击综合按钮,将切换至综合页面。

页面结构:

从上到下描述:

  • 标签区
  • 搜索区
  • 关注up主的最常访问区
  • 我的追番追剧区
  • 视频动态区
  • TAB栏

页面逻辑内容及其交互详细说明:

整个页面:上拉可刷新

标签区:

  • 从左到右,视频、综合、编辑按钮。
  • 在综合页面,“视频”按钮显示为红色加粗,下方有一红线。
  • 点击编辑按钮,右侧滑出编辑页面,可以编辑并发布动态。

搜索区:

点击后,底侧跳出搜索页面,可以搜索动态内容。

关注up主的最常访问区:

  • 此处显示的是用户关注的最常访问的up主
  • 头像右下角有红点的up主排在左边,没有的排在右边。
  • 头像右下角的红点表示该up主有新的视频动态,点击红点头像后,跳转进入该up主的视频动态页面。返回后,该up主红点消失。

我的追番追剧区:

  • 此处显示的用户的追番追剧,可左右滑动。
  • 点击任一番剧,右侧滑出该番剧竖屏播放页面。
  • 点击右上角“全部”按钮,右侧滑出“我的收藏”页面,默认“追番”标签。

视频动态区:

  • 此处从上到下,按投稿时间先后展示了关注的up主的视频动态。
  • 可以上下滑动,查看更多视频动态。
  • 点击右上角“更多”按钮,底侧弹出弹窗,页面其余部分变暗。弹窗内容包括稍后在看等功能。
  • 点击up主头像,右侧滑出up主个人空间。
  • 点击其余部分,右侧滑出竖屏视频播放页面。
  • TAB栏:同上。

6.4 会员购页面

产品经理,产品经理网站

右击,在新标签页中打开即可查看

页面名称:动态-综合页面

页面入口:打开APP后,点击TAB栏“会员购”按钮,进入会员购页面

页面结构:

从上到下描述

  • 功能区
  • 搜索区
  • 分类区
  • 精选区
  • 轮播区
  • 展示区
  • TAB栏

页面逻辑内容及其交互详细说明:

整个页面:上拉可刷新

功能区:

  • 从左到右,收藏、购物车、会员购中心按钮。
  • 点击按钮,右侧将滑出对应的页面,可进行相应的操作。
  • 点击后,底侧跳出搜索页面,可以搜索动态内容。

分类区:

此处展示的是商品的分类,点击图标可进入对应的分类商品。

精选区:

从左到右,分别为“今日上新”、“圈子社区”、“IP乐园”。点击后,将进入相应的页面。

轮播区:

  • 六个banner轮流向左滑动,每次展示持续5s。
  • 右下角有三个圆点,当展示某一banner时,对应的圆点将亮起,其余的变灰。
  • 用户可以左右滑动以切换banner。
  • 点击Banner,右侧滑出相应的页面。

展示区:

  • 顶部的四个按钮是类别,下方是对应的商品展示区。
  • 商品呈两栏式分布,点击某一商品,进入该商品详细页,可以完成支付购买。

TAB栏:同上。

6.5 我的页面

产品经理,产品经理网站

右击,在新标签页中打开即可查看

页面名称:我的页面

页面入口:

  • 点击TAB栏“我的”按钮,进入我的页面。
  • 在“首页”页面,点击左上角头像,进入我的页面。

页面结构:

从上到下描述

  • 背景设置区
  • 用户信息区
  • 社交区
  • 大会员区
  • 视频功能区
  • 创作区
  • 服务区
  • TAB栏

页面逻辑内容及其交互详细说明:

背景设置区:

  • 从左到右的功能,扫一扫、主题颜色、夜间。
  • 点击扫一扫,右侧滑出该功能页面。
  • 点击主题颜色,右侧滑出该功能页面,可以设置首页视图、主题颜色。
  • 点击夜间,切换至夜间模式,整个APP的白色背景变为灰色背景。

用户信息区:

  • 左边,包括用户头像、昵称、性别符号、账号等级、会员资格、B币数量、硬币数量。
  • 右边,显示出空间两字。
  • 点击该区,右侧滑出空间页面,可以进行编辑资料、管理空间等操作。

社交区:

  • 此处显示的是与社交相关。
  • 从左到右,显示用户的动态、关注的up主、用户的粉丝。
  • 点击任一按钮,可进入相应页面。

大会员区:

点击此部分,右侧滑出大会员页面,可进行与大会员相关的操作。

视频功能区:

  • 从左到右,显示离线缓存、历史记录、我的收藏、稍后在看。
  • 点击任一按钮,可进入相应页面。

创作区:

  • 右上角,显示圆角框红色填充背景的“发布”按钮。点击后,底侧弹出弹窗,可以编辑并发布相应内容。
  • 从左到右,显示创作首页、创作学院、创作日历、热门活动。点击任一按钮,可进入相应页面。

服务区:

  • 此处显示了“推荐服务”与“更多服务”。
  • 点击任一按钮,可进入相应页面。

TAB栏:同上。

七、总结

整体来看,B站功能完善而强大,围绕视频播放为中心构建了庞大的功能生态;同时完整的分类体系体现了多元化的内容,包揽了年轻用户所想观看的一切。

TAB栏一个是动态,一个是会员购。

动态可以理解为,B站不仅仅想要发展围绕观看视频所形成弹幕文化、社区氛围,也在构建up主与观众之间的关系链,进一步沉淀用户之间的氛围。

动态本质上与微博一般无二,是一种中心化的用户与一般观众的单向联系。

但是我个人的理解,两者是有不同的,对微博而言,用户间的联系是根本,对B站而言,视频是根本,用户间的联系为辅,具体反映为:up主们更多的是利用动态转发个人的视频、专栏等,用作给视频导流;转发视频的动态的点赞、评论多于日常动态。

会员购则是B站的特有了。形式与其他购物平台一般无二,但是商品完全聚焦在二次元,包括手办、魔力赏、游戏相关等,异常鲜明地针对B站的用户群体。

购物从两个方面来讲,二次元商品这个垂直领域B站是无敌的,但是体量有限。同时在B站不断破圈的进程中,内容、用户越来越多元的进程中,商品却仍然聚焦于二次元,说明用户不习惯B站购买非二次元商品,个人比较不看好。

 

本文作者 @MPC

版权声明

本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符,请点击 举报 进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部