作者丨Mike Wolfson

譯者丨李睿

策劃丨云昭

審校丨徐杰承

設(shè)計(jì)系統(tǒng)使開(kāi)發(fā)人員和設(shè)計(jì)人員能夠快速開(kāi)發(fā)在所有平臺(tái)上都能保持一致的產(chǎn)品，并可以將現(xiàn)有的設(shè)計(jì)標(biāo)準(zhǔn)直接應(yīng)用于元宇宙。但是許多概念對(duì)于 3D 環(huán)境來(lái)說(shuō)是獨(dú)特的，需要重新定義。

在開(kāi)發(fā)過(guò)程和設(shè)計(jì)方面具有豐富經(jīng)驗(yàn)的 Android 開(kāi)發(fā)專(zhuān)家 Mike Wolfson 為支持混合數(shù)字工作空間(包括 VR 環(huán)境)的企業(yè)提供了很多建議。他表示，團(tuán)隊(duì)通過(guò)擴(kuò)展他們?cè)?2D 設(shè)計(jì)系統(tǒng)中建立的原則，有效提升了構(gòu)建平臺(tái)時(shí)的研發(fā)效率。

頂層考慮?

Wolfson 指出，2D 和 3D 體驗(yàn)都受益于遵循基于基本設(shè)計(jì)原則的規(guī)范。這些規(guī)范引導(dǎo)產(chǎn)品設(shè)計(jì)和開(kāi)發(fā)朝著一致而積極的用戶體驗(yàn)發(fā)展，并防止過(guò)度定制。

標(biāo)準(zhǔn)規(guī)范是指導(dǎo)方針，而不是嚴(yán)格的要求，因此現(xiàn)有標(biāo)準(zhǔn)有時(shí)不符合需求，這是可以預(yù)料的。在需要時(shí)允許例外情況，而且至關(guān)重要的是，需要確保清楚地記錄例外情況，以便相關(guān)人員都能理解為什么要進(jìn)行更改。

Wolfson 表示，元宇宙標(biāo)準(zhǔn)建立在基本設(shè)計(jì)原則之上，以確保這些體驗(yàn)?zāi)軌蚺c現(xiàn)有產(chǎn)品良好集成。因此，網(wǎng)絡(luò)、移動(dòng)和印刷體驗(yàn)都是使用相同的基本設(shè)計(jì)語(yǔ)言開(kāi)發(fā)的。

存在感?

設(shè)計(jì)良好的元宇宙體驗(yàn)的目標(biāo)是確保運(yùn)行環(huán)境感覺(jué)自然，用戶在空間中感到舒適，并且用戶能夠有意義地體驗(yàn)內(nèi)容(而不是逃避現(xiàn)實(shí)世界來(lái)處理導(dǎo)航或視覺(jué)干擾)。而在 VR 中用于感覺(jué)身臨其境的術(shù)語(yǔ)是“存在”(Presence)，這個(gè)術(shù)語(yǔ)最初是在梅爾·斯萊特的存在理論中創(chuàng)造的。

正如馬克·扎克伯格在去年一次新聞發(fā)布會(huì)所言：“元宇宙的決定性品質(zhì)是存在，也就是你真的和其他人一起在另一個(gè)地方的感覺(jué)。創(chuàng)造、化身和數(shù)字對(duì)象將成為我們表達(dá)自己的核心，這將帶來(lái)全新的體驗(yàn)和經(jīng)濟(jì)機(jī)會(huì)?！?/p>

Wolfson 說(shuō)，團(tuán)隊(duì)與元宇宙相關(guān)的設(shè)計(jì)規(guī)范的目標(biāo)是建立模式以確保用戶感到舒適，并能夠以自然的方式與內(nèi)容交互。Wolfson 表示可以使用設(shè)計(jì)規(guī)范來(lái)實(shí)現(xiàn)自我體現(xiàn)的錯(cuò)覺(jué)，并建立強(qiáng)制物理交互錯(cuò)覺(jué)的交互模式。

哪些 2D 規(guī)范可以直接沿用??

Wolfson 發(fā)現(xiàn)，許多傳統(tǒng)設(shè)計(jì)標(biāo)準(zhǔn)可以直接應(yīng)用于 3D 環(huán)境。畢竟，元宇宙仍然是一個(gè)由代碼構(gòu)建的可視化媒介，必須由開(kāi)發(fā)人員實(shí)現(xiàn)。

(1)設(shè)計(jì)令牌

