上一章：OTT端性能优化建设之Weex实践之路 | 《优酷OTT互联网大屏前端技术实践》第三章>>>
下一章：我在优酷OTT端做自动化制图 | 《优酷OTT互联网大屏前端技术实践》第五章>>>
作者|阿里巴巴文娱技术 魏家鲁
一、背景
阿里巴巴文娱板块的OTT端业务，是由天猫魔盒硬件、酷喵APP、TV厂商专供APP等组成的大屏影视业务结合。业务平台为会员制，涉及付费会员、付费点播等多种业务类型。
相对于其它端，OTT端在体验上存在一定的局限性，一是受限于遥控器操作尺度较小；二是OTT端页面元素需要依赖焦点切换，深层级展示效果受限。于是在OTT端业内，各厂商APP页面均是走“扁平路线”：没有下拉展开、没有悬浮露出、没有多级菜单……在OTT页面建设开发过程中，用户体验与操作复杂度直接影响用户参与率。
会员营收业务作为OTT端（酷喵APP）核心目标之一，前端开发也紧紧围绕体验升级和收单能力升级两大方向进行技术探索，接下来我们就近一年“OTT端-酷喵APP收单能力升级建设”进行总结介绍。
二、原能力
关键词：Native收银台、综合收银台
描述：
以往OTT端-酷喵APP收单业务由Native开发完成， OTT端只有Native收银台一项收单能力，因原生Native开发，整体加载效率较好，并在持续迭代过程中得到升级优化。但是收银台作为Native独立页面，所有下单均需要由原页面跳转至该收银台页面，并由手机端扫码后操作下单，用户操作起来非常繁琐。
收单链路
OTT投放页面-->跳转Native收银台-->手机扫码-->自动下单-->支付
思考
就OTT端影视类APP而言，各大厂商均使用该逻辑链路，而使用中，也似乎没有什么不妥或者硬伤。但是，集合以往财年数据，我们发现OTT端在付费转化率方面，与其它端相比，水位较低。于是OTT产研团队，一直在思考，如何改变这一困局？经过多维度调研和测算，明确一个路线，即：简化付费链路。
与客户端相比，前端具备发版灵活、快速覆盖两大特性，也正是基于这一点，我们业务团队内达成方案统一，由前端进行能力创新升级，客户端予以必要能力支持。于是，收单能力升级正式立项下面对这三个阶段性成果，进行分析讲解。
三、能力1.0
关键词：同步登录态、前端简易收银台、可视化搭建
描述：
在《OTT端登录态设备穿透：扫码登录与扫码反登录》一文中提到，在OTT端，我们实现了账号登录态的同步（相关原理图：传送门），为大小屏互动提供了先决条件。我们前期将该能力使用在大小屏各大战役主会场连通承接互动上，诸如“快快扫码，手机端抽大奖”、“扫码查看奖品”等等。
之后，面临越来越多的会员产品优惠促销活动，我们转换玩法，在OTT端投放的酷喵会员售卖相关页面，放置同步登录态二维码，手机端扫码后，实现账号登录态同步，之后指定跳转至手机端H5收银台，由用户在H5收银台操作下单。而此时OTT端页面一直存在，并未跳转，围绕会员产品售卖的宣传文案和引导一直呈现在用户面前，势必可以加强下单刺激，提高付费量。
于是，一条新的付费收单链路产生：
1) 借助会员商品后台，通过配置优惠活动和指定会员产品；
2) 将1中相关参数添加至H5收银台URL中，获得指定商品和优惠的收银台商品链接；
3) 通过OTT搭投平台，使用前端同步登录态可视化搭建组件，将H5收银台URL配置其中；
4) 配置其它搭投组件，发布页面。
至此，OTT端独立于Native收银台，单独开辟出一条无需跳转的收单链路。
收单链路
OTT投放页面-->手机扫码-->操作下单-->支付
特点
同步登录态设备穿透；
下单账号统一无偏差；
扫码下单，由H5收银台承接，业务稳定；
四、能力2.0
关键词：同步登录态、前端单商品收银台、订单回显、可视化搭建
描述：
在实现能力1.0之后，用户下单转化率得到了一定的提升，可视化搭建投放也节约了运营时间成本，但是正如该项能力的初衷，是为解决同步登录态问题，收单能力只是衍生品，部分收单体验存在一定局限性，比如：
1) H5下单后退出，二次扫码无法回显订单；
2) 一经下单，优惠被占用，未支付情况下，二次扫码无指定优惠。
综合以上两点缺陷，我们通常在H5收银台配置订单提醒，以规避因第一次扫码下单使用了优惠，未支付情况下，二次扫码带来问题。当然这是一种保守方案，且在能力1.0中用户操作步骤仍为3步，这点与Native收银台并无提升。那么如果进一步简化链路，同时弥补能力1.0中的订单回显和优惠占用呢？我们对业务进行拆解：
a) 必须具备大小屏两端同步登录态能力；
b) 采用可视化搭建组件方案，在OTT搭投平台，使用该组件并经过配置后，在投放页面生成收单二维码；
c) 用户扫码后，无需操作，自动下单，一步直达付款；
d) 原订单未支付情况下，用户二次扫码，能回显订单；
e) 原订单已支付情况下，二次进页面，提示购买成功，或者提供新商品展示；
参照该逻辑用例，其复杂性远高于能力1.0，但是一经实现，则可以真正实现简化收单付费链路，提高付费转化。那么既然业务拆解已经明确，且无明显硬伤，接下来，我们对OTT酷喵APP前后端现有收单能力和逻辑进行了解读和分析，最终，经过多方验证，该方案具备可行性，同时也梳理明确了开发链路：
围绕该开发逻辑图我们如期完成了真正意义上的前端会员商品收银台开发，实际效果展示：
收单链路：
OTT投放页面-->手机扫码-->自动下单-->支付
特点：
同步登录态设备穿透；
下单账号统一无偏差；
扫码自动下单，一步至付费；
订单可回显，已购状态可区分；
五、能力3.0
关键词：半屏收银台、半屏互动、圈人定投、可视化搭建、超高曝光量级
描述：
如果说，能力1.0和2.0只是简短了付费链路，提高了付费转化率；那么，能力3.0的建设则具备里程碑式的意义。
在《不一样的烟火：记OTT端半屏互动能力建设》一文中，我们简单介绍了，OTT端半屏投放能力的建设，结尾处我们提到，半屏收银台。大体描述为，在特定视频、特定播放时间点位、屏幕指定区域露出引导元素、遥控器OK键拉出半屏页面、半屏页面呈现引导文案及收单二维码。虽然在手机APP端也存在“半屏”概念，也建设有半屏收银台，但是与OTT端的半屏有相当大的差异，
首先我们看下OTT端半屏交互示意图：
上述页面中的，播放器和半屏页面是存在于两种层级的视图，更准确的说，属于两种语言技术栈的视图，播放器属于原生Native，而半屏页面则是前端Weex，凭借高层级，覆盖于播放器之上，而左半边镂空设置，实现“半屏假象”。当然，这也并不是简单的页面视图叠加，逻辑处理中包括了抢夺页面焦点等等OTT端特有的情况处理。
说回收单能力，3.0能力建设，引入了“精细化圈人定投”逻辑，与能力2.0的“坑位定投”相比，半屏定投具备更多维度以及更精细化逻辑处理，实现账号权益、软硬件、指定视频及播放点位、疲劳度等多方位综合圈人投放。其原理图如下：
实际效果展示：
收单链路：
OTT半屏投放页面-->手机扫码-->自动下单-->支付
特点：
1) 同步登录态设备穿透；
2) 下单账号统一无偏差；
3) 扫码自动下单，一步至付费；
4) 订单可回显，已购状态可区分；
5) 半屏场景，渗透量级巨大；
6) 具备定投圈人配置能力，渗透曝光量级巨大。
六、总结与展望
经过OTT端酷喵会员线团队共同努力，在一年时间内，对现有能力进行升级扩展，取得一定成绩。尤其在场景适配方面，体验更为良好，经过数据测算，付费转化率方面也取得较大程度提升。此外，多种形式收单能力，也反向促进运营同学的营销方案思路扩散，开战了多种营销方案创新，整体效果良好。
