l 三維組件系統1.0介紹

三維組件系統作為自如圖形資產的一部分，是為了應對業務增長中對更高的品效合一需求而開發的團隊生產工具，通過利益人及用戶畫像分析等研究確定了開發方向，對通用組件——自如產品及人物組件進行了開發，通過規范化參數同步兼容四種渲染器，通過預渲染模式來快速完成三維需求處理，三維設計師則可以通過組件庫進行更豐富的拓展，提升團隊協作效率。

l 三維組件系統開發流程

自如三維組件系統擁有一個基本的沙盒式設定世界觀，保留了產品的高度還原及辨識度，同時增加了真實的生活質感。整個系統包含通用組件及角色組件兩部分，在通用組件開發中，我們通過一系列設計規范來完成建模/材質/燈光的設定及封裝；在角色組件部分我們通過對用戶畫像的研究，結合二維插畫形象，完成了基本人物形象的設定及標準，并衍生出了表情等組件應用形式。

自如圖形資產-三維組件系統——分享大綱與細節

l 自如圖形資產

在2020年，自如發布了插畫組件系統2.0，包含產品及人物兩大部分，通過這套組件庫，設計師能夠高效、便捷處理大量需求，同時保證統一的品牌風格和產出品質。

通過插畫組件庫的經驗積累，我們希望在自如價值增長的新階段中尋找新的設計增長點，同時滿足設計師與業務端對品質與效率的訴求，三維組件系統由此而生。我們希望通過插畫+三維組件系統來完成對自如產品的數字化重塑，構建一個屬于自如的品牌化圖形資產平臺。

Why.How.Who.

我們對項目相關利益人（設計師/用戶/業務人員/企業/品牌等）及對應的用戶畫像進行了分析，對三維設計流程中的重要環節，從品牌、增長、效率、競爭力等維度進行評估，幫助我們明確設計目標及服務的人群，以及用何種形式來達成三維組件系統的工具屬性。

l 預渲染（Pre-Render）

為了幫助非三維設計師利用三維圖形資源，我們開發了預渲染機制，即通過對場景中元素的單獨渲染及重構，重新組合為完成的場景并且能夠在平面軟件中進行編輯；通過規范中的特殊燈光及材質來保證一定程度上的可動性，讓平面設計師能夠利用這些基本的產品場景輔助他們完成設計，節省時間的同時獲得不同于插畫的視覺風格。

l 系統資產-通用組件

三維組件系統1.0的通用組件部分，包含自如友家/整租/心舍的全系列產品組件，每個產品場景中包含對應產品風格的床品/擺件/植物/家居用品組件，每個組件都可獨立編輯；為了更好的展示效果和可用性拓展，我們對每個產品都進行了獨立的Stage搭建，整個產品空間中的內容都可以得到充分展示，且保證了不同場景間的統一性。

在單一場景的基礎上，我們還可以通過元素重組進行場景的擴展，如居住空間與生活空間。物品間的組合比例經過計算并擁有統一的模型規范，以確保任意組合下的和諧與統一。通過規范化的封裝，所有設計師都可快速調用這些資源。

l 系統資產-角色組件

人物與我們的品牌息息相關，包括自如客/業主/管家/服務人員，所以我們對圍繞品牌的不同角色進行了基礎的形象設計以及表情設計。

l 開發流程-通用組件

一、 業務訴求

自如在十周年推出了新的產品與增長模式，為了滿足不斷增長的業務需求，以及順應三維的設計趨勢，我們基于插畫組件系統積累的經驗開始了對三維組件系統的開發。

二、 世界觀設定

在開發前期，我們對系統進行了世界觀定義，即由多種基本元素構成的沙盒世界。我們希望組件能夠滿足運營/體驗等多種視覺需求，并區別于實物產品，讓空間兼具玩具的質感與親和力，又保留生活品質的細節，如同真實生活瞬間的濃縮。

三、 建模

我們對建模的基本原則進行了規范，即保持產品辨識/生活質感/沙盒式拓展。在比例尺上我們以一個中比例物體作為1x1參照物，來對其他場景模型比例進行約束，作為建模的標尺引導設計師工作。

四、 材質

單個場景中包含大量不同類型材質，我們將材質分為基礎/布料/進階三類，來滿足不同的需求場景：使用基礎材質快速上色，使用布料為場景增加柔軟的生活質感，使用進階材質豐富細節。我們為這些材質制定了規范來統一參數，保證產出效果的一致，設計師也可基于庫內材質進行修改/拓展，保證材質庫能夠持續豐富。

五、 燈光

在研究布光方式的前期，我們進行了一些實驗，通過Xpresso中利用Python生成正交性參數圖片矩陣，來搭建一個簡易的測試原型，通過多人實驗快速得出滿足群體需求的理想結果，將對應結果的參數作為布光基本原則。同時也對常見的布光形式進行了預設，以及與之匹配的機位預設。

六、 封裝

通過字段式命名方式將組件庫文件規范化管理，便于設計師快速調用，設計資源合理歸類。

l 開發流程-角色組件

一、 角色畫像

通過用戶研究所得出的用戶特征，我們提取了一些最具代表性的關鍵詞來對基礎角色進行側寫，從中提煉出基礎角色形象的特征，并由插畫設計師完成基本的頭身比、表情規范以及基礎角色形象的設定。

二、 角色建模

我們的三維角色形象基于二維插畫稿開發，采用了標準八邊型建模及凸形五官，確保角色在動態時更加穩定。當前組件庫包含自如客/業主/管家及服務人員基礎形象。通過骨骼綁定，能夠讓設計師自由擺出需要的動態或動畫。

為了讓角色形象更加生動，我們對角色的表情也進行了設計，通過自建控制器可以實現表情的自由調整和快速切換。