Wolfson 表示，其團(tuán)隊(duì)為各種顏色、尺寸和排版規(guī)范創(chuàng)建了一致的、可讀的設(shè)計(jì)標(biāo)記，這使得設(shè)計(jì)和開(kāi)發(fā)過(guò)程更加簡(jiǎn)單。因?yàn)槭褂玫臉?biāo)準(zhǔn)令牌數(shù)量有限，這些令牌很快成為其設(shè)計(jì)模型中使用的語(yǔ)言，使其團(tuán)隊(duì)能夠使用一致的語(yǔ)言進(jìn)行交流。

通過(guò)確保設(shè)計(jì)規(guī)范都使用相同的語(yǔ)義名稱(chēng)，他們降低了引入自定義值的可能性。

YES: AccentColor, SideMargin, Headline4
NO: #bada55, 16px, Montserrat/14px/Bold

(2)顏色

Wolfson 并不支持使用光譜中的每種顏色;與其相反，他們團(tuán)隊(duì)定義了一個(gè)具有更便于管理的、數(shù)量有限的調(diào)色板，僅使用與特定令牌相關(guān)的幾個(gè)選項(xiàng)。

在他們支持的式相平臺(tái)上，使用有限數(shù)量的品牌特定顏色可以帶來(lái)一致的美感。這確保了元宇宙體驗(yàn)與 2D 或印刷媒體品牌相匹配。

由于顏色集中且一致，可以輕松地將它們切換為品牌重塑。這種控制有助于保持應(yīng)用程序的訪問(wèn)，因?yàn)榭梢源_保每種顏色都能滿足最低對(duì)比度的要求。

然而 Wolfson 發(fā)現(xiàn)，他們用于 2D 設(shè)計(jì)的有限顏色范圍并不一定能轉(zhuǎn)化為沉浸式空間。由于元宇宙的空間涉及亮度，并吸引用戶直觀地掌握周?chē)h(huán)境的深度。因此需要為沉浸式環(huán)境支持更廣泛的顏色。

調(diào)色板的選擇需要考慮到空間的意圖和氛圍。對(duì)于 3D 空間，他們使用設(shè)計(jì)系統(tǒng)中指定的基本顏色，但允許設(shè)計(jì)師調(diào)整其亮度或飽和度，以保持整體美學(xué)并與品牌一致。

沉浸式環(huán)境中的照明會(huì)營(yíng)造氛圍，因此他們?cè)O(shè)置了最小和最大亮度級(jí)別來(lái)管理這一點(diǎn)。亮度會(huì)影響文本的易讀性和應(yīng)用程序的整體可訪問(wèn)性，因此需要密切關(guān)注它。在突出某些內(nèi)容時(shí)，他們使用了較短范圍的柔和和刺眼的對(duì)比色和互補(bǔ)色，以形成強(qiáng)烈的焦點(diǎn)。

(3)排版

創(chuàng)建少量排版樣式的 2D 優(yōu)勢(shì)，可以直接在元宇宙里沿用，他們沒(méi)有進(jìn)行任何更改。這并沒(méi)有直接影響存在感，而且使開(kāi)發(fā)過(guò)程更加簡(jiǎn)單。

(4)間距

重要的是要用一個(gè)令人難忘的參數(shù)來(lái)設(shè)定空間系統(tǒng)的范圍，并記錄對(duì)其使用方式的明確期望。這使得其布局與網(wǎng)格對(duì)齊，這在視覺(jué)上讓用戶感到愉悅。

他們使用了 Base8 系統(tǒng)(允許其尺寸可被 8 整除)。使用這個(gè)系統(tǒng)是因?yàn)榭梢耘c許多瀏覽器的 16 像素(8×2)基本字體大小相匹配，并且因?yàn)樵S多流行的屏幕尺寸在一個(gè)軸上可以被 8 整除。

Base8 測(cè)量值始終可以被 2 整除，因此避免了在 Base5 系統(tǒng)中導(dǎo)致 0.5 像素偏移的縮放問(wèn)題。偏移量為 0.5px 的像素將顯示由于其應(yīng)對(duì)鋸齒而模糊的邊緣。

嵌入式資源(視頻和圖像)的標(biāo)準(zhǔn)?

在創(chuàng)建元宇宙環(huán)境時(shí)，用戶往往希望媒體形狀不規(guī)則，以適應(yīng)形狀奇特的空間。因此需要努力調(diào)整 3D 空間以適應(yīng)形狀獨(dú)特的媒體。標(biāo)準(zhǔn)化媒體尺寸簡(jiǎn)化了設(shè)計(jì)，因此不會(huì)試圖將無(wú)限數(shù)量的形狀融入 3D 環(huán)境。

限制這一點(diǎn)的最簡(jiǎn)單方法是定義有限的幾種縱橫比：

