“元宇宙”項目中色彩搭配步驟與解析

盧中琦/上海東方傳媒技術有限公司

在過去的幾年中，新冠病毒的反復爆發給人們平素習以為常的社會活動帶來新的挑戰。隨著諸如虛擬現實、區塊鏈、云計算、以及5G 技術的成熟與提升，一個構建可以映射于現實社會的被稱為“元宇宙”的網絡社會概念被科幻小說中重新創造了出來并被付諸實施。作為會務方面工作的從業人員，為解決線下會議人員聚集帶來的不良影響，同時給傳統會議增添身臨其境的線上體驗感，一款顛覆傳統會議模式的“虛擬云會場”孕育而生。但是如何將傳統的色彩搭配應用于元宇宙的構建中成了一個切實需要解決的問題。

1 分析“元宇宙”配色問題與難點

如果把這些現行色彩搭配規則用于“元宇宙”項目的創建中，我們首先要了解“元宇宙”這個虛擬社會與現實社會的異同。根據清華大學發布的《2020-2021 年元宇宙發展報告》給出的元宇宙定義：“元宇宙”是整合多種新技術而產生的新型虛實相融的互聯網應用和社會形態，它基于擴展現實技術提供沉浸式體驗，基于數字孿生技術生成現實世界的鏡像，基于區塊鏈技術搭建經濟體系，將虛擬世界與現實世界在經濟系統、社交系統、身份系統上密切融合，并且允許每個用戶進行內容生產和世界編輯[1]。基于近來各相關研究人士對“元宇宙”相關闡述，不難看出“元宇宙”與傳統互聯網有兩大不同。第一是“元宇宙”是脫胎于真實世界可視化但又不拘泥于現實世界的虛擬世界總和。第二是比起傳統互聯網，“元宇宙”更強調用戶與虛擬世界的互動乃至整個虛擬的社會性。用戶在“元宇宙”中不是簡單地體驗它而是創造出一種身臨其境的體驗，更有甚者有些用戶可以影響它本身的進程。

但無論哪一類的產品，功能和收益都是人們追求的共有特性。隨著人們不斷對設計和美學的需求出現，色彩設計結合了商家對自身產品的解析與理念貫穿整個產品之中。色彩成為產品標簽，成為傳遞精神理念的象征甚至成為區分性別的方式。久而久之，優秀的色彩搭配與色彩定位成為產品無聲的品牌形象。一個好的色彩搭配設計能喚醒人們對產品的共鳴。當代心理學認為人們在看到某些顏色時，色彩對人們的大腦或者潛意識都會產生重要的作用。諸如看到藍色和紅色會引起冷和暖感、看到深色和淡色會產生重輕感、甚至牢固和脆弱等感覺，而由此感覺轉而產生出情感，如愉悅的、樸實的或是迷茫的，或令人振奮的。隨后伴隨這些情感的則是一些直覺的意念，稱為反射效應。縱觀中西方色彩歷史與色彩文化，色彩的象征性、象征性、儀式性和肖像化，在整個文化、藝術乃至于社會發展進程中都起著相當大的重要性。基于此，對于色彩設計而言，美學、印象、功能、風格、情緒必不可少，整體色相與色調為我們提供了功能化、信號化或是有價值的含義，我們需要審慎地使用它們作為指導方針，以及它們如何作為評估標準為我們所用。所以如何通過色彩搭配提高用戶觀賞感尤為重要。

基于上述的觀點，我認為“元宇宙”色彩設計大致要遵循兩個要點。第一“元宇宙”既然脫胎于實體世界，所以依然必須遵循實體世界對色彩及美感的普遍認同。第二在遵循一般美學認同的基礎上，“元宇宙”項目設計還應該融入科技風格元素以加強用戶的沉浸感。一個好的“元宇宙”配色方案不僅應該能讓用戶很快上手將自己置入虛擬環境，更要鼓勵用戶與產品之間互通交流，甚至可以讓產品通過用戶的影響對其做出細節上的裂變。

2 “元宇宙”項目的配色經驗與解析

SMT 壹會展采用3D 引擎全新開發云會場APP 移動版，融入了當前領先的低延時直播流、云會場幀同步技術、線上同傳技術，呈現出夢幻般的科技風格應用界面。虛擬會場為用戶提供沉浸式交互直播體驗，觀眾化身虛擬形象參與到虛擬會場觀看實景直播，支持與其他虛擬觀眾聊天，鼓掌、點贊、等實時互動，最大程度地提升用戶體驗。

在此前提下，SMT 壹會展設計團隊通過APP 運行期間客戶反饋和設計團隊的不斷調整與提煉，為壹會展APP 所用色彩搭配進行了全新的調整。作者也有幸參與到這個APP 的色彩設計工作中，所以在此嘗試提出一些“元宇宙”虛擬環境色彩設計的一些思路。

