虛擬直播作為騰訊云渲染的一款新產品解決方案，提供一站式的云端多樣化的虛擬空間互動玩法與直播玩法；基于云渲染的 PaaS 技術，結合騰訊云超低延遲音視頻技術以及 VGPU 實時渲染，實現在 web 端、小程序端、H5 端進入虛擬世界進行多樣化活動的新型音視頻直播解決方案。在進行多端體驗設計與內容場景模型設計時，我們進行了相關探索性的研究，本篇文章將介紹此項目設計探索的內容。

更多直播設計干貨：

一、設計背景

1. 什么是虛擬直播？

虛擬直播（Virtual Space Live，VSL）是騰訊云自有的一款新的音視頻技術產品，基于騰訊云音視頻能力和云端渲染技術，搭配合作伙伴內容，網頁開啟虛擬空間直播間，僅用簡單配置即可一鍵云上開播。

2. 項目難點

虛擬直播產品屬于音視頻云渲染和云直播結合的技術類 PaaS 新產品，對于客戶來說云渲染以及云直播技術能力是比較抽象難懂的，在設計上如何快速展示騰訊自有的技術能力以及優(yōu)勢是難點之一。在客戶進入官網和產品的時候如何能夠更清晰的了解這款全新產品的功能以及場景也是設計需要考慮的重點。

在視覺方面，我們需要通過可視化的方式，讓客戶了解我們的技術類產品；并通過體驗 Demo 的方式幫助客戶更直觀的了解到我們技術型產品的特性及優(yōu)點。那么如何通過可視化的方式和體驗 Demo 幫助客戶理解呢？我們進行了一系列的設計探索，下面介紹一下我們是如何克服項目中的這類難點的。

二、設計策略

1. 虛擬直播產品的視覺該如何考慮呢？

在了解項目情況后，我們針對性的做了以下設計方向。

1. 產品曝光方面，打造新產品頁視覺；配合產品對外進行產品及創(chuàng)新設計的 PR
2. 產品功能方面，建立與打磨 Web 和移動端的虛擬直播間 Demo 基礎體驗
3. 對客方面，搭建標準化場景內容，跟進大客戶設計需求服務，打造標桿案例

歸納為三個層面進行針對性設計：識別-體驗-服務

設計策略是：識別層面，對于新產品，我們要樹立產品在客戶眼中的第一印象，打造虛擬場景互動的科技與技術力感受；體驗層面，滿足虛擬直播客戶與間接用戶的用戶體驗需求，打磨產品的功能體驗；服務層面，也是價值核心，是做好虛擬直播間的標準化場景內容的設計。

另外，項目初期通過 PPT 和產品介紹對云渲染的 PaaS 業(yè)務做初步了解，與產品溝通了解產品的規(guī)劃與商業(yè)化玩法也是很有必要的。技術產品的理解門檻要搞很多，所以前期需要進行充足的技術儲備的學習，以便在技術范圍內促進對產品的創(chuàng)新設計。

三、識別層設計

下面介紹如何讓客戶快速識別并生成良好的第一印象，也就是識別層的內容。

1. 客戶識別路徑

首先是分析客戶的識別路徑，以制定不同階段的設計目標；在視覺方面，影響客戶感官的主要是應用場景的圖文識別，以及體驗 Demo 時候的視覺識別，最終要使客戶對虛擬直播產品形成“專業(yè)”“前沿”的第一印象。第一印象也是能深遠影響客戶對于產品使用購買的決策。

2. 認知遞進

虛擬直播的客戶一般是傳統直播行業(yè)的客戶，為了使客戶能逐步了解產品，我們對于客戶的感知進行了區(qū)分設計。在虛擬場景類型上，我們采用更加抽象通用的場景幫助客戶快速識別了解產品內容。在產品 Demo 登錄階段，給予客戶更深的虛擬直播“虛擬前沿”感受。

3. 風格象限分析

通過風格參考劃出不同象限，確定風格所在象限的位置，定位視覺風格的把控。在視覺風格進行前參考是很重要的靈感來源，而風格象限幫助我們更準確的找到相應的風格的參考方向。

4. 通用抽象場景

騰訊云官網的應用場景延續(xù)騰訊藍配色與科技質感結合，搭建抽象人物與場景。人物制作上使用成熟青年年齡段的人物，助于體現虛擬直播的專業(yè)感。

5. 加深虛擬直播風格

考慮產品 Demo 登錄頁風格時，我們也使用風格象限的方式，并根據“前沿”的關鍵詞進行定位，風格上更靠近宇宙科幻與硬科幻的表現形式。

6. 風格草案

在確立了風格方向后，進行了初步的場景概念設想。由于登錄界面涉及觀眾端和主播端，所以針對兩端的用戶進行了區(qū)分設計。用戶側以用戶“傳送”的概念搭建場景；主播端側重展示空間“入口”的功能概念。

7. 模型視覺語言加深

場景模型在基礎概念上調整了細節(jié)表現，例如硬表面的幾何紋理，硬墻體的結構布局，虛擬元素的深入、加入輔助元素與場景模塊等模型細化。

