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，土豪隨意！

最后再循例做一個鏡頭自動拉近聚焦的效果：

把全景容器的初始觀察點設大點，然后在舞臺下插入一個初始化后自動聚焦的事件好了~