仅以本文纪念状态最多最难定义的功能。

国内市场上的直播软件或者视频软件，大多都有悬浮窗功能（也可以叫画中画）。

国外的直播APP几乎没有对应的功能，除非是国内公司做的APP，因此当时在产品设计的时候着重以某鱼进行研究。

画中画功能让用户在看直播的时候被打断了，还能边处理事情边看直播（例如IM），同时能在处理完事情之后，快速的回到直播间。

本文针对竞品该功能进行研究，并且在后文附上相较于竞品功能的优化。

（系统层级的画中画当前仅在安卓端实现）

竞品现状

例如某鱼直播平台，在安卓端的设置里面就有如下图的悬浮播放功能。

悬浮窗功能开启：当用户点击打开这个开关的时候，会弹出是否授予APP悬浮窗权限。如果授予了，就可以在系统桌面显示直播画面；如果没有授予，仅仅可以在APP内使用这个权限（但是可以暂时不授予这个权限，以后再授予）。

悬浮窗功能使用：当用户离开直播间的时候，就会展示直播画面在一个悬浮窗内。

悬浮窗交互：

缩放：悬浮窗可以通过双击画面进行缩放，仅可以缩放3个大小，X1，X2，X3；也可以通过单击画面X1处进行缩放。

静音：单击画面中的声音按钮，实现禁音和播放声音。但是不能调整声音。

回到直播间：单击画面中除了X1和静音按钮外的任意一个地方，即可回到直播。

如下图（注意右上角的关闭按钮，后文会讲到）

新功能引导：在首次出现悬浮窗的时候，画面中会有一个引导层教用户怎么进行操作。引导层点击则消失。

海外用户的不适应

当时我们在按照某鱼的做法来做产品功能的时候，在第一版发现了一些海外用户用不舒服的地方。

一、某鱼的悬浮播放开关，只有一个按钮。

对于没有受到悬浮窗功能教育的用户来说，他们不明白为什么需要授予系统级的悬浮窗权限，明明就已经打开了开关，为什么还需要额外授予什么权限，如果不授予那么会怎么样？开关关闭？正常使用？

这个权限的授予会造成用户的困扰，特别是海外用户。

并且如果当时没有授予权限，以后也不知道需要授予权限才能在APP外也能打开悬浮窗。

二、某鱼的悬浮窗仅仅能缩放3个大小的画面。

3个倍数大小的缩放，在我们看来似乎不太满足用户的多种场景的个性化需求。

三、用户比较容易忽略某鱼缩放交互

某鱼缩放交互的出现，是第一次展示悬浮窗的时候，悬浮窗上面有一层引导层。

而用户在第一次使用悬浮窗的时候，只想赶快知道这个东西是什么，引导层把用户的思维打断了，用户不会注意到引导就直接取消。

并且海外较常使用的twitch，youtube直播平台，他们们的画中画是没有缩放功能。更别提使用双击进行缩放功能了。

针对性优化

因此，针对以上的三种情况，我们分别进行了优化迭代。

一、我们分别设计了两个按钮开关，两个都是独立的开关。

1是APP内的悬浮窗（不需要权限），2是系统级的悬浮窗（需要系统给予悬浮窗权限）。

第2个悬浮窗打开的时候会检测APP是否有权限。如果没有给予系统层级的权限，会出现一个弹窗引导用户去给予权限。如果在之前已经授予了悬浮窗权限，则直接打开。

这样做的优点是能满足到用户多场景的个性化的需求。如用户仅仅想在APP内使用悬浮窗而不想在APP外使用悬浮窗；用户只想在APP外使用而不想在APP内使用；还有就是海外用户对于权限的给予比较敏感。

缺点是按钮太多而不够简洁。

悬浮窗开关

二、优化悬浮窗的缩放倍数和交互

参考照片的缩放：两个手指放大放小，这也是第一代智能机就有的缩放交互。

参考PC的缩放：鼠标拉动边缘的位置进行缩放。

因此参考的交互是直接拖动缩放的icon的位置，即可将视频缩放。使用拖拽的效果，让用户在可展示的视频最大值和最小值之间近乎平滑的进行缩放。这样可以满足一些用户的强迫症。

值得注意的是：开发的过程中发现在APP外使用画中画的时候，拖动会有一些抖动。

悬浮窗缩放

三，画中画调起直播间

在实际测试中发现，有些安卓机型点击画中画，不能直接调起APP回到直播间，并且画中画消失了，但是直播的声音仍然存在。

发现小米手机在权限管理中有个“允许后台弹出消息”的权限，勾选之后就可以调起APP。

猜想应该是国产系统做了某种限制，这种系统层级的限制，我们往往是没有办法的。

当前解决的办法是当画中画在APP外打开的时候，在系统状态栏给予一个状态提示（如下图），点击状态提示，直接打开APP并且回到直播间。

此方案的优点是能解决了某些机型不能调起APP的“BUG”。

缺点是增加了用户的操作步骤，不够简洁。

状态栏提示

实际开发中的一些产品问题

当然，以上的产品功能是比较粗略的，实际的需求开发过程中，遇到了很多问题。

1，手机息屏的时候怎么处理

手机息屏的时候，直接关闭画中画模式，并且没有声音，再点亮屏幕，不回复画中画。

2，点击画中画（包括状态栏）和点击APP图标有什么不同

点击画中画的时候回到对应的直播间，点击图标回到离开APP时候的位置。满足用户的操作预期。

3，返回直播间的聊天室优化体验

处于画中画的时候，大多数竞品的表现都是直接销毁了直播间，意味着用户处于画中画时，不能接收到聊天室的消息，从画中画返回直播间，也需要重新加载聊天室。

因此更进一步的优化则是画中画状态继续保持聊天消息。此时则需要考虑内存的问题，还有各种异常状态的定义。

4，画中画增加静音按钮

画中画可以添加静音按钮，锦上添花。

4、某鱼功能深度体验后的针对性优化（不知道为何某鱼这么久都没有改进这个）

在使用小米手机全面屏手势的时候，手势从底部往上滑，是回到系统桌面。

因此若是在某鱼打开了画中画，则使用该手势之后，预期的结果应该是展示画中画。

实际在使用某鱼过程中，是没有展示画中画，但是仍然有声音。

当时我们做出的产品发现也有这个问题，问题的根源是监听不到这个手势，因此用户只能从直播间退出，再回到系统桌面。这样十分麻烦！！！！

所以研发小哥换了一种思路，写逻辑监控前后台的变化。

十分感谢Androider_杜小菜秃头小哥哥在开发过程中把某些极端场景帮忙定义。

十分感谢EvelynChaw小姐姐金牌测试，测试过程中不断对我进行投诉。