涂图

  • 首页
  • 解决方案
    • 拍照和图片编辑
    • 视频录制和后期编辑
    • 模板视频
    • 人像美颜
    • 人脸特效
    • 滤镜特效
    • 贴纸特效
  • API服务
    • 人像服务
    • 视频融合
    • 人脸云
    • 在线滤镜
  • 客户案例
  • 下载
  • 文档
  • 关于我们
  • 控制台
  • 一、新手上路
  • 控制台操作说明
    • 控制台使用说明
    • 自定义资源上传说明
  • 二、SDK 文档
  • 图像 SDK
    • 产品说明
      • 产品指南
      • 性能测试报告
    • iOS 文档
      • 快速开始
      • 安装与更新
      • 集成向导
      • 相机组件的使用
      • 相册组件的使用
      • 照片美化组件的使用
      • 主题包基础使用
      • 自定义滤镜
      • 自定义贴纸
      • 自定义界面
      • 自定义 ProgressHUD 提示框(2.0.0~3.2.7)
      • 自定义 ProgressHUD 提示框
      • API 文档
      • 致谢
    • Android 文档
      • 快速开始
      • 安装与更新
      • 集成向导
      • 相机组件的使用
      • 照片美化组件的使用
      • 头像设置组件的使用
      • 多选相册组件的使用
      • 主题包基础使用
      • 自定义贴纸
      • 自定义滤镜
      • 自定义界面
      • 自定义进度信息提示框
      • 自定义 Activity 打开相机
      • API 文档
      • 致谢
    • iOS 技术问题
      • 「Incorrenct app key」
      • 更换滤镜效果图
      • 导航栏与状态栏
      • 组件中使用部分滤镜
      • Cocoapods 相关问题
      • 图片尺寸变化
      • Photos.framework 相关错误
      • 多包名发布
      • GPUImage 的相关错误
      • TuSDKTSALAsset 转换系统对象
      • 滤镜无法显示名称
      • 获取相机的点击事件
    • Android 技术问题
      • Incorrenct app key
      • 重复引用包
      • Recyclerview 库缺失
      • 方法数超出 65536 限制
      • 传入图片路径
      • 指定裁剪比例
      • 指定相册每行列数
      • 禁用相册自动跳转
      • 如何使用部分滤镜?
      • 代码混淆
      • TuSDK 使用的依赖库
      • 多渠道打包
      • 设置相机输出尺寸
      • 相机横屏设置
      • 自定义照片美化组件各功能模块效果默认参数值
    • 拼图设计
      • 拼图模板导出
    • 版本更新日志
      • iOS 版本更新日志
      • Android 更新日志
  • 视频剪辑 SDK
    • 产品说明
      • 产品指南
    • iOS文档
      • TuSDK Video Editor iOS 接入文档
    • Android文档
      • TuSDK Video Editor Android 接入文档
    • 版本更新日志
      • iOS 版本更新日志
      • Android 版本更新日志
  • 流处理(特效相机) SDK
    • 产品说明
      • 产品指南
    • iOS 文档
      • TuSDK特效相机接入文档-iOS
      • TuSDK直播特效接入说明-iOS
    • Android 文档
      • TuSDK特效相机接入文档-Android
      • TuSDK直播特效接入说明-Android
    • 版本更新日志
      • iOS 版本更新日志
      • Android 版本更新日志
  • 视频融合 SDK
    • 产品说明
      • 产品指南
      • 模板管理
    • iOS 文档
      • 快速开始
      • 安装与更新
      • TuSDK EVA 接入说明 2.0
      • API文档
    • Android 文档
      • 快速开始
      • 安装与更新
      • TuSDK EVA 接入说明 (2.0.0+)
      • API 文档
    • 模板设计
      • (新)标准模板设计规范
      • (旧)标准模板设计规范
      • 支持的 AE 功能和属性
      • 动态模板设计规范
    • 模板导出
      • (新)模板导出插件安装
      • (新)模板导出插件使用
      • (旧)模板导出插件安装
      • (旧)模板导出插件使用
      • (旧)模板效果查看器
      • (旧)模板打包规范
    • 版本更新日志
      • iOS 版本更新日志
      • Android 版本更新日志
      • 导出插件版本更新日志
      • 效果查看器更新日志
  • 短视频 SDK
    • 产品说明
      • 产品指南
      • 性能测试报告
    • iOS 文档
      • 快速开始
      • 集成向导
      • 录制相机的使用
      • 视频编辑器的使用
      • 功能 API 的使用
      • API 文档
    • Android 文档
      • 快速开始
      • 集成向导
      • 录制相机的使用
      • 视频编辑器的使用
      • 功能 API 的使用
      • API 文档
    • iOS 技术问题
      • 常见问题
    • Android 技术问题
      • 常见问题
    • 版本更新日志
      • iOS 版本更新日志
      • Android 版本更新日志
  • 三、云服务文档
  • 人像服务
    • 使用文档
      • 快速入门
      • 核心功能
    • API概述
      • API 概述
      • API 文档
    • 常见问题
      • 常见问题
  • 视频融合(云渲染)
    • 使用文档
      • 快速入门
      • 模板管理
    • API概述
      • API概述
      • API 文档
    • 模板设计
      • (新)标准模板设计规范
      • (旧)标准模板设计规范
      • 支持的 AE 功能和属性
      • 动态模板设计规范
    • 模板导出
      • (新)模板导出插件安装
      • (新)模板导出插件使用
      • (旧)模板导出插件安装
      • (旧)模板导出插件使用
      • (旧)模板效果查看器
      • (旧)模板打包规范
    • 常见问题
    • 版本更新日志
      • 导出插件版本更新日志
      • 效果查看器更新日志
  • 人脸云
    • 使用文档
      • 快速入门
      • 核心功能
    • API 概述
      • API 概述
    • 常见问题
      • 常见问题
  • 在线滤镜
    • 使用文档
      • 快速入门
      • 核心功能
      • FILTER API
      • API 错误码表
    • API概述
      • API 概述
    • 常见问题
      • 常见问题
  • 四、综合
  • 涂图隐私协议
  • 用户退出机制
  • 动态贴纸设计规范
  • 美妆贴纸设计规范
  • 云服务账单说明
  • 应用包名与密钥
  • 基础服务开发者升级流程
  • 五、常见问题
  • 常见问题
  • 遇到问题,怎么办?
  • 如何使用贴纸管理、滤镜管理?

