合肥城中村全景截圖（點擊查看全景）
?、為什么想起制作全景地圖 ？
最近兩個?來，?劇?直在利?業(yè)余時間拍攝『合肥城中村』系列主題全景。到?前為?已經(jīng)拍攝了14個場景，覆蓋16個村落，并且這個計劃仍然在進?中。
因為這些城中村零散地分布在合肥的各個?落，簡單的羅列場景顯得格外單調(diào)，因此需要?個?較直觀的組織?式來呈現(xiàn)。
此前設想過通過720云的沙盤功能，實際設計時發(fā)現(xiàn)過多的場景在沙盤下效果并不是很理想。
恰好這個時候720云官?推薦了『安徽池州VR全景地圖』這樣?幅富有創(chuàng)意的作品。
這個作品有意思的點在于，它在?份航拍全景?平?向上，均勻放置了四個地圖，并且在地圖上?熱點鏈接其他各個作品。
基于這份作品，?劇發(fā)現(xiàn)借助于地圖可以很好的將各個零散的全景聯(lián)系起來，起到總覽的作?。
?、分析實現(xiàn)?案
決定了要在『合肥城中村』全景作品中，增加獨?的地圖總覽場景后，接下來就該探索實現(xiàn)?式了。經(jīng)過?番思考，再結(jié)合之前的經(jīng)驗，發(fā)現(xiàn)有兩種?案可以采?。
第?種是直接把地圖?件當成圖?素材，嵌?到場景中，具體的操作路徑如下：
這種?法雖好，但是因為地圖是獨?的?件，與場景相分離，所以在?戶打開場景的時候，地圖會滯后加載。浪費流量資源，引起加載時?過久的問題。
針對這個問題就有了第?個?案來實現(xiàn)，就是直接將地圖繪制在全景圖上，這樣?來對加載時?就沒有了影響。
我們來簡單對?下這兩個?式的優(yōu)缺點：
1、圖?嵌?
優(yōu)點：簡單，單獨設計場景和地圖，?需考慮拼合的問題
缺點：浪費觀看者流量，加載相對較慢
2、全景原圖繪制
優(yōu)點：加載時?沒有影響，?戶觀感較好
缺點：每次更新需要重新上傳全景，發(fā)布時間較?
通過對?可以看出來，第?種圖?嵌?的?案，對全景制作者較為友好，在終端?戶側(cè)略微有所影響。第?種全景原圖繪制的?案的優(yōu)勢都是針對?戶的，但是需要制作者多花些?思。
出于【折騰??，?便?家】的?理，很?然的就選擇了全景原圖繪制的?案。
三、動?設計
?案已經(jīng)確定好了，接下來就是動?設計了。
3.1、草圖設計
前?提到的『安徽池州VR全景地圖』雖然很有創(chuàng)意，但?劇還是想在上?增加點設計感，豐富下內(nèi)容組成。
收集了多幅 VR 界?設計案例、整理了城中村項?相關的介紹后，設計了如下的草圖。
3.2、畫?失焦處理
在參考了其他優(yōu)秀的 VR 界?設計案例后發(fā)現(xiàn)，為了區(qū)分界?與場景，都會將環(huán)境做失焦處理。這樣處理后畫?主體更清晰，觀感更舒服，也更符合?眼觀察世界的感受。
這?步操作的是 2:1 的球?模型圖，因此你需要提前準備?個場景相對開闊的作品作為背景。簡單處理的話，直接使? PS 的?斯模糊即可。但是?斯模糊算法需要和相鄰像素做計算，所以處理完之后畫?左右會因為?差產(chǎn)?接縫，因?并不能簡單的?步完成。
這?簡單說下我的處理?式：
第?步：使? PS 打開 2:1 的球?模型圖，并復制?層
第?步：將上層圖層?平位移 4000 像素（原圖寬度?半左右即可，這?以 4000 為例）
第三步：將上下層執(zhí)?同樣數(shù)值的?斯模糊（??覺得舒服就?）
第四步：將上層圖層位移 -4000 像素
第五步：你會發(fā)現(xiàn)畫?右側(cè) 4000 像素處會有?條明顯的接縫，借助蒙版消除，合并圖層
通過這?通騷操作，全景畫?即實現(xiàn)了失焦效果，并且不存在垂直接縫。
3.3、轉(zhuǎn)換為六?體模型
地圖繪制的時候需要注意?個問題，那就是我們只能在六?體模型上進?繪制，?不能直接在 2:1 的球?模型圖上操作，通過下圖就能看出差異在哪?。
因為球?模型本身內(nèi)容并?橫平豎直，所以直接繪制出的效果，在預覽的時候會出像各種扭曲，因此并不推薦。
關于球?模型轉(zhuǎn)六?體模型有很多種?法，這?只說下我使?的?法。
Krpano 有很多實?的?具，其中?個是 Convert SPHERE to CUBE droplet，也就是實現(xiàn) 2:1 球?模型轉(zhuǎn)換為六?體模型的?具，拖放 2:1 的球?模型圖?件到這個腳本上，等待數(shù)秒即可完成轉(zhuǎn)換。
觀察六?體模型我們會發(fā)現(xiàn)，3.2 步驟?的失焦處理并不完美，在頂?、底?的中?點位置存在明顯的瑕疵，所以我們需要復制?層補充上?斯模糊，配合蒙版將菊花狀的瑕疵消除掉。
3.4、界?結(jié)構(gòu)繪制
按照前?草圖設計，只需要在??體的?個?繪制界?即可，很顯然我們選擇的是正前?的?，也就是_f 結(jié)尾的?件。
再看?遍草圖設計，我們來進?框架設計。
框架設計這?步很簡單，??就是拖拽?條參考線，畫?個框框?已。最重要的還是前期的草圖階段，你要預先想好整體框架布局，各個模塊放置哪些元素，做到??有數(shù)。
需要注意的是，六?體模型的任意?個?，?平、垂直?向的視野都是 90 度。??單眼的舒適視域僅為60度，所以在繪制的時候不要把畫?鋪得過滿，避免影響觀感。
四、地圖繪制
如果你直接使?百度、?德等地圖的截圖，地圖繪制這?步可以省略。
但是常規(guī)的地圖界??般會包含太多?關的細節(jié)，畫??擾因素太多，很難突出主體，因此如果您對PS、AI 等圖像繪制軟件操作熟練的話，建議地圖還是由??繪制。
4.1、創(chuàng)建獨?的地圖?件
地圖繪制?作量較?，后期更改的頻率較?，因此不建議在第三步的?件?直接操作。
根據(jù) 3.4 步?地圖所占區(qū)域??創(chuàng)建地圖?件。
4.2、截取衛(wèi)星地圖
這?步是為了獲取地圖基礎框架的，同時在我這個例?也是為了展示城中村的衛(wèi)星畫?所?。
過程很簡單，只需要注意兩點即可：
1、使?衛(wèi)星地球模式，去除路?，以得到較為?凈的衛(wèi)星畫?
2、根據(jù)?件??，選擇合適的地圖縮放?例，以獲得較為清晰的畫?，必要的話可以多次截取，再拼合
4.3、勾勒出?標區(qū)域
這?步是為了將全景在地圖上對應的區(qū)域勾選出來，蒙版是最好的選擇。
為了操作?便，建議將地圖復制?層，下層降低透明度做參考。
4.4、繪制道路
道路的繪制盡量貼合真實路徑，需要的話在保證?向、?例?體相符的前提下，可以做適當調(diào)整。
為了幫助?戶觀看地圖時快速定位，畫??的?架橋、快速路等主?道?定要標注清楚。和全景場景相交叉、臨近的道路盡可能還原。其他的?些?路可以忽略不畫。
最后再標注上路名，地圖就算繪制完成。
路名標注時沒必要在每?段道路上都寫上路名，但是在場景附近盡可能標注完整，避免引起?戶觀看時不必要的困擾。
最后再把地圖復制粘貼到第三步?的所在區(qū)域，繪制?作就算完成了。
五、作品配置
經(jīng)過前?的設計、繪制，地圖全景就已經(jīng)準備好了。
因為 720 云?持直接上傳六?體模型的場景，因此我們就不需要再將六?體模型轉(zhuǎn)換回 2:1 的球?模型。
后續(xù)的步驟相信?家都?較熟悉了，這?提?個需要注意的點。
5.1、視?設置
?定要避免調(diào)整設置初始視??向，因為全景界?的地圖是在正前?繪制的，720云默認的視?也是在正前?，因此初始視?就是最合適的視?。
FOV 建議設置為 10、100、120
最? FOV 決定了畫?的放?極限，為了?戶能看清地圖上的細節(jié)，建議最? FOV 設置在 10 - 20 這個范圍內(nèi)。
100 是初始 FOV，可以保證?戶在 PC 或?機橫屏的時候可以完整看到地圖界?。120 倒不重要，不?解釋。
5.2、添加熱點
從結(jié)構(gòu)上來看地圖所在場景類似于?站的??，??可以通往各個??，每個??也需要能夠順利地回到??。所以添加熱點這部分?作共有兩部分。
?部分是需要在地圖上，逐個鏈接?各個場景。
另?部分則是，在每個場景內(nèi)同樣設置鏈接，確保能夠回到地圖的場景。
5.3、場景順序調(diào)整
前?提到，地圖的作?類似于?站的??，如果?戶第?次打開作品時展示的是地圖場景，效果肯定會更好。
所以建議把地圖場景調(diào)整到最前?，以獲得最佳的效果。
六、相關分享
此次全景地圖的探索?致就是這些，以上全部內(nèi)容只是『合肥城中村』全景作品創(chuàng)作過程中的?些嘗試?已，并沒有?較深?的研究，僅供?家參考。獻丑了！
6.1、相關?具
Krpano：?款強?的全景圖漫游制作引擎
Photoshop：不?解釋，你懂的
720云：專業(yè)的全景平臺https://720yun.com
6.2、相關鏈接
拍攝計劃表
合肥城中村作品
安徽池州VR全景地圖
