016年7月中旬：

——这阵子淘宝H5很火，朋友圈被刷了好几天屏。这不是一般的720度全景，它有伪3D的VR效果！你能上下、左右滑动看到不同视角的画面，还能玩重力感应。对了那些动漫人物，动起来是分前后的！听说淘宝请外包团队，花了30万。

——哦？以后不用了。

▲淘宝H5原版

2个礼拜后：

7月28日上午，iH5.cn主页悄悄更新系统消息：“全景功能上线，可制作720VR浏览效果”。一下放出3个全景组件，720度VR、重力感应、页面交互，各种功能1个不落！（在此感谢原作者Shrek公开了核心源码）

你是说我们不花一分钱能做出淘宝的H5？

这是真的，我已经把这个H5做出来了：

▲淘宝H5致敬版

相似度：95%

你也要玩玩吗？过程简单得可怕，只有3步——

（1）准备全景素材

▲淘宝H5的图片

A、1张首尾相连的全景图，当背景；

B、堆叠在全景图上的人或物件的PNG图，当前景。

为方便演示，这里直接扒淘宝造物节80张切好的图，拼合成不同的层。上面半透明的背景是20张切片合成的，前景大概照着淘宝H5的位置放，共分成3层（NO.1最靠前）。

（2）用Photoshop切图

A、把不同层的图片各竖切成N份，然后导出；

B、导出时，越靠后层的图片宽度（W）要越大。

不会切图劳烦百度，我这里把1张背景、3张前景分别切20块导出为PNG。切的份数越多，三维效果就越平滑，但图片也会随着变大容易卡。

（3）用iH5做全景运动

▲用iH5设置交互

A、新建全景容器，下面放4个全景背景组；

B、把切好的分层切片分别拖到对应的全景背景组里。

比如你要放背景层图片，就保持全景背景组1选中，把20张切片拖到页面里就行。见证奇迹的时刻到了！以下几张图比较高能，是拖好图调试的效果，强烈建议有WIFI的人点开：

▲用iH5分别调试水平转角、垂直仰角、观察点大小的效果

看完上面图片你应该也懂了，每个全景组就是把切片按顺序围成圆柱。

那刚才给前后层图片设不一样的宽度，用处是？宽度越小，围成圆的周长就越小，当观察点在圆的中心，就会感觉这一层离得越近、移动得越快——VR的立体效果就这么来的。

[注]半径=周长/2π，相减可推测不同层的间距，并判断观察点的合适位置。

如果你对点击弹出华晨宇的新歌介绍、H5上方飘着一个造物节LOGO、滑动页面画面会伸缩什么的感兴趣，直接去官网找教学视频吧。

加全景和调试其实很快，30分钟不到，主要时间都花在处理淘宝那些素材了……扒人家原图重新拼合构图再切开很费事啊，还是原创好。

因为模仿出来的H5太像了，为避免侵权不敢发出来给大家看。你自己试试吧？

要：众所周知，AR/VR已成为当下最火热的话题，然而AR/VR仍然只是处在起步和探索阶段，真正能够引起人们狂热的AR/VR产品少之又少。笔者幻影博客对AR/VR的认知，仅仅是从16年深圳双创周期间，当时国内一大批AR/VR创业者带着最新研发产品展销，引来众多爱好者前来围观和竞相体验，空前繁荣。对于普通小白来说，能够借助软件或者工具制作一款VR内容就是非常不错的体验了，今天笔者为大家带来几款VR内容制作平台，看看是否对你有用呢？

2016年天猫双十一节引入VR/AR技术，引起媒体广泛关注，同时引发用户疯狂利用VR技术搜寻天猫红包，一时间朋友们之间探讨的话题尽与之有关。因此可想而知，VR/AR技术到真实应用场景时，对于用户居然能够产生如此大的吸引力。

何为VR虚拟现实？

VR是Virtual Reality的缩写，中文的意思就是虚拟现实，概念是在80年代初提出来的，其具体是指借助计算机及最新传感器技术创造的一种崭新的人机交互手段。

1992年美国国家科学基金资助的交互式系统项目工作组的报告中对VR提出了较系统的论述，并确定和建议了未来虚拟现实环境领域的研究方向。可以认为，虚拟现实技术综合了计算机图形技术、计算机仿真技术、传感器技术、显示技术等多种科学技术，它在多维信息空间上创建一个虚拟信息环境，能使用户具有身临其境的沉浸感，具有与环境完善的交互作用能力，并有助于启发构思。所以说，沉浸-交互-构想是VR环境系统的三个基本特性。虚拟技术的核心是建模与仿真。

哪些场景开始使用VR虚拟现实？

VR虚拟现实技术已可以被消费者真切地体验到，但上升到行业层面，VR仍处于成长期，无论在技术、产品、内容、规范上，都略显稚嫩。VR趋势毋庸置疑，但就目前来说，VR市场还只是虚火。VR“火”在行业人士和极客两类特定人群之中，对大众消费者来说，VR目前显然还不是刚需。

