外观
JSON编排 - 内容编排
967 字约 3 分钟
2025-06-17
JSON编排示例
重要
不同于传统云厂商基于 流式裁剪 的视频制作能力，
趣浪吧的视频内容编排制作，基于 WebGL ，尽管这意味着需要更好的GPU支持，但因此，可以提供更为强大的视频特效能力。
您将无需组合各种复杂并可能互斥的流式裁剪参数，
只需要用更友好且直观 CSS3属性（更低门槛、更简单） ，进行JSON内容的配置编排，即可实现对视频的特效制作。
JSON内容案例
{
"token": "Your_API_Token",
"videoTemplateId": "h5",
"bgAudio": {},
"content": "各位朋友们，大家好！今天要教大家如何在JSON转Video中，为视频内图片元素添加滑入、旋转、滑出的动效。",
"captions": {
"styles": {
"textShadow": "none",
"color": "#fff",
"background": "rgba(0,0,0,.6)"
}
},
"audioType": "FeTl3oaVOlQKL8JR",
"componentList": [
{
"type": "audio",
"opts": {
"itemList": [
{
"url": "https://p3-bot-sign.byteimg.com/tos-cn-i-v4nquku3lp/2303b18d5178414f92389a31d00f7135.mp3~tplv-v4nquku3lp-image.image?rk3s=68e6b6b5&x-expires=1752632601&x-signature=K0FM%2F9YfqE9EOPuDAQxXOVjV7Bs%3D"
}
]
}
},
{
"type": "img",
"opts": {
"styles": {
"position": "absolute"
},
"imgList": [
{
"delay": 0,
"keepTS": 300000,
"styles": {
"width": "100%",
"height": "100%",
"left": 0,
"top": 0
},
"url": "https://p6-bot-sign.byteimg.com/tos-cn-i-v4nquku3lp/d6e2c25bc000471c88b2f2df8f94e8d0.png~tplv-v4nquku3lp-image.image?rk3s=68e6b6b5&x-expires=1752631660&x-signature=sDYOAqLLy3kZq0n5JgoVxVgdjJA%3D"
},
{
"delay": 1000,
"keepTS": 6000,
"styles": {
"width": "40%",
"height": "40%",
"left": "30%",
"top": "30%",
"animation": "1s fadeInLeft 1, 5s linear 1s flip infinite, 1s 6s fadeOutRight 1"
},
"url": "https://p6-bot-sign.byteimg.com/tos-cn-i-v4nquku3lp/7a7e01cf02854cdeb219b90e5509a458.png~tplv-v4nquku3lp-image.image?rk3s=68e6b6b5&x-expires=1752631988&x-signature=2frsSVkbGOK98FgsroxbzFt%2FE3Q%3D"
}
]
}
},
{
"type": "video",
"opts": {
"styles": {
"width": "80%",
"position": "absolute",
"left": "10%"
},
"itemList": [
{
"delay": 1000,
"keepTS": 300000,
"styles": {
"top": "10%",
"animation": "1s fadeInLeft"
},
"url": "https://p3-bot-sign.byteimg.com/tos-cn-i-v4nquku3lp/62bdb69141db41da904fcbddd0940868.mp4~tplv-v4nquku3lp-image.image?rk3s=68e6b6b5&x-expires=1752805225&x-signature=0o10JsevRYH3gFadrX6CjXq%2FTds%3D"
},
{
"delay": 1000,
"keepTS": 300000,
"styles": {
"bottom": "10%",
"animation": "1s fadeInRight"
},
"url": "https://p3-bot-sign.byteimg.com/tos-cn-i-v4nquku3lp/62bdb69141db41da904fcbddd0940868.mp4~tplv-v4nquku3lp-image.image?rk3s=68e6b6b5&x-expires=1752805225&x-signature=0o10JsevRYH3gFadrX6CjXq%2FTds%3D"
}
]
}
},
{
"type": "word",
"opts": {
"styles": {
"width": "80%",
"left": "10%",
"top": "10%",
"position": "absolute",
"textAlign": "center",
"color": "#fff",
"fontSize": "60px"
},
"itemList": [
{
"word": "《居中标题》\n《视频副标题》"
}
]
}
}
]
}视频效果
视频由【趣浪吧视频服务】API生成
视频画布编排
重要
所有生成视频，分辨率均为 FHD超清格式
h5 : 1920 x 1080
pc : 1080 x 1920
{
"videoTemplateId": "h5", // pc
}语音字幕编排
重要
无论是通过积分制作还是资源包抵扣，均免费赠送普通语音合成 、 字幕合成匹配 。
超拟人精品语音合成 为增值服务，100积分=100字，不足百字按百字计算。
重要
更多音色选择，请前往趣浪吧视频创作平台获取。
{
"bgAudio": {}, // 必填，开启语音合成
"content": "各位朋友们，大家好！今天要教大家如何在JSON转Video中，为视频内图片元素添加滑入、旋转、滑出的动效。",
"captions": { // 字幕样式
"styles": {
"textShadow": "none",
"color": "#fff",
"background": "rgba(0,0,0,.6)"
}
},
"audioType": "FeTl3oaVOlQKL8JR" // 音色
}文案内容编排
{
"componentList": [
{
"type": "word",
"opts": {
"styles": {
"position": "absolute",
"textAlign": "center",
"color": "#fff",
"fontSize": "60px"
},
"itemList": [
{
"styles": {
"width": "80%",
"left": "10%",
"top": "10%"
},
"word": "《居中标题》\n《视频副标题》"
}
]
}
}
]
}图片内容编排
{
"componentList": [
{
"type": "img",
"opts": {
"styles": {
"position": "absolute"
},
"imgList": [
{
"delay": 0,
"keepTS": 300000, // 毫秒
"styles": {
"width": "100%",
"height": "100%",
"left": 0,
"top": 0
},
"url": "https://p6-bot-sign.byteimg.com/tos-cn-i-v4nquku3lp/d6e2c25bc000471c88b2f2df8f94e8d0.png~tplv-v4nquku3lp-image.image?rk3s=68e6b6b5&x-expires=1752631660&x-signature=sDYOAqLLy3kZq0n5JgoVxVgdjJA%3D"
},
{
"delay": 1000,
"keepTS": 6000, // 毫秒
"styles": {
"width": "40%",
"height": "40%",
"left": "30%",
"top": "30%",
"animation": "1s fadeInLeft 1, 5s linear 1s flip infinite, 1s 6s fadeOutRight 1"
},
"url": "https://p6-bot-sign.byteimg.com/tos-cn-i-v4nquku3lp/7a7e01cf02854cdeb219b90e5509a458.png~tplv-v4nquku3lp-image.image?rk3s=68e6b6b5&x-expires=1752631988&x-signature=2frsSVkbGOK98FgsroxbzFt%2FE3Q%3D"
}
]
}
}
]
}BGM音乐编排
{
"componentList": [
{
"type": "audio",
"opts": {
"itemList": [
{
"url": "https://p3-bot-sign.byteimg.com/tos-cn-i-v4nquku3lp/2303b18d5178414f92389a31d00f7135.mp3~tplv-v4nquku3lp-image.image?rk3s=68e6b6b5&x-expires=1752632601&x-signature=K0FM%2F9YfqE9EOPuDAQxXOVjV7Bs%3D"
}
]
}
}
]
}视频内容编排
{
"componentList": [
{
"type": "video",
"opts": {
"styles": {
"width": "80%",
"position": "absolute",
"left": "10%"
},
"itemList": [
{
"delay": 1000,
"keepTS": 300000,
"start": 0,
"styles": {
"top": "10%",
"animation": "1s fadeInLeft"
},
"url": "https://p3-bot-sign.byteimg.com/tos-cn-i-v4nquku3lp/62bdb69141db41da904fcbddd0940868.mp4~tplv-v4nquku3lp-image.image?rk3s=68e6b6b5&x-expires=1752805225&x-signature=0o10JsevRYH3gFadrX6CjXq%2FTds%3D"
},
{
"delay": 1000,
"keepTS": 300000,
"start": 25.6,
"styles": {
"bottom": "10%",
"animation": "1s fadeInRight"
},
"url": "https://p3-bot-sign.byteimg.com/tos-cn-i-v4nquku3lp/62bdb69141db41da904fcbddd0940868.mp4~tplv-v4nquku3lp-image.image?rk3s=68e6b6b5&x-expires=1752805225&x-signature=0o10JsevRYH3gFadrX6CjXq%2FTds%3D"
}
]
}
}
]
}