淘宝直播的电商互动之路

淘宝直播的电商互动化之路

丰⽕火

阿⾥里里巴巴⾼高级技术专家

个人简介 2

陈举锋（丰⽕火）

阿⾥里里巴巴⾼高级技术专家

•2015年年2⽉月加⼊入阿⾥里里巴巴

•淘宝直播研发团队

背景介绍

0102

03⽬目 录

直播技术架构

关键技术优化

04电商互动能⼒力力

05

开放平台

直播平台图谱4

泛娱乐直播总览5

淘宝直播

6

内容 整合

商业

变现平台 开放

产品历程

4月

淘宝直播正式上线

5月

打通导购链路

6月

互动打赏上线

7月

直播内容和互动

#直播平台基础建设#

直播首页改版 主播端

主播主页

H5直播间直播导购层（商品推送)

边看边买（直播小窗）

美颜

分享

主播中控台

打赏送礼

直播预告

横版直播间(PGC)

粉丝PUSH

边看边买2.0

主播赋能-主播工具

互动营销玩法

动态化

8月

商业化和粉丝互动

商品橱窗

品牌冠名

连麦

互动通道

整体架构8

客户端整体架构

9

A/V Cap8u6e A/V Re3de6 e视频AH理 H 64/AAC编码 RTMPNC

TCP接入 d路就a接入

FLVFV服务

CDN RP分D Re/46d 录像生M23u8

可选

FLV文件解码 FLV文件块 从CDNL环下载

H 64/AAC解码 FLVD布

T6a3s/4de T路可选

视频质c切换

可选

不卡

不掉不延迟

播放流畅

交互稳定

内容实时

体验核心

关键目标

首屏秒开

K

¬

业务逻辑40%

20%25%15%

预加载、并行处理、请求合并、平滑切换

HTTPDNS、带宽预测、全链路监控GOP边缘缓存、动态策略、参数优化、平滑丢帧

网络优化

缓冲优化渲染优化

音视频核心12

RTP RTMP FEC ABS

G729 MP3 OPUS

AAC H264 H265 VP9

VP8

A

filter

mixaudio ANR

mixvideo

filter

Speaker

RecogniLon

Speaker

Synthesis

KALDI

Face

DetecLon

Hand

DetecLon

CAFFE

Face

Feature

带宽成本13•H265

•窄带⾼高清

淘宝直播连麦框架

14

阿⾥里里云 RTMP 推流服务

主播

连⻨麦⽅方

阿⾥里里云 CDN

观众

观众

RTMP

RTMP RTMP 主播RTMP 连⻨麦

阿⾥里里云 合流 服务

RTMP 合并流

低时延 http-flv

低时延 http-flv

⽂文件推送 (FLV)

ROI技术

15

原理

ROI， Region Of Interest, 根据视频画面中不同区域的重要程度分配相应的码率 实现

视频画面为每个宏块选取不同的权重

根据权重对视频编码过程中不同宏块的量化因子进行赋值

实现不同宏块的码率自适分配直播场景

根据网红直播的场景进行差异化的处理降低带宽消耗

基于人脸识别：

1）人脸区域

2）区域权重

3）背景弱化

时延优化16

电商互动的问题17电视导购?

活动促销？

粉丝活动？

客服咨询？

情景回放18

内容结构化

直播点播化

优惠券进店红包

抽奖投票

直播互动营销玩法

互动技术架构20 直播内容

互动层 功能界面

场景化定制

快速发布、组件

实时营销玩法

活动推送、粉丝互动

动态化

跨平台、动态部署

电商互动流程21推流端

视频流

商品识别

预处理理

商品池

插⼊入元数据

预处理理

元数据

CDN边缘视频流解码

解码⾳音视

频流

解析元数据

渲染媒体

数据

渲染互动

⽅方案

重编码

CDN缓存时间

播放端

内容识别22

位置跟踪

橱窗同步

商品热区

Weex架构23 WEEX

技术体系Virtual DOM

JSFM Vue2.0Rx

Weex Core

Android iOS H5 DevTools IDE⼀一键打包

CI

单测

研发⽀支撑体系

预加载服务分发能⼒力力⾃自动化

组件库UI库

表单Hilo斑⻢马

轻应⽤用框架

业务组件

HybridApi