如果用HTML5做AR小熊，会怎样？

2024-12-14上海AR开发专家

• 
  如果你打算做一个
  AR应用
  ，无论形式是原生App还是可能即将终将出现的H5+AR，你都应该理解这是一种什么样的技术，为了你和未来的技术供应商更高效的合作，也为了，不被忽悠。
  前几天有几位朋友问了一个很有趣的问题，他说3D小熊这种
  增强现实
  的技术能否用H5实现？
  答案是可以，先看一个例子：
  上面的例子就是用HTML5做的增强现实网页应用，只不过运行在PC浏览器上。
  理论上，H5实现增强现实已经具备一定条件：手机性能的提升（CPU&GPU），微信JS-SDK的开放，微信浏览器这个特殊的平台。当然，一项技术从可行到成熟应用总需要一些时间，目前大家还看不到移动端H5的案例，不过可喜的是，已经有公司在做这样的尝试，相信很快大家能见到。
  3D小熊的火爆似乎在暗示2015年营销人又有得忙了，除了H5，还有AR。如果你打算做一个AR应用，无论形式是原生App还是可能即将终将出现的H5+AR，你都应该理解这是一种什么样的技术，为了你和未来的技术供应商更高效的合作，也为了，不被忽悠。
  以下这个简单的AR例子，介绍了
  AR技术
  工作的原理，
  它通过标志物识别来建立虚拟空间与现实空间的联系，从而实现场景融合的效果
  ，
  这也是3D小熊所运用的AR技术：
  1、计算机的准备工作——标志物识别
  。图中的黑色方块就是标志物，计算机首先需要通过摄像头“记住”这个标志。
  2、当计算机从影像中再次识别到该标志物时，会基于标志物
  建立一个三维坐标，而这个三维坐标其实就是虚拟世界的三维空间。
  此时大家可能会有疑问，标志物是二维的，但为何计算机能建立三维坐标？这里涉及到透视原理，标志物的形变和大小的变化会映射出第三个维度，这其实跟人眼的感觉是一个道理，如果你看到一个正方形纸片变成了菱形，你是不是就能大致判断纸片偏转的角度了呢，同样的，纸片变小你也会知道它离你的距离变远了。
  3、
  此时现实世界的三维空间和虚拟世界的三维空间已经通过这个标志物“连接”起来了。
  接下来计算机只需要在标志物建立的三维空间中实时绘图，就能实现虚拟与现实的无缝连接，如下图所示，计算机在白纸上绘制了一个正方体：
  当然，除了标志物识别，AR技术还可以识别人脸等具有具体特征的东东，看了上面这个例子如果你还没有很直观的感受，可以看以下的几个例子，不需要你下载APP，因为这些都是用HTML5做的在线网页应用，准备一个Chrome或者Mozilla即可：
  ★
   健身跳舞机
  ：没错，这是一个简陋的跳舞机，但是用了非常高端的体感技术，不过小编亲测，真的很难。
  ★ 
  被揍
  ：通过人脸识别判断动作。虽然是个搏击游戏，但实在不知道对方会出哪只拳头。。
  ★ 
  跷跷板
  ：这个游戏最大的难点不在于如何玩得好，而在于你根本不知道游戏规则，有兴趣的话就尽管试试吧。
  AR技术在品牌营销中的应用前景？
  这项技术其实在90年代就出现了，受限于软件、硬件和系统性能等因素，AR技术一直没有得到广泛的应用，当然，还有另外一个制约因素：市场需求。
  基础设施决定了技术应用的可行性，但市场始终是驱动技术应用最强大的动力，就好比2014年火爆的HTML5技术，既得益于微信浏览器这个超级入口和天然的HTML5运行平台（事实上，微信浏览器的入口效应等于统一了浏览器标准，解决了HTML5跨浏览器运行的问题，也解决了到达问题），同时，另一个重要的推动力，是用户对H5的“尖叫式”体验和大量品牌方营销的需求。
  如果说AR技术能够在2015年得以推广，
  肯定要解决两个端的问题：C端（消费者）和B端（商家）。
  在美国出现了一个Blippar，目前是500万用户，750+个品牌商。这个应用做什么呢——增强现实的广告平台。
  △用户可以通过Blippar扫描带有Blippar标志的图片、街头广告，享受增强现实带来的独特消费体验
  事实上，Blippar解决了两个问题：1、通过平台聚合降低了用户成本，原本不同的增强现实应用需要下载很多App，但现在只需在一个App中实现。2、为商家极大地降低了开发成本和用户到达成本。
  因此，
  AR技术第一个发展方向就是广告平台，其中最有可能的是微信。
  设想在微信扫一扫中增加“AR增强现实”功能，用户现在不是扫描二维码跳转到非常单调的网页，而是看到3D动画，比如，扫描超能陆战队电影海报，看到的是电影的3D预告片，又或者扫描肯德基广告，看到KFC安全鸡的全部生产过程，看到任意一只安全鸡，你都可以点击它跳转到这只鸡的个人主页……
  第二个发展方向：
  HTML5+AR。
  回到开头提到的问题——用HTML5做3D小熊会发生什么？
  我们来看一下用户体验3D小熊需要做哪些工作：准备两部手机，一部下载3D小熊App，另一部下载指定标志物图片，打开App并扫描标志物。事实上商家为了减轻用户使用成本已经做了一些操作的优化，一般的AR做法，是让用户准备一个打印机……
  如果你是商家，你需要付出的成本会更高：开发App（3W+），推广（0~X）。这里的推广成本是个不定数，如果按普通的App推广方式，CPA在几块钱的水平，如果通过软文植入，那就浮动比较大了。
  HTML5+AR解决的也是C端和B端成本的问题，
  HTML5的快速迭代和跨平台特性将能很好的解决前者使用成本的问题，而对于B端，部分解决了用户到达和有效转化的问题
  。假如3D小熊是一个H5，那么用户从看到朋友晒图，到体验，到产生有效点击，这一用户路径将大大缩短。低使用成本，带来的是更广泛的传播和更高的有效转化率。
  肯德基曾经在印度做了一次创意传播，他们开发了一个增强现实App，用户可以扫描不同面值的纸币，看到相应能够买到的肯德基套餐，目标是让印度人民觉得肯德基其实没那么贵：
  肯德基的例子有非常值得借鉴的地方：生活随手可得的介质（纸币），产品与传播创意的强关联。这正是AR在营销中能够爆发能量的关键所在，它的介质不像二维码是一个多余的东西，而是亲切地存在于用户生活中的，比如人民币。
  最终这个App的下载是35000。这个数字看起来不是很好看，如果整个创意用H5实现，会有什么效果。留给大家去想象。
  2016年+，技术 + 营销 还能掀起什么浪什么花？
  如果说用一个词来形容这两年技术对营销的影响，Duang~此刻已没有任何一个词更能表达这种难以言表的状态……
  微信在2016年初发布了JS-SDK，这是H5走向下一步繁荣的强大动力。3D小熊的出现似乎让我们看到新兴技术在营销中应用的可能。iBeacon更加成熟的应用以及跟微信的结合也在预示精准营销正走向更令人兴奋的阶段……
  2016年，技术+营销还将爆发出什么能量？在品牌营销中这些看似前景十足的新技术能为企业带来什么价值？
  更多AR新闻就在中国AR网
  本文链接：https://www.chinaar.com/ARzx/954.html