虛實(shí)結(jié)合，是很多人認(rèn)識(shí) AR 的第一印象，也是 XR，特別是 AR 這個(gè)概念成形的基石。

虛像和實(shí)像構(gòu)成了 XR 界面的全部組成部分，和界面體驗(yàn)直接相關(guān)。

更多XR干貨：

一、虛像

虛像，即虛擬內(nèi)容，也可以稱之位虛擬景像、虛擬畫(huà)面，它是一個(gè)組合概念，在設(shè)計(jì)的時(shí)候，我們又可以將其拆分為具體的元素。

和我們熟悉的 UI 界面設(shè)計(jì)一樣，需要思考這個(gè)界面所使用的具體元素。從元素使用的角度來(lái)說(shuō)，你如何設(shè)計(jì)一張屏幕里的 UI 界面，就如何設(shè)計(jì)一張 AR 界面，這是沒(méi)有本質(zhì)區(qū)別的。

如果將這些可以被用來(lái)設(shè)計(jì)的元素，用經(jīng)典的原子設(shè)計(jì)理論來(lái)分層，可以大致分為如下三層：

第一層：原子元素。文字、顏色、字體、分割線、特效粒子等不可分割的設(shè)計(jì)元素

第二層：分子單元。由 2D 或 3D 的第一層原子元素構(gòu)成的按鈕、標(biāo)簽、提示、列表等設(shè)計(jì)單元。

第三層：模塊組織。由第二層的設(shè)計(jì)單元組成的模塊，可以包含元素之間的位置關(guān)系，相對(duì)比例甚至交互運(yùn)動(dòng)等。

為什么要在這里引入原子設(shè)計(jì)理論？

你可能發(fā)現(xiàn)了，用原子設(shè)計(jì)分層后，AR 界面和現(xiàn)有我們熟悉的 UI 屏幕界面之間的聯(lián)系被進(jìn)一步突出出來(lái)，在沒(méi)有真實(shí)元素介入的極值下，它就是我們現(xiàn)在熟悉的屏幕 UI，設(shè)計(jì)的許多經(jīng)驗(yàn)可以復(fù)用和遷移。

你可能還發(fā)現(xiàn)了，當(dāng)我們用這個(gè)理論來(lái)看待虛擬元素后，它和 UI 元素一樣，也具備了可以被組件化和系統(tǒng)化的可能性。

組件化，即可以反復(fù)利用的設(shè)計(jì)組件，它可以將那些經(jīng)過(guò)反復(fù)驗(yàn)證，適合當(dāng)前設(shè)備 XR 界面的元素沉淀下來(lái)，隨著層級(jí)的變化，一個(gè)組件可以包含更多的元素和定義，設(shè)計(jì)師不需要再處理到每一個(gè)細(xì)小元素，可以把精力放到更整體的界面構(gòu)件上。

系統(tǒng)化，是不同的組件定義和樣式可以構(gòu)成不同的設(shè)計(jì)系統(tǒng)。這些不同的設(shè)計(jì)系統(tǒng)會(huì)形成不一樣的品牌印象感，讓用戶在 XR 的世界里能擁有豐富多彩又充滿變化的體驗(yàn)，而同時(shí)，由于它們底層設(shè)計(jì)原則的相同，又保證了一定的一致性，減少用戶在不同系統(tǒng)中轉(zhuǎn)換的適應(yīng)成本。

正如如今豐富多彩的互聯(lián)網(wǎng)世界，你并不會(huì)覺(jué)得從手機(jī)里的一個(gè)應(yīng)用，切換到另一個(gè)應(yīng)用有本質(zhì)的使用區(qū)別，甚至，得益于如今多終端適配需求的推廣，手機(jī)和電腦之間的操作，也沒(méi)有本質(zhì)區(qū)別，按鈕還是用來(lái)點(diǎn)擊的，圖片還是可以縮放的，內(nèi)容列表還是可以滑動(dòng)的……

二、實(shí)像

實(shí)像，即真實(shí)內(nèi)容，也可以稱之為真實(shí)景象，真實(shí)畫(huà)面。它也是一個(gè)組合概念，在實(shí)際設(shè)計(jì)時(shí)，也可以將其按照元素來(lái)拆分。

為什么要把實(shí)像也按照元素來(lái)拆分？

