和平精英项目与“火箭少女”开启了主题活动。3月18日上线“火箭少女”101与游戏特种兵人脸融合的小程序活动。人脸融合技术由腾讯云AI团队提供支持,采用优图新融合算法在GPU上实现人脸融合功能,新融合的特点就是保证与这类动漫人物或虚拟人物的融合度达到自然、贴合完成换脸的视觉感受。

在这个活动中,我们使用小程序来承载整体的活动,并借助云开发快速且高效的实现了「与火箭少女合影」的效果。目前活动已经结束,小程序已无下架无法体验,我们录制了一段项目流程视频供大家观看体验:

如何又好又快的实现合影功能

小程序具体的合影功能使用了腾讯云 AI 的人脸融合功能,通过人脸融合,实现了合影的功能。

整体的架构比较简单,小程序侧调用云函数进行处理,云函数侧直接调用 AI 的人脸融合接口,前端直接完成相关功能的接入。

相关代码逻辑可以参考如下的代码

小程序端代码

// 在小程序侧主要是读取图片,并借助云函数的参数对数据进行上传。

Page({

callFaceFusion: function (photo) {

wx.cloud.callFunction({

name: 'FaceFusion',

data: {

//合成的原始图片

image: photo,

//素材ID

modelId: __this.data.modelNowId

},

complete: res => {

this.setData({

faceFusionRes: res.result.Image,

photoStatus: 'step3',

canvasTop: '-600px'

})

}

})

}

})

云函数代码

const { SecretId, SecretKey } = require('./tencentcloud_secret.json')

const cloud = require('wx-server-sdk')

const tencentcloud = require('tencentcloud-sdk-nodejs')

cloud.init()

//tencentCloud API

const FacefusionClient = tencentcloud.facefusion.v20181201.Client;

const models = tencentcloud.facefusion.v20181201.Models;

const Credential = tencentcloud.common.Credential;

const ClientProfile = tencentcloud.common.ClientProfile;

const HttpProfile = tencentcloud.common.HttpProfile;

let cred = new Credential(SecretId, SecretKey);

let httpProfile = new HttpProfile();

httpProfile.endpoint = "facefusion.tencentcloudapi.com";

let clientProfile = new ClientProfile();

clientProfile.httpProfile = httpProfile;

let client = new FacefusionClient(cred, "ap-guangzhou", clientProfile);

let req = new models.FaceFusionRequest();

/**

* formatting arraybuffer to base64

*

* @param {Array} array Uint8Array格式化后的普通数组

*/

function arrayBufferToBase64(array) {

const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";

let bytes = new Uint8Array(array);

let len = bytes.length;

let base64 = "";

for (let i = 0; i < len; i += 3) {

base64 += chars[bytes[i] >> 2];

base64 += chars[((bytes[i] & 3) << 4) | (bytes[i + 1] >> 4)];

base64 += chars[((bytes[i + 1] & 15) << 2) | (bytes[i + 2] >> 6)];

base64 += chars[bytes[i + 2] & 63];

}

if ((len % 3) === 2) {

base64 = base64.substring(0, base64.length - 1) + "=";

} else if (len % 3 === 1) {

base64 = base64.substring(0, base64.length - 2) + "==";

}

return base64;

}

// 云函数入口函数

exports.main = async (event, context) => {

// 图片转 Base 64

let imageBase64 = arrayBufferToBase64(event.image);

// 构建参数

let params = '{"ProjectId":"123456","ModelId":"' + event.modelId + '","Image":"' + imageBase64 + '","RspImgType":"url ","PornDetect":1,"CelebrityIdentify":1}'

req.from_json_string(params);

return new Promise((resolve, reject) => {

// 调用 API

client.FaceFusion(req, function (errMsg, response) {

if (errMsg) {

console.log(errMsg);

resolve(errMsg)

}

resolve(response)

});

})

}

合影功能优化

在具体的实现方面,为了获得更好的效果,我们在实现方面做了一些优化,具体包括:

对用户上传图片进行压缩处理,减少图片大小,提升处理速度

在研究了云开发的计费模式后发现,云函数的主要计费在于运行时间和函数外网流量,因此,我们通过研究,决定对用户上传的图片进行压缩。通过压缩用户上传的图片,来控制函数的处理时间和相应的外网流入时间。

通过加入 Canvas 转存的功能,我们实现了对于图片的压缩功能。

在实际的生产环境中,图片经过压缩后,体积会从缩小为原来的 1%,大大的提升了处理的速度和效率。

对于人脸融合素材进行缩小处理,仅做局部融合

除了对于图片进行压缩处理以外,我们还调整了人脸融合的素材,通过将需要融合的部分缩小,需要融合的区域和相应的素材都变小后。AI人脸融合的速度和性能都得到了大幅度的提升。

在实际的生产环境中,云函数运行时间与文件体积下降,项目大量请求云函数,节省了大量成本!生产环境中成本下降近 10 倍,可以说是效果非常好了。

一些独特的设计

在这个小程序中,我们并没有使用云开发的云存储进行图片的转存,和一般意义上的 Best Practice 不太一样。这里的主要考量有二:

没有业务存储图片的需求:这个活动小程序所需要的AI融合图片和一般意义上的需求不太一样。融合后的AI图片存储在AI融合服务服务器。

AI 融合接口会直接返回的图片:我们调用 AI 融合接口返回的是图片,而不是云存储的地址,因此,我们在整个流程中直接传递图片可以有效减少环节,缩短整个流程的时间。

如果你的项目也有类似的特点,可以考虑参考我们的方案来进行实现。

项目总结

