从0到1教你搭建快手直播电商直播间模块。直播间是直播的核心模块，也是所有基于直播场景的交互和呈现的载体模块。随着直播的发展，逐渐演变成“直播+”的模式，传统节目都加入了游戏、电商、综艺、场馆等直播内容。
但直播和电商直播之间存在基因差异。本文主要想和大家分享一下如何基于直播电商的产品形态搭建一个直播电商的直播间模块。
电商直播与传统的秀场直播有很大不同，主要体现在：
1.用户有不同的需求
2.直播场景不一样
3.不同的产品形态
在用户需求方面，传统的秀场直播更倾向于社交。用户主要围绕主播观看直播，核心是主播。直播电商更多的是基于社交网络的电商交易。用户主要围绕商品观看直播，核心是商品。
在直播场景中，传统的节目直播更多是靠主播的“秀”和“演”来维系直播内容。直播电子商务更多的是“解释”和“展示”产品以与用户互动和回答，以及促销和游戏以激励用户。
在产品形态上，传统的秀场直播更需要思考如何让用户留在直播间。直播电商更关心的是如何让用户边看边买，打造从看直播到浏览商品、从浏览商品到完成购买再返回直播间的一站式购物体验。
基于以上分析可以看出，直播电商的直播间模块的核心是思考如何打造用户边看边买的一站式购物体验。我们还是从用户场景出发，探索如何设计直播电商的直播间功能。本文主要分为以下两部分：
1.探索直播电商的用户场景
2.设计直播电商直播间模块
直播电商的用户场景
我们先来看看直播电商解决了哪些问题？
传统的电子商务解决了产品的访问和在线展示的问题。通过搜索、分类、商品详情页三大工具，人们可以在线购物。随着产品品类越来越多，产品内容同质化越来越严重，人们筛选的难度也逐渐加大。此后，筛选成为传统电商平台首先解决的一大难题。
如何让用户快速筛选出自己想要的产品，判断后快速下单购买。因此，推荐系统是大家常用的方法。您可以在淘宝上搜索您要购买的产品。淘宝背后的算法帮你做了很多事情。但尽管如此，淘宝并没有从根本上解决以下问题：
用户购买产品时横向比较的问题。我们根据商品详情图、评论、评分综合评估买哪件衣服，这对于难以选择的患者来说简直是致命的。
买家在用户购买产品后提出问题。网上的图都这么美，为什么我穿起来像阿姨。
商家店铺成功效率的头部效应问题。交易量大的商户越来越多，而交易量少的商户却一直越来越少。
而直播电商正好解决了这些问题。
首先，直播电商可以让用户从自我筛选转变为专家推荐。就像你想买车一样，如果没有专业人士告诉你每辆车的区别，你怎么能找到自己的位置呢？比如在买衣服的时候，如果没有服装达人直播告诉你今年夏天最流行的搭配方法是什么，你是不是又买了去年流行的款式？
其次，在直播电商中，主播大多是各个领域的专家，会在直播中展示产品。通过直播，您可以全面了解产品特点，还可以实时互动答疑。比如在直播衣服的时候，你会找到不同身材比例的模特亲自试穿。可以根据自己的体型选择尺码，甚至可以直接问主播什么适合自己。
最后，直播电商是以直播间为核心的“移动电商平台”，每个直播间都是一个小中心。没有展示就没有机会少卖。当然，直播电商还解决了场景购物的其他很多方面，这里不再详述。
直播电商的用户场景有哪些？我在另一篇文章《如何设计直播电商的场景状态》中写过，有兴趣的同学可以看看。这里只列出与直播间相关的场景。
我们从主播端和观众端分开来看。
主持人：
1.直播时，它可以让我快速列出产品并展示某些产品。提醒用户一键购买。
2.直播过程中，可以实时了解直播间的用户数据，包括直播销量。使用数据3.调整您的内容策略。
4.我直播的时候可以看到用户提出的问题并实时回答。
5.直播的时候，给我一些游戏或者激活房间的方法。比如优惠券、红包等。
6.直播期间，可以进行营销活动，比如秒杀、团战等，促进转化。
7.直播时，直播间的用户可以关注我，成为我的粉丝，也可以通知下次直播。最好让他们知道我的微信/微博并加为好友。
8.直播不直播时，用户可以提前知道我的下一场直播，也可以看我的历史回放，或者直接在直播间购买。
……
查看者：
1.能否推荐一个我感兴趣的类别，让我知道这次直播的主题是什么？
2.你能告诉我这个工作室在卖什么产品吗？谁会看？谁会再次购买？你们如何评价这个产品？
3.让我可以与主持人互动，让他回答我的问题，并实时向我展示我想购买的产品。
4.允许我关注这个主播并成为她的朋友。
5.买的时候不用关闭直播就可以直接买
……
当然，观众的场景需求还是很多的……
直播电商直播间模块设计
直播间模块是一个相当复杂的部分，它包含了很多细节。为了直播间的可扩展性和可维护性，我们需要在前期搭建好直播间框架。在具体设计直播间模块之前，首先要定义几个层次的问题，这是解决直播间交互设计的基础。
1.直播间状态
2.直播间权限问题
3.直播间的视觉问题
4.广播室模块问题
5.广播室等级问题
6.直播间交互问题
直播间状态
直播间分为直播、直播回放、不直播三种状态。每个状态中显示的元素和交互是不同的。而且，直播间的几种状态可以相互切换。比如主播的直播已经结束，正在看的直播变成了非直播状态，正在看直播回放。系统提醒主持人直播正在直播，点击切换到直播状态等
直播间权限
直播间的权利主要是指运营权。主机端一般根据角色分配功能权限，客户端会根据是否登录、用户等级、用户身份等判断是否具有操作功能权限，与视觉相关性有关下面的直播间。例如，只有与主播关联才能收到红包。 （我在另一篇文章《直播和红包结合起来会碰撞出什么样的火花》有介绍）
直播间视觉
直播间一般分为主播端和观众端。有时锚端也根据角色和权限进行细分。不同的权限可以使用不同的功能。通用anchor可以具备的功能包括：
1.产品管理
2.查看交易
3.直播间用户管理
4.控制直播间的互动玩法
5.直播间的设置和数据查看
查看器上可用的功能包括：
1.聊天、点赞、打赏等
2.商品浏览、购买等
3.参加直播间活动等
客厅模块
下一步是划分直播间模块。无论用户角色是什么，我们在定义和设计直播间模块时，都要从技术维护和用户感知的角度考虑。确保直播间视觉展示模块统一。此外，受直播设备和操作行为的影响，直播间的模块和布局也会有所不同。比如主播用摄像头或者电脑直播，在手机上屏幕对半显示，比如用户用横屏观看直播。等待。本文暂不考虑这些因素，这里只讨论手机直播不横屏的情况。
在直播间的模块划分上，我们可以定义11个模块，分别是：
1.基本信息展示区
2.收入统计展示区
3.活动槽展示区
4.运动显示区
5.商品新闻提醒展示区
6.任务交互展示区
7.互动消息展示区
8.产品快速推荐展示区
9.直播间按钮操作区
10.购买奖励动画区
11.点赞互动区
每个区域代表什么？别着急，我们后面会介绍，先看其他问题的定义。
直播间层
直播间有等级制度吗？这是肯定的。从技术的角度来看，这么多功能的实现是层层展开的，尤其是上述模块的很多元素会有重叠的部分。比如动态效果和直播画面谁上，答案肯定是动态效果必须飞到直播画面上方，下面看不到动态效果。在定义层次的时候，要根据元素的重要性来判断。一般原则是：
1.上面是重要信息，下面是次要信息
2.按钮动作大于显示信息
3.商品类大于交互类，大于统计类
所以，我们建议的规则如下：
直播画面底层<直播间基本数据<直播间聊天消息<直播间动画消息<直播间可点击按钮
在直播间的可点击按钮上，会有一个细分。
基本点击按钮（关注等）<统计点击按钮（收入等）<互动点击按钮（秒杀红包等）<商品点击按钮（商品展示等）<弹出框点击按钮（输入框/商品列表等）。
当然，在技术实现上，有时需要处理A在B上，但A属于显示，B属于操作的情况。此时点击A区域应该会触发下面的B操作。
例如，当关注按钮上有购买动画时，此时按钮出于视觉原因不能悬浮在动画上方——会影响视觉体验！所以应该在按钮上显示动画，但是点击时，动画没有点击行为，所以触发了底部焦点按钮。
直播间的互动
直播间交互的设计应尽可能保证直播间内的展示和操作，不要跳出直播间。想象一下，当你在看电影的时候，弹出一个广告，点击跳转到第三方页面，视频不见了，你是什么感觉？因此，尽量保证观看数据、点击操作等都在直播间进行。最好的办法是在直播间弹出框，不中断直播。
直播间弹框一般分为三种：
1.底部弹窗：只显示在底部，一般占据整个屏幕的1/3或1/2。有了这样的设计优势，你仍然可以看到主播的显示屏，但缺点是在底部看不到消息。
2.中间弹框：显示在直播中间，可根据需要调整大小。这个展示的好处在消息模块底部可以看到，但是主播展示的画面是看不到的。当然也可以做成半透明来减少影响。
3.全剧弹框：直播间上覆盖。不用说，有这样的缺点，你什么都看不到。优点是可以显示更多信息，体验和浏览新页面一样。
第一种方式用于直播间内一般产品展示、互动操作等连续长期运营；第二种方式用于消息提醒、基本信息等一次性或短期展示；第三种方式一般是事件介绍，只会用于个人主页展示、第三方网站展示等。
小屏播放
除了这些，还有一个特别重要的交互行为，就是下单购买产品。如何实现边看直播边下单的一站式购物体验？
当我们需要浏览商品详情时，使用上面的第三种弹窗方式很好，但是商品浏览涉及到多种交互方式。用户可以随时查看商品详情中的大图，点击跳转其他页面等。
此外，订购过程还涉及到看不见的互动体验，例如填写收货地址、选择优惠券和付款。用这种方式实现也不是不可能，但是成本很高，几乎是不可能的。
所以这里就介绍一下“小屏”模式的实现。直播视频可以随播放器放大缩小，悬停在页面顶部，可以拖动。这个小屏切换场景的触发是由用户是否浏览商品详情决定的，全程不影响直播。您可以在浏览页面时随时点击小屏切换回直播间。
好的，定义完上面的问题，我们再回到上面提到的11个直播间模块，详细看看每个模块包含哪些信息。
1、基本信息展示区
这里需要澄清三件事，谁是直播，什么是直播，以及直播数据。所以这里会有以下元素。
主持人信息：一个头像和一个直播间id就够了。点击头像可显示更多信息。
直播主题：包括分类和直播状态，让用户可以直播直播间在说什么。
直播数据：观看次数、点赞数。让主播和用户知道这个房间的在线人数，主播可以根据人数进行互动和调整直播策略。
分享入口：可以分享到第三方社交平台，在网络上浏览观看。
2、收入统计展示区
这里主要是给主播和用户看直播的购买情况，这里的收入包括打赏和订单收入。当然，用户多买多直播直播，用户愿意感冒，主播看到收益也会激励自己好好直播。
因为是社交电商业务，点击这里后会有一个排行榜。排行榜可以鼓励买家跟风热卖衣服，也可以互相关注，成为朋友。
3、活动槽展示区
事件位主要指直播间配置的事件内容。一般由平台控制，用户可以直接在直播间点击浏览参与活动。
每个直播间都充当宣传门户。试想一下，直播间可以共享、移动。如果每场直播有10万人在线观看，100场直播就是1000万人。在后台配置一个活动和广告可以暴露1000万次。这是如此重要的流量和变现位置，也便于参与平台活动推广。
这里的交互可以做成轮播滚动，应用的Banner入口可以缩小放置在这里。
4、运动显示区
这里的动画效果是指在直播间飞出提醒增援的动画效果。一般是奖励动态效应和购买动态效应。
5、商品新闻提醒展示区
这里的交互是动态的，用来提示产品。当主播点击某个商品时，用户可以快速看到该位置的商品，点击后浏览详情进行购买。它通常会在几十秒后消失。
6、任务交互展示区
直播间有很多互动玩法和宣传玩法，但这些功能需要主持人开启才能展示。比如主播为某个产品发起了群活动，这个区域就会出现群入口。
直播本身就是一个帮助主播更好地互动和变现的工具，所以互动玩法和推广方式越丰富，主播就越能帮助主播维护粉丝用户。
7、互动消息展示区
实时消息是一种相对复杂的交互行为。消息设计应注意以下几个方面：
1.消息样式展示
2.消息类型划分
3.消息重要性
4.消息提醒频率
5.消息点击交互
6.消息发送正文
直播电商的新闻不如节目热闹，不断滚动刷新画面，更多需要关注问答内容和商品购买。奖励和其他提醒可以被削弱。
8、产品快速推荐展示区
这里可以根据产品的上新时间或购买热度推荐展示，还可以上下滑动展示更多。目的是为了让用户快速看到新的和流行的产品并点击浏览。
9、直播间按钮操作区
直播间的操作基本在底层，区分主播和观众。主播端更多是设定型，观众端更多是互动参与型。
例如，主机可以分为
1.聊天：有时关键信息更容易输入。
DM：总有人想和楼主私信聊天，别问我为什么！
设置：直播设置入口
互动：直播间互动玩法开启入口
促销：直播间的促销开启入口
上线：直播时快速上线新品
商品库：快速管理直播间商品，关联店铺其他商品
10、购买奖励动画区
这个位置代表整个直播间区域。为了突出购买和奖励的动态效果，体验买家和奖励者的土豪面孔，必须添加一些重要的提醒。
11、点赞互动区
为了方便用户点赞，只需用手指点击屏幕即可，无需找按钮点击。
这样，整个直播间从模块布局到功能交互逻辑基本完成。接下来需要根据公司的具体业务需求，在直播间的各个模块上定义不同的功能。在我们学会了如何搭建和设计直播间之后，我们可以在直播间框架的基础上，设计出更多功能性的玩法，让直播发挥的淋漓尽致。
最后本文基于直播电商的特殊场景，从直播间的状态、权限、愿景、模块、层次、交互的定义入手，然后进行具体分析各模块按模块分类和原则。信息化设计思路，从而实现完整直播电商的直播间框架搭建。