2.1 色相選擇與色彩設計

作為一個以展現最新虛擬技術同時又需兼顧實體會議需求的APP，客戶提出了“科技讓會展更有趣”的產品理念。故在原先的色彩設計中，設計團隊以“科技”為主要點，提出的色彩設計方案采用的色彩印象詞：

固有印象——科技、高端、互動、新技術、金屬感

擴展印象——思維的、自我意識、人性化、貼近人文生活的最初因客戶受“元宇宙”等新概念的影響提出的色彩概念要體現出“宇宙”與“科技”感，故在第一版的色彩搭配中，設計團隊提出使用銀灰色及藍色為主要色相。考慮到在色彩搭配中常以銀灰色來體現產品或實物的科技感，所以設計團隊最后選用了藍色調作為主色相與主色調。在搭配中使用深銀色和淺銀色作為輔助配色（圖1）。在整體搭配變化中多以較為平緩的漸變搭配及類似搭配手法，少有對比及強調。整體色彩設計搭配有較強的科技感。但在APP 后期使用過程中，我們發現整體畫面色調偏灰暗，雖然體現出了宇宙的深邃感，但過于壓抑的色彩氣氛不僅不能體現出科技帶來的新氣象或者新生活，同時也缺少人文感和一種積極向上的精神氣氛。

圖1 APP第一版色彩設計圖及色彩設計方案

于是，設計團隊進行色彩調整，最后建議在原有的色彩理念的基礎上調整了藍色及灰色的明度與純度，讓整體畫面明亮起來。但在后期的使用及測試過程中，設計團隊感覺到，整體畫面相對于前一稿突出了科技感的同時，缺少了色彩的指向性與引導作用，讓整體畫面沒有層次與主次之分。此外大片青藍色調的物體景色疊加到一起，畫面冷冰冰，缺少活力（圖2）。

圖2 APP第二版色彩設計圖及色彩設計方案

基于以上2 種色彩搭配，我們發現在進行APP 畫面色彩搭配時為了體現“元宇宙”和“科技元素”卻把色彩搭配走進配色誤區：在前二版的色彩搭配中雖以藍色與灰色為主色，這一色彩方案選擇的確體現出了科技和技術感，但藍色與灰色由于選取色相偏冷，色調整體偏深，并且輔色與點綴色和強調色少用不用暖色調，故會場整體畫面展現出冰冷感，由于色調偏深，灰色使用面積過大，讓畫面在深邃神秘的同時帶有迷茫，未知，不確定的壓抑感。雖然整體畫面在接下來的設計中有所提升，增加了亮度，但科技的冰冷感并沒有消除。這和我們之前提出的“科技讓會展更有趣”的理念不符。

此后，設計團隊與客戶展開“頭腦風暴”通過查詢市面上與“科技”“人工智能”有關的信息，包括電影、游戲等產品進行色彩分析并發現，目前市面上對科技色彩的分類基本有兩種：技術科技和智能科技。技術科技的配色一般體現高科技的技術產品，色彩表現以藍、灰、銀為主。而智能科技感配色一般展示的是人類對高科技技術下帶來的思考，色彩表現也多種多樣。

在此前提下，色彩設計團隊在不斷嘗試色彩調整，提出了全新的色彩搭配方案。在客戶提出的“科技讓會展更有趣”的理念不變的前提下，我們調整色彩搭配印象詞，由原先的“科技、高端、互動、新技術、金屬感”調整成“科技、人工智能、智慧”并將“智能”一詞提煉出來，成為APP 色彩搭配的主要關鍵詞。

2.2 設計團隊提出全新的色彩搭配方案

（1）搭配主題聯想：智能

智能感包含了科技與人類智慧，整體色相偏中性，暖色調。增加了如黃、橙等暖色作為搭配色。也可增加整體畫面的對比度與色彩指向性。

（2）搭配色相選擇

在主色的選擇上，我們還是選用2 款藍色系與一款綠色系作為主色相。

藍色系中（CNCSCOLOR1045522P）藍色色相清晰，明度與純度適中，在整體APP 色彩搭配概念中代表了“功能清晰”感，也能展現出一種直覺清晰簡潔性。此外為了日后不同場景的開發給予觀眾更好的色彩感官體驗，我們同時又選擇藍色（CNCSCOLOR1204522P）代表“技術”感，與綠色（CNCSCOLOR0885522P）“持久發展”感在后期為多場景下的主色，配合藍色（CNCSCOLOR1045522P）進行搭配或單獨使用[2]。

（3）搭配色調選擇