• 9:16(16:9)
• 3:4(4:3)
• 1:1

這樣可以確保所有媒體都適合這些有限格式之一，就不再需要調(diào)整環(huán)境來(lái)適應(yīng)各種尺寸的媒體，既簡(jiǎn)化了實(shí)施，又避免了不必要的返工。

元宇宙設(shè)計(jì)有哪些獨(dú)特的規(guī)格??

Wolfson 發(fā)現(xiàn)了各種用于幫助建立用戶在虛擬世界中的存在的設(shè)計(jì)類(lèi)別。本節(jié)將介紹確定的主要類(lèi)別。

(1)動(dòng)畫(huà)

動(dòng)畫(huà)必須遵循物理規(guī)律，并以自然的方式運(yùn)動(dòng)。這意味著物體不會(huì)線性移動(dòng)，但這在人眼看來(lái)是不自然的。

在其他媒體中使用的相同動(dòng)畫(huà)原理在元宇宙設(shè)計(jì)中同樣重要，且所有動(dòng)畫(huà)都必須使用正確持續(xù)時(shí)間的緩動(dòng)曲線(通常為 200 毫秒～500 毫秒)。

在元宇宙中，用戶對(duì)非自然物理的看法比他們?cè)诰W(wǎng)絡(luò)媒體中的負(fù)面看法要大得多。

(2)聲音

在元宇宙環(huán)境中，有效地使用音頻是用戶體驗(yàn)的關(guān)鍵部分。

• 空間

空間音頻對(duì)用戶在空間中的位置有所反應(yīng)。簡(jiǎn)而言之，音量是距離的函數(shù)。這意味著用戶距離內(nèi)容面板或其他用戶越近，音量就越高。

為用戶提供方向感的一種有效方法是從一個(gè)方向發(fā)出更大的聲音。舉個(gè)例子：如果你的朋友站在你左邊說(shuō)話，你的左耳聽(tīng)到的聲音會(huì)比你的右耳稍大一點(diǎn)，也會(huì)更快一些。而缺乏良好的空間音頻會(huì)使環(huán)境音效感覺(jué)平淡。

定義這個(gè)細(xì)節(jié)是相當(dāng)復(fù)雜的。例如，為了獲得良好的 360 度音效，需要考慮空間的形狀，并根據(jù)其形狀“反射”聲音。

• 環(huán)境音頻

這是一種在整個(gè)體驗(yàn)過(guò)程中安靜地播放的聲音，以建立和強(qiáng)化情緒。顧名思義，它應(yīng)該增強(qiáng)氛圍，而不是分散整體體驗(yàn)。當(dāng)沒(méi)有其他反饋時(shí)，環(huán)境音頻可以幫助避免不自然的沉默。

Wolfson 發(fā)現(xiàn)，對(duì)于環(huán)境音頻，最好逐漸淡入。當(dāng)用戶希望靜音時(shí)，音頻需要立即調(diào)整成靜音。為了避免影響其他大音量的音頻聽(tīng)感，在播放其他媒體時(shí)，應(yīng)該將環(huán)境音頻進(jìn)行靜音。

• 音頻反饋

使用聲音觸發(fā)器在沉浸式環(huán)境中引導(dǎo)用戶。例如，當(dāng)用戶關(guān)上一扇門(mén)時(shí)，會(huì)播放確認(rèn)聲音以向他們提供另一個(gè)級(jí)別的反饋。這種類(lèi)型的反饋通常比 2D 設(shè)計(jì)中使用的視覺(jué)方法更好。

(3)化身

用戶在虛擬空間中的表現(xiàn)方式直接影響他們的存在。當(dāng)化身可以成功模仿他們真實(shí)世界的動(dòng)作時(shí)，體驗(yàn)會(huì)變得更好。當(dāng)動(dòng)作真實(shí)而直觀地強(qiáng)化了這種至關(guān)重要的存在感時(shí)，用戶會(huì)感覺(jué)更像化身。

讓化身成功模仿現(xiàn)實(shí)世界的交互非常困難，如果做得不正確，它會(huì)讓用戶感到沮喪，并讓他們失去良好體驗(yàn)。糟糕的數(shù)字表現(xiàn)可能會(huì)讓用戶感到不安。

如果沒(méi)有完全具有代表性的化身，一個(gè)很好的折衷辦法是使用小型視頻或圖像。這是對(duì)用戶在視頻會(huì)議中代表自己方式的自然而舒適的擴(kuò)展?？梢圆捎弥甘疚恢没蜢o音狀態(tài)的信息徽章裝飾個(gè)人資料圖像。

(4)控制和導(dǎo)航

