抖音开放平台Logo
开发者文档
“/”唤起搜索
控制台

透明背景能力开放指引

收藏
我的收藏

什么是透明背景

透明背景是指,支持玩法源输出透明背景,可结合主播视频流实现玩法x主播画面深度结合,丰富内容形态,形成新的主播x用户x玩法的互动形态
开发者只需要在玩法内设置好透明背景,且主播在直播伴侣素材区调整好摄像头和玩法画面的位置层级关系,即可实现主播画面「嵌入」在玩法内容中,从而提升玩法直播间的吸量表现、给予主播更多才艺展示空间
开发者们可集思广益,结合透明背景能力,探索玩法新形态,开拓新的直播玩法内容,扩大收益规模

开放时间

    8/7起对开发者开放能力;开播主播则需要同步升级至伴侣10.5.0及以上方可应用此功能
    开放对象:有诉求使用该能力、且提案通过平台审核的玩法

上线流程&设计规范

温馨提醒!!完成提案提交后,需通过问卷申请透明背景能力,1个工作日可获得反馈
如不提交问卷,云启动的主播将无法实现透明背景的效果

    1.玩法设计限制规则

    上线的玩法形态应有独立玩法场景,除主播视频流外,应具备玩法内容,玩法画面不能过于简陋
    礼物效果不可基于影响主播视频流展示范围的大小进行设计

    2.上线申请流程

形态参考

以下画面及形态的参考,仅用于概念理解,开发者需进行原创设计,也无需受到以下参考限制
结合参考
主播与用户同场共舞
玩法半屏,给予主播更多展示空间
主播作为一方阵营,与用户对抗
主播融入进玩法内,作为玩法一部分
画面参考
形态参考
单/多直播间舞蹈主播的真人形象,可落座在舞池内,与用户共舞、互动
给予主播较多的表演空间,主播可基于战局情况进行表演;通过主播视频流与玩法深度融合,实现不遮挡玩法UI、更原生的半屏体验
通过透明背景能力,可将主播作为某一阵营的视频流,与其他阵营对抗
玩法可放置于主播视频流上,呈现半透明的状态,主播可基于玩法内的特效表现,与用户互动
说明:上图的灰色区域,为主播实际的直播间背景

接入流程

1.1 本地启动

    1.启动PC直播伴侣
    2.添加素材——摄像头类素材
    3.「直播工具-游戏玩法」启动带透明背景的特定玩法
    4.「双击」画布中的玩法exe素材打开素材设置窗口
    5.勾选「允许窗口透明」
勾选前
勾选后

1.2 云启动

注意
    云启动包体过审后,即可在云启动的玩法中,使用透明背景的能力
    云玩法的透明背景能力需要直播伴侣版本大于等于10.5.0
启动云玩法
开启透明能力后的云玩法-预览效果

开发者接入部分

说明
关于接入,当您联系我们为您的玩法接入透明能力后,我们将为您提供以下能力
    1.主播本地启动您的玩法时,会自动勾选「允许窗口透明」
    2.主播云启动您的玩法时,将默认提供窗口透明能力,无法手动关闭

2.1 Unity示例

    demo源码参考及注意事项
using System; using System.Collections; using System.Collections.Generic; using System.Runtime.InteropServices; using UnityEngine; /// <summary> /// 设置camera solid camera ,(0,0,0,0) /// 关闭project setting中USE DXGI flip mode /// 注意事项: /// 1,如果是build-in pipeline,要把camera的HDR关闭 /// 2,URP pipeline,关闭HDR,关闭postprocess /// </summary> public class TransparancyManager : MonoBehaviour { [DllImport("user32.dll")] static extern int MessageBox(IntPtr hwnd, string text,string caption,uint type); [StructLayout(LayoutKind.Sequential)] public struct MARGINS { public int cxLeftWidth; public int cxRightWidth; public int cyTopHeight; public int cyBottomHeight; } [DllImport("Dwmapi.dll")] static extern uint DwmExtendFrameIntoClientArea(IntPtr hwnd, ref MARGINS margins); [DllImport("user32.dll")] static extern IntPtr GetActiveWindow(); [DllImport("user32.dll")] static extern int SetWindowLong(IntPtr hWnd, int nIndex, int dwNewLong); [DllImport("user32.dll", SetLastError = true)] static extern int GetWindowLong(IntPtr hWnd, int nIndex); [DllImport("user32.dll")] static extern bool SetLayeredWindowAttributes(IntPtr hwnd, uint crKey, byte bAlpha, uint dwFlags); const int GWL_EXSTYLE = -20; const int WS_EX_LAYERED = 0x80000; const int LWA_COLORKEY = 0x1; const int LWA_ALPHA = 0x2; void Update() { //IntPtr Hwnd = GetActiveWindow(); //MARGINS margins = new MARGINS{cxLeftWidth = -1}; IntPtr hwnd = GetActiveWindow(); SetWindowLong(hwnd, GWL_EXSTYLE, GetWindowLong(hwnd, GWL_EXSTYLE) | WS_EX_LAYERED); SetLayeredWindowAttributes(hwnd, 0, 255, LWA_COLORKEY); // You might not need LWA_COLORKEY } }
    下图为此demo的运行示例

2.2 如何调试

    1.打开开发的玩法exe
    2.直播伴侣上添加「游戏进程」素材(在此前可添加一张图片素材作为底图对比)
    3.「选择游戏进程」界面,选择对应玩法exe
    4.勾选「允许窗口透明」
    5.若玩法 exe 透明部分成功看到底部图片素材,则调试成功

2.3 其他

关于其他引擎的玩法,可自行实现透明背景效果,打包出 exe 按照「2.2 如何调试」进行验证,确认是否能在直播伴侣上支持透明背景

Q&A

    1.透明背景和抠图有什么区别?
在主播无需额外操作的情况下,只需将视频流放置在玩法设计的区域,即可实现与玩法融为一体的效果
    2.玩法可设计的边界和空间在哪里?
不违反上述玩法设计限制规则,可通过平台审核即可,如有新创意,可与平台玩法运营、开发者运营沟通建联