在輔色的選擇上，調整輔色的冷色調屬性，改用偏暖色調色相。體現出科技帶來的人文情懷，溫暖的淡奶黃色帶來智慧象征。橘色、紅色等色彩進行搭配時會使整體畫面有晨曦、黎明、希望之感既擴大了色相選擇范圍，讓整體畫面色彩豐富起來，同時也體現了開放性與包容性。整體色彩搭配建議偏暖色調，削弱了畫面藍色所帶來的孤獨感，也更好地體現出科技以人為本（圖3）。

圖3 APP最終使用色彩設計方案

明度的選擇上，原色彩畫面明度在50%～75%之間，在原先的APP 畫面設想中意圖體現出科技神秘穩重之感，但在APP 上架使用后，我們發現，因客戶多用手機使用此系統，在畫面大小被手機大小局限的前提下，畫面整體顯得幽暗色彩不清晰。雖然后期我們在2.0 版本中提升了色彩明度，但卻又使畫面感到冰冷感。

在使用APP 時，對于使用者來說，其觀看距離幾乎是保持恒定不變的，我們發現比較鮮亮的顏色，亮度是表現顏色距離的關鍵性線索。顏色的亮度越高，看起來離得越近。也會產生視覺不適感，故在此次色彩選擇上，我們把主色調明度控制在55% 輔色在控制好色彩面積的同時明度最大深色控制在25%最亮色控制在80%。

配色選擇，因顏色搭配在整個設計創作空間感中起著重要作用，特別是在平面視覺設計中長度、寬度、高度、深度以及面積感都可以通過顏色來掩蓋或強調。總所周知，在空間感知中，越是飽和度高的顏色，看起來的視覺距離越近。顏色在視覺感知空間上引導作用，更多依賴于色彩與色彩之間的對比能力，而不是特定顏色的固有色。在進行平面色彩視覺設計中色彩明度也是重要考慮因素之一。因客戶不喜對比配色，但又要求配色是要體現出畫面色彩豐富感。原APP配色，多用漸變配色，與明度對比配色。雖在配色上避免了色彩的對比碰撞感，但整體畫面色彩單一，枯燥感強，缺乏生氣。在更改配色方案后，設計人員提出了“單色場景看冷暖，多色場景看色調”的搭配理念來提高客戶對色彩的要求（圖4）。即在進行統一色系搭配過程中，利用色彩受光面與陰影面為界，利用色彩冷暖感進行色彩搭配。在使用同色系的基礎上，在明亮面使用暖色系，在陰面使用冷色系。通過電腦光照效果渲染，既能很好過渡色彩搭配，也能產生色彩變化，避免了畫面整體色彩無層次。以藍色物體為例：受光面為暖藍背光面為冷藍。同時在多色彩場景下，通過統一色調來讓色彩搭配在視覺明度上進行統一，減少色彩明度和純度帶來的視覺跳躍感。

圖4 APP最終使用色彩設計1

3 色彩空間感引導

3.1 空間視覺引導

通過不同色相與明度的組合區分場景中的前后左右及上下關系，做出景深與空間感。通過對比色制作出空間延伸感。引導觀眾沿著指定“路線”游覽（圖5）。

圖5 APP最終使用色彩設計2

3.2 通過強調色對比

引導觀眾快速捕捉畫面關鍵信息。如廣告牌、特定人物等。

色彩空間引導搭配概念，在未來的虛擬云會場使用過程中，使整體畫面色彩更豐富，提升畫面感和指向性。此外整體色彩搭配對比、強調與明確指向性的色彩搭配在未來更適合小屏幕使用，為將來H5頁面設計奠定了良好的色彩搭配基礎。

4 總結

當為“元宇宙”項目做配色的時候，其實主要美學原理與現實配色原則不盡相同，但要注意的是需要在原有基礎上對虛擬應用場景融入更多所需虛擬元素。但是切記一切虛擬現實美學和配色原則是建立在現實基礎上的。現實中不自然地，不符合大眾審美的配色在虛擬現實世界里依然令人感覺不舒適。當為虛擬場景配色的時候我們大致需要分三步來進行。首先要根據虛擬現實的應用場景來設定主色和輔助色。第二步，根據所需要調動用戶的情緒來定色調。第三步，根據虛擬場景所需要互動場景和項目來設計視覺空間引導。當大家遵循以上三個步驟來為一個“元宇宙”項目做配色，相信每個人都能達到一個令人滿意的結果。而作為色彩搭配師，我們更要用開放的心態對每一個色彩搭配方案反復推敲，特別是在做虛擬產品的時候，在進行項目的前期色彩定位時多和客戶溝通，盡可能多方位了解客戶對自己產品的想法和理念，后期多與設計師與工程師溝通，對色彩在屏幕中呈現的效果進行分析比對，建立起客戶與最終成品之間的溝通橋梁。