专业彩票网站开发 APP开发,网站开发与设计结课论文,手机网站菜单代码,wordpress功能插件阿里妹导读#xff1a;从“叉手礼”、“水盆羊汤”、“酒晕妆”这些唐朝人的生活细节#xff0c;到精美的坊间造型、充满意境的诗词歌赋#xff0c;《长安十二时辰》不仅以缜密剧情赢得赞誉#xff0c;更还原了一个真实的大唐长安。在精良制作之上#xff0c;技术人如何让… 阿里妹导读从“叉手礼”、“水盆羊汤”、“酒晕妆”这些唐朝人的生活细节到精美的坊间造型、充满意境的诗词歌赋《长安十二时辰》不仅以缜密剧情赢得赞誉更还原了一个真实的大唐长安。在精良制作之上技术人如何让观众感受1000多年前的长安风情、更深度的理解剧情呢今天咱们揭秘《长安十二时辰》背后的酷看体验解读技术人看剧的正确姿势。 想必细心的观众已经发现《长安十二时辰》中出现了很多有人情味的“黑科技“比如百科Tips、角色伴侣、剧情进展图等让用户“边看剧边互动”这就是优酷的酷看模式。酷看模式在移动端采用了多路流的同屏展示、智能平滑切换、精准同步和动态化渲染等技术。其中动态化渲染、子母屏和多路流同步播放是酷看模式在端侧的核心能力能够做到多路流、多机位视频帧级同步播放。本文接下来要讲一讲和《长安十二时辰》相关的背后的一些核心技术。 播放器业务框架 这里必须要提一下优酷的播放器业务框架该框架以一个简单而优雅的模型解构了所有的播放器业务我们称之为OnePlayer通过技术架构的解耦带来了与之相关的技术团队的组织架构的解耦很好地适应了优酷复杂的播放业务场景在该框架下酷看的功能其实是由一组彼此独立的插件组合实现的。 播放器视图模型 如上图所示该模型可以用简单的几句话加以描述 播放器由多个层组成层容器中布局插件播放器发布消息插件订阅消息层和插件信息来自配置文件 核心特性 该框架在设计之初就确定了一系列的优良特性作为设计目标这些特性为我们后续实现酷看模式带来了极大的便利。 基于消息事件驱动引入发布/订阅的消息机制插件按需订阅播放器的事件根据优先级响应和消费消息。插件结构互不依赖将所有的播放功能及业务模块解耦为彼此独立的插件插件之间以消息机制进行通信。按需配置自由组合支持从xml配置文件加载层和插件的配置信息各个业务方在接入业务框架时以搭积木的方式排列组合业务模块构造播放器。插件丰富支持扩展框架会提供一批功能丰富的标准插件业务方可根据自己的需求定制插件来替换默认实现也可以新增插件。多例共存彼此隔离即可有多个播放器在一个页面内同时运行并且从不同的配置创建。 技术升级赋能业务开发 | 技术架构开放化 以插件的形式隔离和封装不同的业务清除业务之间的显式依赖。基于新的业务框架业务方一方面可以将标准插件排列组合创建个性化的播放器尤其是一些基础插件避免重复劳动另一方面可以自定义新插件替换默认实现或者添加新业务插件技术框架层面上支持业务团队独立完成播放器一整套的个性化定制。 | 业务开发标准化 在该播放器框架下业务插件的顶层设计是统一的、标准化的。包括一致的构造函数、一致的创建过程、一致的生命周期、一致的播放器事件响应机制等。对于不同团队业务代码之间的相互理解和跨团队统一作战都有极大的优势。在标准化的过程中更容易产出一些通用插件被更多的业务所复用。 | 播放能力服务化 播放服务与播放业务边界逐渐清晰彻底结束业务代码与播放能力代码犬牙交错的局面彼此松绑并行前进。播放服务内聚收敛具备了向OTT等业务类库级输出的可能性。 二、酷看百科 顾名思义酷看百科主要是在视频播放过程中给出一些类似百科的辅助用户观看的介绍性内容。例如剧中通过酷看百科说明“时辰计时制”和现在“24小时计时制”的对应关系时辰制是看懂该剧的关键要素之一无法理解各个时辰对应的时间自然也就无法体会剧情的紧张节奏。 技术特性上的需求来自两个方面 面向运营运营希望有一个常态化的运营工具简单的通过运营后台修改配置就完成投放无需技术同学辅助也不需要发版本面向用户体验产品希望能够根据用户的偏好和视频的内容做到UI风格多样可动态调整的展示能够较好的与内容融合。 核心点 为了实现“动态化的内容投放和播放模式切换”就必须解决两个具体问题。即 播放器如何进行不同播放模式的切换端侧采用什么技术来实现动态化的投放 对于问题1我们将百科相关的业务也作为一组插件来实现并且对播放器的业务插件进行了分组利用了业务框架的插件管理器的基础能力能够动态的启用和禁用不同组的业务插件。 对于问题2我们采用了阿里开源的Weex来实现UI动态化渲染无需发版即可实现动态化布局再结合后端的定投能力就能够实现按照不同样式模版来动态的投放组件。 三、酷看子母屏 子母屏是酷看中使用较多的一种形态所谓子母屏就是将设备区域划分为两大部分同时投放多屏内容较大的占据主视频焦点的区域称为母屏一般用来播放正片侧边的占据较小的视频区域称为子屏一般用来投放与正片内容相关的辅助或者互动性的内容这有点类似电视在直播比赛时在画面里引入场边的教练采访画面或者简要的赛况数据。 分离母屏和子屏的资源 按照以往的做法会直接将要在副屏中展示的内容通过后期制作以合流的方式直接压入正片视频流中不过在《长安十二时辰》中我们没有采用这种方式。因为这种方式的缺点还是相对明显 对用户不够友好难以按照用户的偏好智能投放对制作不够友好互动资源和正片资源直接耦合对运营不够友好严重依赖后期制作无法独立运营对商业化不够友好内容广告和媒体资源直接固化 以上缺点的根本就在于合流的方式导致相关内容以一种较为粗放的固化的方式投放给观众无视观众的偏好同样也无视了多层次精细化的运营需求这种绑定关系一次性消费掉了好内容。我们围绕这个问题展开工作分离母屏和子屏的资源即不再需要在制作时合流而是让正片内容和运营内容严格分离分开存储和投放。副屏的内容投放将完全交由运营同学来完成运营同学从模版库中选择相应的模版即可快速预览和投放不再依赖后期制作。 以上即为《长安十二时辰》中的一处子母屏投放效果左侧母屏为该剧集的正片右侧副屏是我们投放的张小敬所穿服饰的视频介绍丰富用户的观看体验。 核心点 我们这里只讲一个较为核心的点即播放器双屏容器双屏的内容投放是彼此分离的它是我们后续各种玩法的载体。 | 播放器双屏容器 对于双屏容器有一些具体的特性要求 母屏的缩放尺寸能够根据不同的屏幕宽度和视频资源宽度自适应子屏同母屏一样具有交互性能够响应用户的手势母屏缩放和子屏移入的动效同步。 设计师给出了母屏和子屏可以相互交错叠压的酷炫方案甚至还有延伸至背景的异形遮罩效果对于动效同步的要求也较高。为了解决缩放适配问题我们写了一套自适应的容器布局算法能够基于服务端下发的配置和视频的尺寸计算出最终子母屏容器的布局模型和动效参数然后再根据这套模型驱动渲染视图以达到预期效果。 双屏想要具备交互性响应用户手势主要的阻碍在于Z轴上有覆盖在视频层上的诸如弹幕等其他的遮罩层会拦截掉系统的触屏事件为此我们设计了OnePlayer手势插件作为触屏事件的代理由这个代理按照优先级转发手势事件相关的订阅者这样就突破了视图层级对手势的限制。 副屏的互动性作为通用能力也被使用在其他的头部节目中例如在《这就是街舞2》中观众可以边看街舞边给支持的选手投毛巾。 四、双流同步播放 在解决了子母屏的自动布局和交互性问题之后用子母屏来承载双路流的视频同步播放则是更具挑战的问题。双路流的播放有两个备选方案 单播放器实例子屏和母屏共同作为一个或者一组播放器插件存在共享上下文双播放器实例子屏和母屏各作为一个播放器实例存在具有各自的上下文 我们选择了双实例的方案因为 产品形体来看主副屏之间的主从关系是相对明确的体现为副屏对主屏的单向状态订阅和同步工程角度来看保持模型的简单性是有益的避免因为有两个播放器引入复杂的上下文结构 双路流的观影体验设计时较为超前的在当前的硬件条件下能够让配置不是很高的用户也能够畅享酷看模式是非常有挑战的。 主要的困难点在于 1.系统性的误差控制需要全链路来保证 从视频生产开始视频剪辑工具可能就具有10ms的以上误差然后再经过运营平台录入锚点如果运营工具做不到帧对齐级别的锚点自动计算那么最终对齐的效果也会受人工录入数据偏差的影响事实上从生产到投放再到端侧解码渲染这个系统误差一直在累积传递对于这个误差的控制是个系统工程。 2.播放器对做精准对齐提供的工具有限 播放器基础Api本身执行也在10ms这个量级例如启动、暂停、Seek、变速等接口以及一些状态回调都是异步的甚至系统的sleep精度也是有限的这些方法本身的执行时机和耗时都是不确定的调用这些Api实现40ms级别的同步就好像大象捉老鼠一般困难。 3.设备多样性和运行时随机性适配困难 Android设备碎片化严重性能分布频谱宽广在单次追帧同步过程中运行时状态满随机性较大无法事先给出全局通用的经验值作为参数进行补偿。 双流同步的基本思路 | 要解决同步位置的锚定 这个位置目前是以主视频时间轴为基准这里采纳主视频的时钟有音频时钟视频时钟或者外部时钟三种选择 | 要解决对齐的技术手段本身不精准的问题 对齐的技术手段较多对齐的过程根本上是一个“调节-反馈-修正”的递归过程虽然模型相对简单但是需要达到想要的效果具体实现并不容易涉及较多的实现技巧例如提供更加精准的seek接口尽量让这些Api产生的误差偏离方向一致这样我们就便于在累积误差上做补偿 | 解决客户端运行时的随机性因素干扰 由于机型千差万别运行时状态又充满随机性。这里就需要逐一梳理消除随机性的影响。例如为了适应网络状态的随机性实现全局统一的缓存策略为了平抑个体性能差异我们引入了部分统计学的方法来做追帧补偿统计当前设备最近几次追帧差值的方差和标准差作为下一次补偿追帧的参数针对人眼对播放速度变化的敏感性训练变速追帧的最佳变速曲线等。 我们通过架构设计、工程优化、算法升级和有针对性适配打出全链路的组合拳实现了多路流精准的同步播放最终呈现了不错的效果。这在下面《这就是街舞2》的示例中同步效果看起来更直观。 “浮沙之上难筑高台”酷看模式在技术上创新是一个量变引起质变的过程它得益于优酷乃至阿里集团在一些基础核心技术上的积累酷看模式给用户提供更为舒适的沉浸式观看体验和丰富多样的互动方式是非常有意义的探索其中遇到的技术挑战让我们看到了一些不足也为整个播放技术链路的发展指明了方向希望“酷看”是一只“会下金蛋的老母鸡”。在解决了子母屏的自动布局和交互性问题之后用子母屏来承载双路流的视频同步播放则是更具挑战的问题。 原文链接 本文为云栖社区原创内容未经允许不得转载。