但人们看好VR，因为它不仅是一项代表未来的新技术，而且是互联网科技产业链发展同人们日益增加的娱乐需求相交的产物，是顺势而生的新事物。从表面上看，VR的核心价值，是能将视听体验带到一个新高度。从深层上看，那可能就非同小可了。当下全球VR设备主要以眼镜和头盔为主，中国的发展进度基本持平，但规模较小。在全球范围内，普遍存在几大问题是：其一，佩戴使用体验不佳；其二，内容匮乏，难以满足需求；其三，缺乏统一规范。这里值得注意的是，历史无数次告诉我们，原以为的问题将都不是问题 。

2016中国梦微电影大赛启动 VR全景微电影成为新亮点，很多人喜欢用VR眼镜看电影。

一、地产漫游：在虚拟现实系统中自由行走、任意观看，冲击力强，能使客户获得身临其境的真实感受，促进了合同签约的速度。

二、虚拟样板间：用于商业项目长期招商、招租、用于各类评比活动。一次性投入，可以应用在项目报批、建设、销售、招商招租等各个环节，并可以永久使用。

三、多专业协调： 多类型车辆行驶路线与其他布置、净空高度，如道路桥梁仿真。

四、网上看房：租售阶段用户通过互联网身临其境的了解项目的周表环境、空间布置、室内设计 。

五、场馆仿真：提前展示真实场馆风貌、辅助审批设计、规避设计投资风险。

六、教育：虚拟现实技术在教育领域的应用主要集中在支持学习环境创设、支持技能实训、支持语言学习、支持特殊儿童教育四个方面。

虚拟现实技术能够全方位调动学习者的视觉、听觉、触觉、嗅觉、味觉等，实现身心感受的联结，增强学习者的感受力。

虚拟现实技术在教育领域应用的潜力源于其在激发学习动机、增强学习体验、创设心理沉浸感、实现情境学习和知识迁移等方面的优势。

你是否想尝试制作VR内容呢？哪几个VR内容制作平台呢？

VR内容的快速发展，也产生众多的VR内容开发平台，首先来看一下目前国际上主流的VR内容开发平台，作为VR全景拍摄后期制作的打下基础。

国际平台：

Oculus Share

不光是出色的硬件，建立一个完整的内容生态也是VR大厂需要考虑的问题。在Oculus Rift CV1正式对消费者开售之后，Oculus Share目前已经拥有超过1000款VR应用。在应用开发方面，Oculus也有专属的SDK供开发者使用。

Steam Store & Viveport

在内容生态的建立上，凭借Steam这个全球最大的游戏平台，HTC Vive的内容生态可能是VR行业最丰富，也是最完整的一个。而Viveport，则是为HTC Vive专门开发的虚拟现实应用商店。其目的可能是为了绕过部分访问Steam受限的国家用户而准备，有了Viveport，用户就可以不受限制地下载VR应用了。

PlayStation Store

对于开发者，索尼还曾先后两次对外公开表态，都是极其高冷：

1、你们开发者最好要制作一些可以坐着玩的游戏;

2、你们开发游戏时，基准的刷新率至少得是90Hz以上。不建议中小创业者们考虑PlayStation Store。即使它看起来确实是最有吸引力的一个，但他也是竞争最强的一个。

Gear VR Store

与Oculus Rift师出同门的Gear VR，由于是三星与Oculus合作开发的产物，所以包括SDK在内，连应用商店都是在一起的。而Gear VR Store，其实就是Oculus Share下的一个分类罢了。

ENTiTi Creator

据报道，近日一家名为WakingAPP的以色列公司推出了一款名为ENTiTi Creator的工具软件，让我们这些毫无编程基础的人也能创作出VR/AR游戏！

ENTiTi是基于云计算的平台，可以在线3D视角查看内容，并自动适配各种终端，比如手机或平台电脑、三星Gear VR盒子、Vuzix智能眼镜等。该平台也适合小型企业用户，比如零售行业改变传统的产品在线展示方式，或者教育培训行业。用户使用ENTiTi平台上传图片和视频以及相应的动作指令，轻松创建AR/VR内容,比如3D图像、动画或者游戏。公司创始人Alon Melchner表示希望该平台不需要任何编程、完全依靠鼠标拖放就能完成整个创建过程。普通用户通过教程和文档在一天之内就能精通掌握该平台的使用技巧。目前这款软件已经开放下载，在APP Store中搜索就能看到。

国内平台：

HTML5 Pano（http://www.html5pano.com/）

HTML5 Pano是国内首家跨平台三维全景漫游系统开发与WebVr制作平台。只需上传全景图片或利用API，就能生成专业的跨平台三维全景漫游系统。支持多地图导航、雷达、热点，可以自定义皮肤界面和事件动作。

网展（http://www.expoon.com/）