8. 材質質感提升

材質質感上也采用了玻璃質感、發(fā)光質感、金屬反射質感、太空元素等。

9. 登錄界面

登錄背景視覺確立后，登錄的主要操作流程中登錄框、loading 等元素也延續(xù)風格進行設計，形成完整的視覺效果。

四、體驗層設計

我們在體驗層主要進行了基礎 Demo 的體驗搭建以及體驗提升的規(guī)劃。針對 1.0 版本搭建核心功能的體驗，在保證了核心流程通暢的基礎上，并根據產品的迭代進行了設計的迭代。長期規(guī)劃是實現標準化的 UIKIT，客戶可以使用低代碼方案快速接入。

其中直播功能主要涉及基礎直播推流拉流設置與開播設置等基礎功能，互動功能 UI 涉及輪盤、動作、禮物、表情、視角、設置等虛擬空間內的互動玩法。

1. 主播端&觀眾端界面效果

積累基礎框架與規(guī)范組件，產品功能交互目前正在進行更全面的梳理，視覺設計后續(xù)也會進行迭代。

積累基礎框架與規(guī)范組件，視覺設計后續(xù)也會進行迭代。

五、服務層設計

在虛擬直播產品之前，云渲染相關的場景服務是由合作伙伴來提供的，質量難免會參差不齊，很難滿足大客戶對質量的要求。因為客戶不同的訴求每次都是從零定制開發(fā)，客戶接入到項目的上線需要 1-2 個月的開發(fā)流程，并且沒有積累的騰訊自有的數字資產進行使用。這是前期業(yè)務遇到的困境，也是我們著力嘗試去解決的重點問題。

我們思考通過建立標準化場景服務的方式來解決這個問題。通過核心場景的搭建及組合就可以生產適配主要應用場景的方案 ，降低了成本與定制場景和開發(fā)時間，形成較為穩(wěn)定的高質量場景。相對于競品來說，低門檻的接入也更具競爭優(yōu)勢。同時，通過騰訊自有的標準化場景服務也可以積累標準案例與客戶，達到雙贏的局面。

1. 產品結構

要建立標準化的場景服務，我們先對虛擬直播間的產品結構我們也先進行了分析，以此為切入點來挖掘具體可實現的場景類型。虛擬直播間按照不同的內容類型來提供相應的客戶場景的服務，劃分為虛擬會議、多人娛樂互動、虛擬人、MR、多人虛擬場館。我們是從應用比較廣泛的虛擬場館入手來搭建場景的。

在對虛擬場館標準化內容設計過程中，我們進行了以下內容的設計思考。

2. 應用場景類型

類似于現實中的場館，多人虛擬場館不僅可以滿足虛擬賽事這類競技類的虛擬直播，也可以滿足綜藝、會務、活動等多元化的場景需求，并且騰訊云主要直播類型的大客戶斗魚（直播平臺）、B 站（綜合視頻直播平臺）也是對于這類場景項目需求比較大。

3. 提煉場景內容

虛擬場景也是參照現實而來的，主要是需要滿足用戶身臨其境和新奇好玩的體驗與視覺感受。我們首先提煉出虛擬場景中需要參照現實場景的內容。場景的承載載體-場館；場景的視覺焦點核心-舞臺屏幕（虛擬屏幕可以播放視頻或者直播畫面）；用戶的參與空間-觀眾席；場景氛圍的烘托-場景道具，包括場景裝飾還有禮物特效與場景特效等動態(tài)視覺呈現效果等。

4. 設定場館參數

就像體育館有大有小，我們在做虛擬場館的時候也根據不同場景設計了不同的規(guī)格尺寸，例如大型賽事適合四面屏（四面觀眾都能看到屏幕內容）超 2000 名虛擬觀眾的橢圓形虛擬場館；小型辯論賽適合中小場景的單面屏扇形場館。

5. 設定場館結構

場館的結構外形和內部結構的設計使用流線型設計，使整體場館的科技感更突出，在看臺方面參照現實場館的設定，增加了多層空間的設計。此外也增加了虛擬浮空的看臺，凸顯虛擬場景特點。

6. 虛擬場景內容

根據現實場景，制作相應的虛擬場景內容，大的場館外形確定后進行內部虛擬屏幕、虛擬觀眾席、虛擬場景道具的設定。屏幕方面使用主屏幕和輔助屏的方式，采用斜角幾何形體構建模型的科技感形體。虛擬道具方面使用點陣、魔方等內容豐富場景的虛擬科技感受。

7. 虛擬場景元素

設計場景中的主要內容劃分后并繼續(xù)拆分，進行元素的設定，氛圍燈光，廣告牌等輔助元素豐富場館的可擴展性。由此，對整個場館的主要內容元素構成解構。

8. 場景角度預設

通過不同角度的場景感受調整設計的內容細節(jié)，使場景在不同感官角度中可以展現其特點。在虛擬直播中，通過互動玩法也能感受到不同角度的視覺感受。由此，場景角度預設可以提前預覽場景優(yōu)質的角度效果，為觀眾帶來全面的視覺感受。