當(dāng)開(kāi)始討論攝像頭控制和導(dǎo)航時(shí)，人們很快意識(shí)到這是一個(gè)極其復(fù)雜的主題。 需要定義以下細(xì)節(jié)：

• 攝像頭視角

Wolfson 表示，他們需要定義元宇宙將支持哪些攝像頭視角。這可能在第一人稱(chēng)視角、第三人稱(chēng) / 玩具屋視角或 2D 世界地圖之間有所不同。這些觀點(diǎn)中的每一個(gè)都需要大量詳細(xì)的描述。

• 控制布局

需要定義用戶如何控制攝像頭及其在環(huán)境中的移動(dòng)。

Wolfson 團(tuán)隊(duì)很快了解到擁有直觀的控件很重要，發(fā)現(xiàn)有許多不同的控制機(jī)制，并且“最佳”方式在用戶之間存在很大差異。

例如，他們支持標(biāo)準(zhǔn)的 WASD 鍵盤(pán)命令，但一些用戶更喜歡使用箭頭鍵或鼠標(biāo)移動(dòng)。這些規(guī)范更加復(fù)雜，因?yàn)椴荒芤蕾?lài)訪問(wèn)某些控件的用戶。例如當(dāng)鍵盤(pán)不可用時(shí)，移動(dòng)設(shè)備需要采用虛擬操縱桿。

• 運(yùn)動(dòng)和導(dǎo)航

運(yùn)動(dòng)和導(dǎo)航對(duì)于確保積極的用戶體驗(yàn)非常重要。他們可以輕松移動(dòng)以及在移動(dòng)時(shí)模擬運(yùn)動(dòng)，這對(duì)于避免眩暈至關(guān)重要。

• 最小距離

他們需要考慮用戶在環(huán)境中移動(dòng)是多么容易。如果只是從房間的一側(cè)走到另一側(cè)，這很乏味，也會(huì)讓用戶感到沮喪。他們定義了房間之間的最大距離，并優(yōu)先考慮用戶如何在環(huán)境中移動(dòng)以最小化行進(jìn)距離。

經(jīng)驗(yàn)總結(jié)?

Wolfson 在為元宇宙調(diào)整設(shè)計(jì)系統(tǒng)時(shí)，團(tuán)隊(duì)了解到原有的傳統(tǒng)開(kāi)發(fā)規(guī)范具有普適性，并將其直接繼承沿用在 3D 設(shè)計(jì)和開(kāi)發(fā)中。這并不奇怪，因?yàn)槭褂玫氖墙?jīng)過(guò)充分研究的既定設(shè)計(jì)模式，所以希望它們能夠很好地沿用。

他們發(fā)現(xiàn)了許多方法來(lái)幫助用戶提升自然“存在感”，并且使用標(biāo)準(zhǔn)來(lái)建立模式以確保的用戶獲得積極的體驗(yàn)。另外，在為元宇宙設(shè)計(jì)體驗(yàn)時(shí)，對(duì)用戶有同理心是非常重要的，這對(duì)于針對(duì)該平臺(tái)的產(chǎn)品成功應(yīng)用至關(guān)重要。

寫(xiě)在最后?

對(duì)于元宇宙，各大巨頭都有自己的判斷——

Meta CEO 馬克·扎克伯格說(shuō)，“你可以把元宇宙看作是一個(gè)具身性的互聯(lián)網(wǎng)。在這里，你不再瀏覽內(nèi)容——而是在內(nèi)容中?！?/p>

微軟 CEO 納德拉則提到，“隨著虛擬世界和物理世界的融合，由數(shù)字孿生、模擬環(huán)境和混合現(xiàn)實(shí)組成的元宇宙正在成為一流的平臺(tái)。通過(guò)元宇宙，整個(gè)世界都將成為應(yīng)用畫(huà)布?！?/p>

然而，于開(kāi)發(fā)者而言，任何新事物的出現(xiàn)，必將衍生出新的設(shè)計(jì)原則和規(guī)范。在元宇宙設(shè)計(jì)和開(kāi)發(fā)過(guò)程中，如何去借鑒已有的模式，如何建立元宇宙獨(dú)有的規(guī)則，是擺在開(kāi)發(fā)者面前的一大課題。

關(guān)于元宇宙的搭建各位有什么看法呢?歡迎大家掃描下方海報(bào)二維碼添加 51CTO 小助手，加入我們讀者群和大家共同探討，獲取更多技術(shù)話題資訊，更有機(jī)會(huì)抽取大會(huì)免費(fèi)門(mén)票

原文鏈接：

??https://stackoverflow.blog/2021/11/08/adapting-a-design-system-to-work-for-the-metaverse/??