参考示例

为了更好地说明涂图的产品对于动态贴纸的设计要求,现提供 2 个示例模板。

  • 示例1:小鬼怪
  • 示例2:荧光猫耳

涂图动态贴纸提交规范

以“小鬼怪”贴纸为例。

(一)每组贴纸需提供 Banner、缩略图、序列图、源文件、动画方式(文本)。

Alt text

(二)各文件要求如下:

类别 格式 大小 要求
BannerGIF480 * 480px带人物效果的 gif 图;大小 < 4M
缩略图PNG160 * 160px封面图缩略图一张(用作显示在移动端 App 内用)
序列帧PNG不超过 750 * 1334px1.每个部件一个文件夹。2.同一部件序列图大小尺寸一致,尺寸为:包括该部件运动轨迹“贴边裁剪”的矩形区域。3. 同一贴纸的所有序列图总大小 < 4M。4.如有背景且充满整个屏幕,比例应接近 9:16(以保证拉伸至全屏时图片不变形)。5.后附序列图导出方式。
源文件PSD、AEP、AI
动画方式TXT正向循环、反向循环、随机循环(通常默认为正向循环)

涂图智能贴纸序列图导出流程

以“小鬼怪”这组贴纸为例。

(一)获取贴纸相关信息:

1.在图层中可以看到,此贴纸有 2 个部分组成:“鬼”和“眼泪”。(建议有几个部分就建几个文件夹更灵活;当动画较简单时也可把所有部件当作一个部件放在一张序列帧)

因此应新建 2 个文件夹分别对应“鬼”和“眼泪”。

Alt text Alt text

(二)导出序列图:

以导出“鬼”文件序列图为例(以下为在 PS 中制作动画的情况)。

1.单击“鬼”文件夹,会出现一个边框,此边框即为序列图贴边裁剪的边框。(也即该部件运动轨迹的矩形区域)

Alt text

2.根据边框对贴纸做“贴边”—裁剪。

Alt text

3.设置图像大小,小部件不超过 300 * 300px;全屏类背景图不超过 750 * 1334px(在不影响清晰度的情况下,序列帧越小越好)

4.特别说明:即使在第 1 帧 ~ 第 16 帧时眼泪无动画,是空文件,但导出时也必须导出。必须以 001,002 这种方式命名(纯数字,位数一致,例:0~9,00~99…。也就是此贴纸有多少帧,所有的序列图文件夹里就有多少张图片。)

Alt text

动态贴纸序设计要点

动态贴纸最终效果由贴纸动画的流畅性及人脸识别技术两方决定,由于人脸在实际场景中是动态的,不会静态呈现,因此,贴纸设计过程中有几个细节需要注意:

1.脸部部件(如猫耳朵、兔耳朵)需要细节动画,如轻微摆动,毛发或是卡通形象线条、闪光的一些变化。(参见竞品)

2.人脸部件各个部分需要拆开,我们是根据关键位置来定位部件的,如眼镜中心点,鼻头中心点,脸部轮廓等。(参见附件的示例)

3.若动画播放时长较长,帧数应相应增加,但总体尽量控制在 4 秒之类。(保证动画不失真就需要较多的帧数细节)

4.若为全屏显示的背景类贴纸,比例应尽量接近 9:16,以便贴纸被拉伸至全屏时不变形。

5.每组贴纸都应有 banner gif 图及封面图。(管理需要)

6.一组贴纸的序列帧总体积需要控制在 4M 以内。

补充说明:

1.使用场景:动态贴纸使用场景是用于短视频拍摄场景中,是循环播放的。所以动态贴纸的第一帧和最后一帧的衔接也需要注意。保证整体效果看起来是流畅的。

2.期望效果:可以先参见美图、B612、faceu 等相机视频应用,找找感觉。

上传到涂图控制台操作流程

请点击上传说明

  • 参考示例
  • 涂图动态贴纸提交规范
  • 涂图智能贴纸序列图导出流程
  • 动态贴纸序设计要点
  • 上传到涂图控制台操作流程
  • 在线技术支持
  • 专业售前售后团队
  • 版本定期更新
  • 全方位解决方案

商务合作

  • 177-6716-7529
  • 2969573855
  • sales@tusdk.com
  • 浙江省 杭州市 西湖区 西斗门9号 福地创业园1号楼3楼301室

关注我们

qrcode

©2019-2025 TUTUCLOUD. All Rights Reserved. 杭州元凡视觉智能科技有限公司 | 浙ICP备14040447号-1 | 浙公网安备33010602001649号

  • 177-6716-7529
  • sales@tusdk.com
  • 2969573855