9. 場景風格

以”潮流“”賽博“的虛擬感受切入，打造場景的科技虛擬視覺風格。基于虛擬場景的的應用場景特點以及考慮通用性，以科幻賽博的氛圍烘托整個場館的氣氛，達到最終虛擬直播活動展示的效果。

10. 材質質感

深色的場景主基調和地面墻面的紋理表現，體現場景的真實感，發(fā)光材質突出屏幕區(qū)域的炫彩屏幕，反射與薄膜材質應用于地面映射出環(huán)境的光線氛圍。

11. 場館效果

場館全景的視覺效果，通過導播鏡頭可以看到場景全景氛圍。

12. 近景效果

在發(fā)光材質、科技元素等視覺元素疊加下，展現屏幕近景的酷炫效果，屏幕中央示意播放的視頻素材。

13. 模型優(yōu)化

對接開發(fā)的過程中，還需要對設計的 3D 模型進行面優(yōu)化與拓撲。優(yōu)化后的面數減少 60%以上，可以減少開發(fā)渲染的內存與流量。模型、材質貼圖一起打包后交付開發(fā)，導入引擎。

14. 場景適配

針對 B 端的客戶服務，定制化需求一直以來是其中的難點之一；我們建立標準場景后就快速幫助斗魚上線了 CS GO 大師賽項目，并取得了不錯的虛擬直播效果。那么不同客戶對于場景的需求的差異便是我們下一步思考的內容。針對日益增長的客戶場景需求，我們的策略是建立標準化場景體系，根據標準組件內容組合適配不同場景。

在完成基礎場景內容后，開始考慮如何滿足客戶的需求進行場景適配。主要是通過擴展組件與擴展樣式進行。

在完成基礎場景內容后開始考慮如何滿足客戶的需求進行場景適配。主要是通過擴展組件與擴展樣式進行。

15. 擴展組件組合

擴展的組件進行分類整理，分為氛圍道具、屏幕組合、場館設施、氛圍燈光等關鍵影響因素。對于相應類型的具體模型進行擴展，例如氛圍道具中道具擴展有魔方模型，光環(huán)模型，突刺模型等。同樣，在屏幕組合的時候也是可以將多塊屏幕進行組合形成組合效果。

16. 組件組合場景

根據不同的屏幕，氛圍道具，燈光等模型的變換，組合場景。形成下圖中不同的場景效果。

17. 控制燈光顏色

場景燈光顏色氛圍的不同也是渲染不同場景格調的主要元素。除了相應的客戶的品牌色之外，同樣場景下不同的配色可以用于不同活動的氛圍，例如”熱鬧“”靜謐“”科技“”對抗“等顏色情緒的表達。

18. 材質質感擴展

基礎材質之外也擴展了其他常用主題的材質質感，例如金融方向的金屬與黃金的貴重質感；科技方向的輕透與硬朗的智能感受。

19. 適配主題

通過不同的顏色、質感、組件搭配出適合場景主題的最終效果。

所以滿足客戶多樣化的需求，主要是通過豐富場景組件，設定燈光材質，來生成不同的需求場景效果。

總結來說，場景標準化是需要對場景內容進行解構與標準內容的來設定的，例如基礎場館大小，屏幕組合，道具組件等；通過擴展的方式，對不同的內容進行組合搭配，最終生產不同需求的虛擬應場景，以用于虛擬年會、虛擬演唱會、虛擬賽事等客戶的虛擬活動。

目前騰訊云設計中心為虛擬直播間生產的虛擬場景已被 3 家大客戶應用，包括央視、斗魚直播平臺、成都電視臺。其中央視大客戶對于場景設計沒有提出修改，也間接印證了客戶在場景方面的滿意度。我們也為場景的推廣進行了圖片宣傳的設計與 PR 稿部分內容的編寫。當然在內部合作上我們也和虛擬人項目進行合作。

六、設計總結

虛擬直播作為一款新場景，新技術，新體驗的云產品，騰訊云設計中心進行了從零開始的設計探索，并取得了初步的成效。

通過虛擬直播項目我們也進行了總結，以歸此類技術產品售前售后的視覺體驗設計探索方法：

1. 識別層

在識別層使客戶形成專業(yè)、前沿的良好感受；通過主視覺場景快速了解產品應用場景，幫助客戶形成虛擬直播產品專業(yè)高品質印象。

2. 體驗層

在體驗層搭建虛擬直播互動體驗、建立視覺規(guī)范、版本迭代，并規(guī)劃后續(xù)進行 UIKIT 的搭建。

3. 服務層

在服務層幫助客戶快速高效高質量接入，形成了標準化高質量的虛擬場景體驗，滿足客戶不同應用場景的需求。助力央視、斗魚、成都電視臺等大客戶相應活動的上線，為虛擬直播產品樹立了標桿案例，也幫助客戶實現了收入與流量的提升，實現設計最終價值。

歡迎關注作者微信公眾號：「騰訊設計族」