苹果AR Quick Look实战AR电商ARKit3.0(RealityKit+Reality编辑器

苹果ARKit的1.0、2.0、3.0版本，分别2017年、2018年、2019年推出AR增强现实开发工具。重点就是右边这张图，2018年ARKit的2.0，推出来“AR Quick Look(USDZ文件格式)”浏览器方式，当你浏览商品网页，把沙发、把家具拖拽到实景物理空间，自家客厅、卧室、办公室实景试一下家具家装的1：1尺寸、色彩、材质是否满意；或者停车位上，你试一下汽车（两厢车、三厢车）是不是正好能放进去；包括这种冰箱彩电大尺寸家电，实景空间试着放一下看看效果。另外，我们也给了第三方建站公司-电商店铺装修的解决方案提供商加拿大Shopify，它在第一时间也就是三个月以后，2018年的9月份宣布支持他的店铺装修-商品导入支持3D格式，前端浏览支持AR/3D浏览商品的特效展示，就是迈向了支持场景型新电商，也就是ARVR/3D电商。

( 本文原创登记、区块链存证！转载请注明：IoT产品王|ARVRMR升级XR的视频课程 )

我们具体感受一下“AR Quick Look”这是知名的汉堡包连锁店Burger，它的官网小程序WebAPP，手机浏览网页的时候，可选AR模式就是“AR Quick Look”AR模式浏览，我们就可以把这个汉堡包拖拽到实景空间，比如办公桌上，你点外卖浏览网页，你就可以看一下具体的这款汉堡包，其他甜品，夜总会鸡尾酒，你就可以具体感受美食的份量、尺寸、色泽、纹理非常逼真的感觉。

接下来再看电商的典型代表-服装鞋帽的，就这种包，旋转放大缩小来看，AR模式就是可以拖拽放在你自家的化妆品台上，旋转仔细的研究商品。这是卖玩具，或者叫手办，日本挺多的这种二次元的，未来都是3D打印，完全定制的，分布式制造，就近制造配送。Try Before You Buy！AR试穿试戴。

2019年，ARKit 3.0实现的店铺装修特效，你一个卖鞋的，你的商品货架-展柜展台，无尽的虚拟展台，你中意这双鞋，控制器手柄把这双鞋拖拽出来360来看，旋转看，立即购买的按钮，闭环完成购买。

AR浏览支撑的场景型3D电商，主打商品类别就是家居家装（宜家那样的）很大的沙发，降低退换货成本。那么这些家居家装的3D Models哪里有？世界主流的家居家装制造商、经销商，他们已经打造了数万级、宜家十万级别的家居家装的3D Models

开发给设计师、开发者装配他们自己的3D电商的店铺，这就是给自己免费打广告嘛。百万级3D素材资源库（3D资产）素材库，收费的、免费的，他显然是拖了一个免费的。他为什么没有把新款的三星洗衣机、冰箱放在这儿，厨房小家电？也是因为他是免费的DEMO，所以他给你拖了一个免费3D Model给你看。所以，你也知道了，启发了你，以后你给客户最快交付方式，就是依靠免费3D素材快速出DEMO。

1.1 Apple：AR增强现实ARKit1.0/2.0/3.0

苹果AR增强现实，AR SDK开发者工具叫ARKit的1.0、2.0、3.0版。2017年6月就是1.0版，iOS11搭载的Safri浏览器；2018年6月，iOS的12搭载浏览器支持ARKit2.0，那么重点就是WebAR“AR Quick Look”我们重点是讲AR Quick Look。ARVR/3D电商的实践，已经简化了，以前需要下载AR APP，现在浏览器方式非常直接，物理世界的环境的Mapping识别，精准探测水平面(桌面、床、地面)准确的把你3D Objects，比如说椅子沙发冰箱洗衣机的3D版，投影到真实的物理世界，然后你看看尺寸、颜色、材质是否合适，这是以后的3D打印定制生产的前奏曲。你可以调色板变换颜色，改变材质。2019年6月份，iOS 13搭载的ARKit 3.0，两款重要的工具：1个是RealityKit工具箱，还有一个Reality Composer（AR/3D编辑器）因为刚刚推出来才1.5个月，第三方支持它的产品还没有出来，稍后介绍。

这是苹果2018年6月ARKit 2.0发布会，苹果的产品经理讲ARKit 2.0功能亮点：改善了面部识别，真实的即时渲染，然后是3D Object Detecting，就是物体识别追踪，把3D Objects放在真实的物理世界，不仅和当地和物理世界位置关系，物理世界数字世界的不同物体的位置Mapping，对电商就是巨大的改进。

丹麦乐高玩具，现在玩法不一样了。乐高以前卖积木玩具，现在要加上AR增强现实工具就是这样很炫目的效果。这种3D场景，3D设计师给出来的这样的产品。物理世界和数字世界，右边那个是真的物理世界的玩具，左边这个是数字世界的魔幻3D场景，两个世界完美的结合在一起。我们还看见有厨师，有这些人物，有很多的3D Objects在这里。

现在我们就可以做一些新的探险，新的玩法，比如说有这么多的可选人物，我们就放在3D环境里面，就可以玩游戏了，就可以玩探险的游戏。所以，现在就是说你卖商品、卖游戏、ARVR社交就揉在一起了，就不大能分得开。

2.1 iOS 12搭载Safari “AR Quick Look”

iOS 12搭载ARKit 2.0“AR Quick Look”它是基于Safria浏览器，2018年06月推出来的，网页展示AR/3D浏览器，展示和分享高清3D内容，采用Pixar usdz（Universal Scene Description Zip通用场景描述压缩档案）ARKit 2.0包含新API与开发AR功能，其中就是开发中提供Quick Look API，UI/UX 显示。分享的人可立即打开预览，无需下载App。不仅适用简单App，也支持网页Html (websites)此前需要下载特殊AR APP，现在你不需要下载APP了，直接浏览器方式。商户的独立官网，用户访问浏览网页看你的商品，商品浏览就可以AR/3D浏览方式，就是把商品拖拽到物理世界，比如买车的用户浏览汽车经销商网页或者汽车制造商的新车上市促销网页，他就可以把这辆车拖拽出来放在自家车位那个地方，看一下这车位尺寸是不是对。所有的卖家居，大家电冰箱洗衣机的电商，ARVR/3D电商就是降低退换货的福音。

关于USDZ格式，后面我们有专门讲怎么导入3D文件格式，然后才能让浏览器AR模式能够转起来。但我们提示一下，这种苹果WebAR案例，它只运行在苹果自家Safria浏览器，谷歌也只运行在谷歌自家Chrome浏览器。我们国内微信、QQ这些浏览器都是不支持的，因不支持WebRTC API中getUserMedia，再根据苹果政策AppStore上架App必须使用官方WebKit内核，导致微信等所有App不支持WebAR，这是非常遗憾。

这里还有一个问题，就是原生AR App与WebAR“AR Quick Look”对比，谁会是赢家呢？

首先问一个问题，大家知道Web App是啥？就是小程序。这要看实际需求，Web App是一种简单轻松的来实现AR/3D浏览，它主要是商品浏览以及转发、分享，跨平台跨终端，方便用户普及。但是，它仍然是一个轻量版，如果你要个性定制复杂了（你要变换材质，你要变换颜色，不管汽车还是家具沙发什么的）需要SLAM Tech（simultaneous localization and mapping）还得原生AR App。

3D Models文件格式（OBJ、DAE、sketchup） USDZ 就是Pixar与Apple共同开发的通用3D文件格式。本质上，USDZ只是.zip压缩档，将 (model)与(texture) 等数据打包在 (package) USDZ 适用Quick Look而不适用其他3D格式。既有的3D Models（AutoCAD、Blender、Maya等）需要使用Xcode Command Line工具转换成.usdz格式。

2.2 iOS 13 ARKit3.0(RealityKit+Reality Composer)

iOS 13苹果手机搭载Safari浏览器具备ARKit3.0新功能，就是RealityKit工具箱，以及Reality Composer编辑器。这是2019年6月发布的，ARKit3.0四大功能亮点：

1、【People Occlusion】人像前后关系正确映射；2、【Motion Capture】摄像头、可穿戴服装的传感器，获取活动中人的关节（2D、3D骨架点）动向轨迹数据，即时投影到动漫或影视主持人的连动。例如，后台人动，前面3D动漫、前台主持人机器人就即时同步运动、表情变换。早前，Minecraft Demo以及3D动漫、AR影视制作、ARVR数字演播室，都已经使用此功能。示例：3D人气卡通主持对的时装秀直播、3D电商/VR Shop市场推广3D/AR/VR。

3、前置摄像头（Front Camera）和实景摄像头（Real Camera）图像同步，将数字世界的3D设计叠加在物理世界，并与之交互：旋转、放大缩小、语音命令。示例，数字世界的3D冰箱，语音命令打开。

4、【RealityKit】【Reality Composer】AR Object动漫时间线，物理Engine自动计算Motion play写实；如何取得RealityKit、Reality Composer进行开发测试?

【RealityKit】访问苹果开发者官网“Applications”下载Xcode 11 beta；

【Reality Composer】苹果Mac菜单选择“Xcode”、Open Developer Tool、Reality Composer，然后就可以在你的Mac上操作Reality Composer app；iOS beta测试版已经关闭, 你仍然可以通过苹果开发者官网的TestFlight 版本申请，一旦通过, 你就可以安装Reality Composer beta on your iOS devices from the TestFlight app。最迟，2019年底，支持Apple Store任意App。

3.1 Apple：如何准备3D Models for AR？

我们想从事新兴的ARVR/3D新职业、新岗位，比如ARVR广告业、ARVR出版业、ARVR旅游业，首先就需要3D建模，但是有成熟3D资产、3D资源库，百万级的，免费的、收费的、商用的。如何储备3D资产，各有门路。

2018年09月，百万级3D素材库【Sketchfab】支持AR Quick Look，自动转化成为Apple USDZ文件格式，Safari浏览器直接打开浏览3D UI（旋转、放大缩小）3D电商空间试放/试穿/试戴物理特效。你去搜索3D素材，分门类别，汽车、家居、餐饮的。示范怎么找餐饮类的3D的吗？这么拖拽出来，那么因为它自动已经帮你转换成Apple的USDZ文件格式，你直接调用就可以了，就可以放在你的AR/3D电商的店铺，转型ARVR/3D电商，试试放置你的家居或者试穿戴服装、鞋帽、眼镜、手表、奢侈品这样的。

3.2 Apple：如何导出USDZ文件格式？

示例：如何导出如何导出USDZ文件格式，然后他才可以在Safari浏览器，在苹果的Mail、Messages以及苹果其他内置APP里面，实现AR/3D浏览效果。

4.1 Apple：ARKit2.0实战AR电商-WebLink

VECTARY官网，傻瓜版做3D设计的工具，非常适合零基础入门级的同学。我们注册登录进来的界面，我们看见已经有很多内置的3D资产，基本的几何形，常用的3D Models，还可以点这个地方搜索。但是，我这里选右边第2行的这只足球，我把3D足球拖拽到我们的工作界面，然后我们看见XYZ轴，我们先适应一下ARVR/3D编辑器的操作。。。。

你可以把足球看成一个商品，比如说是一个小家电，然后好3D文本投进来，然后也是要使用一下XYZ然后改他的文本文字，就是在这里右手边RTX3D文本在这里写的，然后文本大小、字体、文本的位置、文本色彩是你可以调色板里面任意变换的，高清度精度，这个是简单示范，怎么原创DIY。左上角这里你要导入一个现成的，你已经有的文件、3D文件格式，这5种文件格式，你拖拽到工作界面，把文字3D文本给他编辑一下，然后就导出，右下角这个地方导出，我们选3D文件的格式，我们点选USDZ格式，导出需要几分钟时间。

这要看3D文件大小，精度，精度越大可能就是5分钟7分钟。所以，我们选了简单的，现在就是在压缩USDZ文档，然后EMAIL通知说已经好了，然后3D文件USDZ格式的weblink就出来了，你复制粘贴，就是USDZ的这个文档，你就可以粘贴到你的AR/3D浏览器方式，这样就搞定了。你也可以直接把它下载了，在这里下载到本地，比如说像这样的在我的电脑的本地，然后我就把它发到发到我的朋友圈。点手机上面右上角分享Messenger，朋友圈就都可以实现这样的AR/3D浏览。

4.2 ARKit2.0实战AR电商：Scan、Detect

实战：基于ARKit 2.0的ARVR/3D电商，这盆花3D文本标签（商品详情）是怎么做的？物理世界的这盆花和数字世界的3D标签，怎么detect探测？360度旋转，怎么完美贴合的？