翻开摄像头,2D插画实时变动画,我国程序媛出品,Demo在线可玩

云栖号资讯:【点击检查更多职业资讯】
在这里您能够找到不同职业的第一手的上云资讯,还在等什么,快来!

画一只狸(jian)克(shang),并让它拍照一个「催款」的特写,需求几步?

翻开摄像头,2D插画实时变动画,我国程序媛出品,Demo在线可玩

只需求给狸克安上骨架,再把导出的SVG文件拖进浏览器里,就齐活儿了。

就像这样,你对着镜头怎样动,狸克就怎样动:

翻开摄像头,2D插画实时变动画,我国程序媛出品,Demo在线可玩

这个TensorFlow.js项目名叫Pose Animator,Demo一上线,网友们现已玩嗨了。

翻开摄像头,2D插画实时变动画,我国程序媛出品,Demo在线可玩
翻开摄像头,2D插画实时变动画,我国程序媛出品,Demo在线可玩

比方Julia Jaskólska这位规划师小姐姐,就让自己的舞蹈跟自己的插画著作完美交融了起来:

翻开摄像头,2D插画实时变动画,我国程序媛出品,Demo在线可玩

既训练了身体,又开发了新的创造可能性。

她欢快地评论道:

万万没想到,让我的插画动起来居然这么简略!

翻开摄像头,2D插画实时变动画,我国程序媛出品,Demo在线可玩

完成细节

所以,插画是怎么动起来的呢?

作者介绍,Pose Animator是依据PoseNet和FaceMesh这两个TensorFlow.js模型的辨认成果,来对2D矢量图及其骨架进行实时动画处理的。

其间,学习了计算机图形学中骨骼动画的思维,并将其应用于矢量字符。

在骨骼动画中,一个人物由两部分组成。

其一是用于制作模型的蒙皮,其二是操控动作的要害——骨架。

在Pose Animator中,蒙皮由输入SVG文件中的2D矢量途径界说。

而且,Pose Animator供给了依据PoseNet和FaceMesh规划的、预设好的骨骼层次结构表明。

翻开摄像头,2D插画实时变动画,我国程序媛出品,Demo在线可玩

骨架结构的初始姿态由用户在输入的SVG文件中指定。

而这以后实时的骨骼方位,则依据机器学习模型的辨认成果进行更新。

现在,作者现已推出两个网页Demo。

一个能依据你镜头实时捕捉到的画面,让2D图画动起来。

翻开摄像头,2D插画实时变动画,我国程序媛出品,Demo在线可玩

另一个则针对静态图画。

翻开摄像头,2D插画实时变动画,我国程序媛出品,Demo在线可玩

所以,假如你感兴趣,就能够在电脑端的Chrome和iOS Safari这两个浏览器里玩起来啦。

别的,在安卓手机上的Chrome上,量子位亲测可用。

翻开摄像头,2D插画实时变动画,我国程序媛出品,Demo在线可玩

我国程序媛出品

Pose Animator的作者,是谷歌构思技能专家Shan Huang。

翻开摄像头,2D插画实时变动画,我国程序媛出品,Demo在线可玩

Shan Huang本科毕业于卡内基梅隆大学,专业是计算机科学,辅修人机交互。2014年参加谷歌(上海)。

当年火爆全网的猜画小歌项目,便是她建议的项目。

翻开摄像头,2D插画实时变动画,我国程序媛出品,Demo在线可玩

传送门

GitHub项目:
https://github.com/yemount/pose-animator

镜头捕捉版Demo:
https://pose-animator-demo.firebaseapp.com/camera.html

图片版Demo:
https://pose-animator-demo.firebaseapp.com/static_image.html

【云栖号在线讲堂】每天都有产品技能专家共享!
课程地址:https://yqh.aliyun.com/live

当即参加社群,与专家面对面,及时了解课程最新动态!
【云栖号在线讲堂 社群】https://c.tb.cn/F3.Z8gvnK

原文发布时刻:2020-05-11
本文作者:鱼羊
本文来自:“ 量子位”,了解相关信息能够重视“ 量子位”