网展：全景和虚拟现实服务平台，利用VR虚拟现实技术与全景展示技术，为用户提供360度全景，720度全景展示，全景图片制作发布，全景拍摄等功能，网展，通过VR/AR技术让互联网更真实。

房盒子（http://www.housebox.cn/）

房盒子是一个整合VR可视化设计工具、互联网选材、供应链服务三大板块于一体的线上一站式装修设计平台。该平台基于麦吵网络的技术研发实力与行业经验，完成了家装行业的深度整合，实现了随时、随地、随需的装修设计及建材家居商品销售。

宇见全景（http://www.yjpano.com/）

广州宇见信息技术有限公司全力打造的一个VR全景内容制作平台，旨在为更多VR制作爱好者提供一个在线一键生成VR全景图片，VR视频和物体环视等VR场景应用的VR全景内容制作平台。

拓灵云（http://yun.twirlingvr.com）

作为国内虚拟现实音、视频技术领先的时代拓灵正式发布全景音、视频制作平台“拓灵云”，为用户提供一站式云端VR内容制作服务。“拓灵云”就是这样一款应势而生的在线全景处理服务。随着各行业的VR转型需求以及全景从业者等对VR全景需求的不断增加，“拓灵云”基于自主研发的全景拼接引擎(TwirlingStitch Studio)结合云服务SaaS模式，帮助内容创造者解决全景视频内容制作需求。

综上所述，VR/AR技术地快速发展，迎来了VR内容的快速发展，因此也产生众多的VR内容制作开发平台。以上由笔者幻影博客为大家精心挑选的VR内容制作平台，尽管这些平台或多或少地存在一些暇龇，但是VR制作平台也需要有一个宽松地环境进行升级和迭代，伴随着大量资本涌入和众多创业者参与其中，相信未来各行各业对于VR内容制作的需求越来越旺盛，因此对于新时代的内容创作者来说无疑迎来新的挑战，选择和学习使用优秀的VR内容制作平台显得尤为重要，方可使自己在未来多变地互联网和移动互联网地双重冲击下不至于败阵下来，获得更多一展抱负的发展机会。

作为一名内容创作者来说，尽管挑战多于期待，拥有制作优秀的VR内容的技能将成为你手中的“必杀技”，还等什么呢？赶快选择优秀VR制作平台，快速提升VR制作水平。未来属于你的。

作者：幻影博客，原文网址：http://www.luozhaoyan.com/post/VR.html，如无授权，请勿直接转载；如需转载，请务必注明原文出处，非常感谢！关注幻影博客微信公众号（ID：huanyingceo），有更多精彩内容等你阅读哦！（作者QQ：27652455）

月中旬淘宝720°全景造物节H5惊艳登场戏谑了我们朋友圈一番。

如今临近双十一，果不其然出了一个横扫我们眼球的“一镜到底”H5，然后朋友圈又炸了...

>>查看案例《尽情尽兴，尽在双11》

http://tmall1111.im20.com.cn/index.html

鉴于上次我们用iH5.cn的720°全景功能，不花一分钱重制了造物节的致敬版H5，果不其然一些“热心肠”的小伙伴跑到我们后台留言：

“这次淘宝的双十一H5你们能做吗？”

“快出教程啊！急！”

嗯没错...我是用iH5的黑科技做出来了：

为了方便大众，我们快速推出了一个新功能美名为——

滑动焦距控制。

它是iH5在全景容器下新增的功能，

能轻松搭建可滑动控制的长镜头虚拟场景。

你也想玩？步骤简单粗暴只有三步：

1.准备“一镜到底”的素材

为了方便作品的演示，这里直接扒了《尽情尽兴，尽在双11》的部分素材，拼合成一个递进场景。

步骤A、先在PS拟出整个场景从内至外的层次；

步骤B、把相关的素材按照层次大概排序位置，层次1为最里层依次排开并标记素材位置，方便后序操作。

2.在iH5全景容器上搭建递进场景

步骤A、将保持不动的背景图片先置于舞台下，新建一个全景容器；

步骤B、按上述拟好的层次顺序将单个素材拖动进全景容器，并调整素材的中心距离（前后）、水平角度（环形左右）、垂直高度（上下）、水平偏移（切面左右）。

层次间的距离是通过中心点距离控制的，可以完成一层素材堆砌后，先调整观察点位置让镜头往后走，再堆砌下一层素材并调整中心距离。 如果想要把控整体层次的布局，也可以在全景容器的属性栏上调大观察点距离到2000+，调大当前垂直仰角，这样就是一个俯视的垂直视角了：

3.打开全景容器的滑动焦距控制

最后一步，也是最最最简单的一步，把全景容器属性栏下的滑动焦距控制选择为yes，打开重力感应，大功告成！ 前方效果图高能，建议有WIFI先开WIFI，土豪随意！

最后再循例做一个镜头自动拉近聚焦的效果：

把全景容器的初始观察点设大点，然后在舞台下插入一个初始化后自动聚焦的事件好了~