AI实践哪家强?来 AICon, 解锁技术前沿,探寻产业新机! 了解详情
写点什么

商家应用 + AR : 助力虚拟试妆引擎落地手淘(一)

  • 2019-12-20
  • 本文字数:1496 字

    阅读完需:约 5 分钟

商家应用 + AR : 助力虚拟试妆引擎落地手淘(一)

一句话概括全文:

现在,商家应用支持 AR 效果了!


AR 是什么?是一种现实增强技术(Augmented Reality),可以将虚拟效果应用到真实世界。AR 技能加身后,商家应用可以帮你给你的真实世界加点料。


今年双十一前夕,商家应用团队和欧莱雅集团深度合作,双方团队基于阿里统一小程序容器把 Modiface 试妆引擎在手淘上成功落地。目前已经支持了 YSL 和 Armani 两个顶级品牌的 AR 试妆应用在对应的官方旗舰店里上线。体验方式可以见文末。


Modiface 是欧莱雅集团旗下的美妆科技公司,Modiface 本次推出的 AR 试妆应用,专为手淘环境量身定制,利用小程序容器提供的基础设施能力,把自己的 AR 美妆引擎 “搬到“ 手淘上了。


那么,商家应用 + AR 是如何支撑 Modiface 试妆引擎落地的?下文将给大家分享我们双方在技术合作过程中一些心得。

链路概览

整体玩法链路是这样的,品牌方提供整体应用的设计和交互玩法,Modiface 试妆引擎基于商家应用提供的基础能力上实现自己的试妆引擎,然后统一输出给商家应用服务商,再装修到对应的品牌店铺上。



可以注意到,这个项目中涉及到多方协作,小程序容器提供的是非常基础的能力,AR 引擎负责的是能力的上层组合和自身算法能力的集成,商家应用服务商负责承接品牌的业务诉求并制作商家应用,再由品牌商的店铺装修同学把商家应用装修到对应的店铺上。


品牌方本身可以和 AR 引擎合作来定制自身的个性化需求,再把这种个性化的体验带给自家店铺的用户。

技术架构

为了支撑商家应用 AR 业务,我们在架构设计上以 API 和组件方式提供了非常多的标准原子化能力。


通过能力的组装和调用,AR 引擎可以快速验证自身的算法 &渲染能力,我们支持以 MNN 方式或者 TensorFlow.js 的方式来运行推理 AR 引擎的算法,我们支持标准的 WebGL 接口和 Canvas2D API 以供业务绘制。我们也支持摄像头数据的采集和相机帧的透出。除此之外,我们还提供了非常多的底层能力来供上层引擎调用。



基于这些小程序容器提供的基础能力,上层 AR 引擎服务商可以构建出丰富的应用场景,包括但不限于虚拟试妆,虚拟穿戴,虚拟家居等等。


那么,Modiface 试妆引擎究竟是如何在小程序容器里运作的,我们来一起看一下整个链路。


1.品牌试妆应用加载 Modiface 试妆插件,插件会调用小程序容器的 Camera 组件来打开相机并监听来自 Native 的相机帧数据,插件也会初始化一个 WebGL Canvas 组件来执行 TensorFlow.js。


2.Modiface 试妆引擎拥有两个人脸模型,分别是轮廓检测模型和 Landmark 检测模型,前者运行在 TensorFlow.js 环境中,后者使用 MNN 插件来运行推理。(后续将全部迁移至 MNN 实现)


3.轮廓模型检测到当前相机帧中存在人脸后,会切换至 Landmark 检测,此时会进行人脸精确点的采集推理。


4.同步会采集相机帧中的环境光线的强度以调整美颜算法。


5.提取要绘制的区域位置点阵,譬如人脸嘴唇位置,在 WebGL 的 shader 里开始渲染上妆,并把所有像素绘制 在 WebGL Canvas 组件上。


6.如当前检测不到人脸,则不执行渲染上妆逻辑。


整个试妆流程链路绝大部分运行在小程序容器的 JavaScript 环境里,并通过 JS binding 的方式和 Native 容器进行交互。



商家应用 + AR 的前提是 AR 引擎动态化,相对以往手淘 AR Case 最大的变化是:


1.整个 AR 引擎全部运行在小程序容器的 JavaScript 环境里,在不依赖手淘发版的情况下可以大量快速复制给不同的品牌,并且支持动态定制效果。


2.商家应用 + AR 支持各种不同的行业引擎接入,AR 引擎层和业务层是分离的,通过架构的解耦来支撑各种行业场景。容器底层专注于垂直能力的建设,上层业务快速迭代发展。


本文转载自淘系技术公众号。


原文链接:https://mp.weixin.qq.com/s/wVPinp4CCEnqavqowB5ghg


2019-12-20 14:201233

评论

发布
暂无评论
发现更多内容

NineData和华为云在一起!

NineData

数据库 DevOps 华为云 NineData GuassDB

完美解决 WebSocket 连接失败的技巧

Liam

程序员 后端 websocket

GPT-4o差点没及格!首个多任务长视频评测基准,它有亿点难

Openlab_cosmoplat

ChatGPT GPT-4 人工智能、

国内公司访问国外服务器网络解决方案

Ogcloud

SD-WAN 企业组网 SD-WAN组网 SD-WAN服务商 SDWAN

迁移方案详解 | 使用YMP从异构数据库迁移到YashanDB

YashanDB

数据迁移 yashandb 崖山数据库

在 Go 语言中如何让结构体不可比较?

伤感汤姆布利柏

草莓不是莓,西瓜才是莓——解读 Kubernetes 中被驱逐的 Pod

小猿姐

Kubernetes 云原生

大发大小单双最安全的打法

Geek_89ba7f

大小单双彩票app平台

Geek_89ba7f

大小单双走势规律口诀

Geek_89ba7f

2024 Intersolar Europe,这家中国能源新秀再次瞩目!

科技汇

交互式原型设计神器:Axure RP 9 for Mac/win版中文激活版

你的猪会飞吗

mac软件下载 苹果软件下载

HDC 2024 | 华为云云原生开源+OpenHarmony,加速开发者应用创新

华为云开源

开发者 云原生 华为开发者大会 华为云开源

百倍提升7B模型推理能力 昆仑万维携手新加坡南洋理工大学发布Q*算法

新消费日报

当程序员遇上PPT,会碰出什么火花?

秃头小帅oi

怎么在国内进行tiktok海外直播?

Ogcloud

Tik Tok直播 Tik Tok直播网络 Tik Tok tiktok运营 tiktok直播

大小单双最安全的打法

Geek_89ba7f

GitHub星标破千Star!Python游戏编程的初学者指南

我再BUG界嘎嘎乱杀

Python 入门 开发语言 零基础 游戏编程

软件测试学习笔记丨JUnit5标记测试用例

测试人

软件测试 测试开发

“算启未来”,九章云极DataCanvas公司与您相约WAIC 2024

九章云极DataCanvas

Java实现管线拓扑关系连通性分析

不在线第一只蜗牛

Java 深度学习 优化

百度智能云升级3款大模型应用:面向三类场景打造企业“超级员工”

极客天地

商家应用 + AR : 助力虚拟试妆引擎落地手淘(一)_文化 & 方法_淘系技术_InfoQ精选文章