因?yàn)?XR 的虛實(shí)結(jié)合，是把虛像和實(shí)像作為整體畫(huà)面來(lái)提供給用戶的，只要這個(gè)畫(huà)面中引入了真實(shí)的景象，實(shí)像就回成為畫(huà)面的一部分，和虛像一起帶給用戶整體感知。

即使用戶在視覺(jué)感知上能清楚的區(qū)分實(shí)像和虛像，但體驗(yàn)感知上，它們終究是一起呈現(xiàn)的。

例如這張界面里體現(xiàn)的「用 XR 還原博物館里的化石」，真實(shí)的化石和虛擬的內(nèi)容一起帶給用戶“還原”的整體體驗(yàn)，若設(shè)計(jì)師拋開(kāi)這里的實(shí)物去設(shè)計(jì)，虛像就沒(méi)有了任何意義。

即使你的虛擬信息完全和真實(shí)信息無(wú)關(guān)，真實(shí)的元素也需要考慮進(jìn)去，因?yàn)閷?shí)景里的環(huán)境光線是會(huì)影響整體界面呈現(xiàn)的。

事實(shí)上，很多看似和真實(shí)環(huán)境毫不相關(guān)的虛擬元素，實(shí)像的存在也給與了虛像新的體驗(yàn)感知。

例如這個(gè)畫(huà)面里的那一簇鮮花，如果沒(méi)有實(shí)物房間的襯托，那種”這居然可以長(zhǎng)出鮮花“的新奇感就蕩然無(wú)存了，原本界面里隱含的有趣感也消失了。

既然實(shí)像也是需要設(shè)計(jì)師設(shè)計(jì)的一部分，那么按照同樣的設(shè)計(jì)手法“將實(shí)像也看做一個(gè)個(gè)設(shè)計(jì)元素”就有必要了。

甚至在后續(xù)進(jìn)行設(shè)計(jì)組件的構(gòu)造時(shí)，也可以將虛像和實(shí)像一起作為一個(gè)模塊來(lái)進(jìn)行遷移復(fù)用，降低設(shè)計(jì)成本。

三、重新組合

將虛像和實(shí)像都看做一個(gè)個(gè)可以拆分的設(shè)計(jì)元素，需要進(jìn)行重新組合，這樣的理解，可以幫助我們更好的處理 XR 畫(huà)面，或者說(shuō)，XR 場(chǎng)景。

之前我講到兩個(gè) FOV 所帶來(lái)的限制。

兩個(gè) FOV，一個(gè)是人眼可以看到的范圍，一個(gè)是設(shè)備可以顯示的范圍。

實(shí)像，就是人眼 FOV 所看到的，即使使用 VST 方案，用攝像頭代替人眼去觀察真實(shí)的世界，也不會(huì)改變我們?cè)杏萌搜?FOV 看到世界的記憶。

虛像，就是設(shè)備可以提供的顯示內(nèi)容，無(wú)論在 VST 還是 OST 顯示方案里，它都是由技術(shù)所創(chuàng)造的，可以顯示的范圍被框定在技術(shù)現(xiàn)有可以達(dá)到的條件中。

最終用戶所見(jiàn)的 XR 場(chǎng)景，是這兩個(gè) FOV 合成的畫(huà)面。

對(duì)于設(shè)計(jì)師來(lái)說(shuō)，設(shè)計(jì)的落腳點(diǎn)只能是虛擬的設(shè)計(jì)元素，這毋庸置疑。但拋開(kāi) VR 這種實(shí)像介入為 0 的極值情況，我們要設(shè)計(jì)的，是用戶最終看見(jiàn)的虛實(shí)結(jié)合后的 XR 場(chǎng)景，它代表著背后兩個(gè) FOV 的合成。

更進(jìn)一步講，虛像和實(shí)像的合成，其實(shí)是技術(shù)能力和人的感知能力之間的碰撞。

技術(shù)人員，通過(guò)對(duì)相關(guān)技術(shù)的研究來(lái)調(diào)和這個(gè)碰撞，而體驗(yàn)設(shè)計(jì)師，通過(guò)對(duì)虛像和實(shí)像的處理來(lái)調(diào)和這個(gè)碰撞。

歡迎關(guān)注作者微信公眾號(hào)：「林間有影落」