本次和平精英「与明星特种兵女团合影」小程序,联动AI人脸融合技术在标杆游戏中落地。该项目多团队合作,多团队技术支持,云函数相关数据,AI人脸融合数据,为后续跨团队合作项目积累了宝贵的技术与经验,也期待与项目有更多技术落地!

云合影程序_实战丨与「火箭少女」合影AI小程序的技术实践与思考相关推荐

  1. 「THE NEXT」第三届全球小程序生态大会圆满成功,规模空前,爆点不断

    2019年12月20日,备受投资人和小程序从业者关注的「THE NEXT」第三届全球小程序生态大会在北京国家会议中心圆满结束. 吴志祥领衔开场,猫眼.京东等平台解读小程序的无限未来.全网小程序TOP1 ...

  2. 「创业干货」拼车小程序的盈利模式探究,及快速有效的推广方法!

    「创业干货」拼车小程序的盈利模式探究,及快速有效的推广方法! 前言:小宝的搜狐号"马上来说事"刚刚开通就得到了很多朋友的关注,大多朋友关心的话题就是上线的拼车小程序如何盈利,以及如 ...

  3. springmuvc如何设置jsp的input跳转_如何扩大私域流量?「上线了」跳转小程序来帮你...

    互联网时代,很多商家都明白了争夺线上阵地的重要性,于是想尽浑身解数去争夺线上流量,纷纷开通自己的小程序商城.不过,小程序是轻量化应用,一个小程序基本只能满足单一功能需求.那么商家如何让小程序满足自己的 ...

  4. eclipse的tomcat如何运行自动弹网页_如何在 3 天内零成本完成 AI 小程序开发

    基于对 AI 的爱好与兴趣,我走上了独自钻研机器学习的道路.和所有热爱 AI 的人们一样,在一段孤独的摸索旅程中,我勉强完成了几次深度学习模型的训练.作者:泰斯特想说 故事的起源 基于对 AI 的爱好 ...

  5. 仿「ONE · 一个」 的微信小程序 - 每日一个

    ONE·一个 每日阅读 复杂世界里,一个就够了. 该小程序所有数据均由 「ONE · 一个」 提供,本人采取非正常手段获取,仅作为日常学习之用.获取跟共享的行为或许有侵犯权益的嫌疑.若被告知需停止共享 ...

  6. java反编译微信小程序_教你如何一键反编译获取任何微信小程序源代码(图形化界面,傻瓜式操作)...

    一键获取微信小程序源代码 1 Tips:2 一键获取微信小程序源码, 使用了C#加nodejs制作 直接解压在D盘根目录下后就可以使用 将小程序文件放到 wxapkg目录下 3 这个目录下有一些dem ...

  7. ar 微信小程序_【看一看案例集】AR+微信小程序(1):认识篇

    去年,看一看科技"看看AR"."奇幻洛阳"等支持AR技术的小程序陆续上线.与此同时,不少商城也对"AR+小程序"产生浓厚的兴趣.但面对这么个 ...

  8. java mvc 小程序_[Java教程]Spring MVC 的环境搭建和入门小程序

    [Java教程]Spring MVC 的环境搭建和入门小程序 0 2017-02-17 00:00:16 1.1.下载spring框架包. 1.1.1百度搜索Spring Framework. 进入s ...

  9. php微擎万能门店小程序_【微擎微赞模块】万能门店小程序6.8.73+小程序前端+后端...

    源码介绍 微赞微擎模块万能门店小程序不限制小程序生成数量,支持多页面,预约功能等. 万能门店小程序的宗旨是:小程序设计无需您过问,签到客户后,根据客户所属行业直接选择模板,各板块点击设定不同的样式.颜 ...

最新文章

  1. referer htttp headers 统计信息 防盗链
  2. Attention模型:我的注意力跟你们人类不一样
  3. centos6 yum安装mysql5.6_centos 6.5 yum安装mysql 5.6
  4. C++算法一:交换算法
  5. nodejs mysql mvc_一种nodejs的MVC框架
  6. OpenShift 4 - 部署运行 MinIO 对象存储
  7. HBase流量限制和表负载均衡剖析
  8. 学习——AQS工作原理分析
  9. 2021 CVPR | 基于渐进感受局部区域推理的全方位监督点云分割
  10. java实现复制文件目录及文件到指定路径下
  11. K3Cloud BOS设计 值更新 字段拼接到文本字段
  12. 点击图片实现图片放大
  13. 【盘点】电影中八大邪恶的超级计算机
  14. gmail邮箱注册成功流程
  15. oracle常见语句(转载)
  16. 2018年最新传智播客黑马WEB前端36期全套视频教程
  17. 计算机光驱参数,光驱价格参数简介【图文】
  18. 为什么要升级BIOS呢?(1)
  19. 王学岗——————H265实现低延时投屏,从零实现高清无损投屏(对应第六节课)
  20. 网站推荐(3)——黑马Java学习路线

热门文章

  1. 5-10 公路村村通 (30分)
  2. pandas 用某一列的值替换另一列的空缺值
  3. 桌面有个文件夹文件或目录损坏且无法读取
  4. 【微信小程序】-- 页面事件 - 上拉触底 - 案例(二十七)
  5. 息烽红岩葡萄|半空烟雨
  6. sendmail 邮件服务器 套件,Fedora架设Sendmail邮件服务器
  7. java爬虫编写步骤_JAVA爬虫--编写第一个网络爬虫程序
  8. [2020世界机器人大赛] BCI脑控机器人技术赛主流算法讲座-运动想象主流算法笔记
  9. PathFileExists()函数使用连接错误解决办法
  10. C++分配和释放动态数组