編輯導讀：隨著互聯(lián)網(wǎng)行業(yè)的發(fā)展，產(chǎn)品體驗的一致性和開發(fā)的效率越來越被重視，設計系統(tǒng)的出現(xiàn)就是為了解決這樣的問題。一套優(yōu)秀的設計系統(tǒng)有利于幫助產(chǎn)品在各個平臺保持一致的設計語言和風格，給用戶一致的產(chǎn)品體驗。本文將從4個方面，對設計系統(tǒng)進行深度分析，希望對你有幫助。

58同城是一個海量的分類信息服務平臺，提供房產(chǎn)、招聘、二手車、團購、黃頁、交友等多種服務。由于存在不同業(yè)務類型與錯綜復雜的用戶體系，使得各業(yè)務設計師之間的溝通與合作尤為重要。在同一平臺下，如何構建58設計中臺成了最大的課題。

58UXD用戶體驗設計中心從未停止探索。近年來成立多個專項體驗小組，經(jīng)過不斷的技術完善與創(chuàng)新，建立全新10.0設計語言。最大化保證了平臺穩(wěn)定性與分業(yè)務的靈活性，讓設計走向?qū)I(yè)化和智能化。

我們將業(yè)務中公共的、通用性高的部分合并同類項，抽取到中臺沉淀為服務能力。在一定的范圍內(nèi)獲得最佳秩序，減少相同業(yè)務、系統(tǒng)的重復建設，直觀地降低設計產(chǎn)品研發(fā)成本。

接下來將從項目發(fā)起到設計交付全流程進行分析，我們是如何在每個節(jié)點進行干預，使設計系統(tǒng)實現(xiàn)高效運轉(zhuǎn)。我們不難發(fā)現(xiàn)，隨著智能化工具的研發(fā)、業(yè)務發(fā)展的需要，設計師職能逐步從視覺制作轉(zhuǎn)換為設計決策者。工具化、模塊化、組件化逐步代替人工，為設計師爭取了更多時間進行用戶調(diào)研、優(yōu)化產(chǎn)品原型、參與交互等工作，多角色實現(xiàn)全流程體驗優(yōu)化。

那么在每一個環(huán)節(jié)采取何種措施可以提升設計服務力呢？用一張設計運轉(zhuǎn)齒輪概括我們的優(yōu)化步驟。

設計流程：需求池、分析策略、制定設計語言、決定執(zhí)行標準、開始生產(chǎn)、優(yōu)化交付、反饋驗證、沉淀經(jīng)驗、提煉優(yōu)化點重回需求池。

按階段劃分為：

• 設計前：將需求分級與標準化，根據(jù)設計語言的制定設計方案。
• 設計中：進入模塊化后根據(jù)原型拼接，同步選擇生產(chǎn)方式，利用資產(chǎn)池中的相關元素，依靠人機來完成需求制作，最后完成交付。
• 設計后：針對上線后的數(shù)據(jù)后平臺觀測，加入用戶分析形成新的優(yōu)化點，最終回流需求池，沉淀的經(jīng)驗加入知識庫。

資產(chǎn)池需要設計不斷供應、優(yōu)化、增補保證效率、效果。那整個設計齒輪運轉(zhuǎn)的關鍵是什么？

從標準、內(nèi)核、元素、工具四個關鍵點進行一一解讀。

01 標準

專業(yè)的設計必須建立標準，舉一個小例子，不難發(fā)現(xiàn)工廠制衣過程中水洗標都在左側(cè)，這個是行業(yè)標準，根據(jù)人體工程學等因素設定，工廠根據(jù)標準進行批量生產(chǎn)，不論是跨類型還是跨工廠都可以實現(xiàn)模版化快速生產(chǎn)。同樣所有產(chǎn)品都需要建立一定的設計準則，根據(jù)復用模型量產(chǎn)提升設計規(guī)模。

具體可以從需求標準化、流程模塊化、組件通用化入手。

1. 需求標準化

標準化需要提供設計需求文檔。

從源頭做起，把產(chǎn)品需求標準化，根據(jù)需求類型自動進入相應的需求池，加快設計理解。要求產(chǎn)品人員按需求填寫需求單，獲得充分信息輔助設計，避免目標偏差。

標準化可以按格式提供內(nèi)容。

例如流量運營中的投放需求，根據(jù)設計研究對文案、字數(shù)、主標題與副標題的行數(shù)、圖片內(nèi)容等因素加以規(guī)范。產(chǎn)品按格式提供需求文檔，加快處理速度，為實現(xiàn)自動化奠定基礎。

標準化可以進行需求分級。

如何判斷需求的優(yōu)先級？分級別決定采取怎樣的設計手段？

可以根據(jù)緊急度與重要度兩個維度分別進行判斷，重要的不緊急的可以長期重點發(fā)力，也可列為okr項目不斷跟進，重要的緊急的那么要馬上做，緊急的不重要的常態(tài)化需求，可以大家分擔做。不緊急不重要的級別權重為最低排最后。

根據(jù)評級評估表，進入相應排期分類，快速溝通設計成本與相應產(chǎn)出標準。

標準化需要風險評估。

是否存在技術實現(xiàn)難度？是否采用特殊動效、c4d、AR等特殊手法？預期修改意見是否大于3次？是否存在策略層變動風險？是否存在原型變動頻繁情況？

如有以上情況，需要在需求文檔中額外說明，并郵件同步。技術、產(chǎn)品、設計同學根據(jù)風險評估，做好應對方案。

2. 流程模塊化

把工作流程梳理成關鍵節(jié)點，采取階段性的跟蹤。在固定的流程上采取固定的方法，從而讓流程實現(xiàn)自運轉(zhuǎn)。例如設計走查的時間點，切入在功能測試的同時進行，在冒煙測試階段進入視覺測試，上線前必須設計同學審核等等，每一步可以利用iwork進行跟蹤。

3. 組件通用化

設計系統(tǒng)中的元素、控件、版式都可以組件化，但切記通用原則，以保證根據(jù)不同目的進行不同的組合。

例如58首頁的改版，我們將功能劃分為不同模塊，充分滿足業(yè)務進行不同的組合與調(diào)用，形成新的界面。

需求可以利用工具將組件模塊生成為所需頁面，并不斷驗證與優(yōu)化。

02 內(nèi)核

任何組合都離不開設計內(nèi)核，真正展示產(chǎn)品的核心優(yōu)勢與價值，與競品產(chǎn)生差異化。讓我們一起探索58同城用戶體驗的設計內(nèi)核。

秉承58同城讓生活簡單美好的愿景，打造豐富的本地服務信息平臺，采用簡單易理解的、親民的、無冗余的設計理念。將“設計規(guī)范”逐漸改為設計體系、設計語言，把設計語言作為一種“溝通的方式”向產(chǎn)品的各個觸點傳遞。

設計內(nèi)核：以簡馭繁，做有用的設計。

58同城logo由紅、綠、藍、橙等色調(diào)構成，每種顏色代表了不同的業(yè)務，品牌理念圍繞LOCO(Life、People、Creativity、Ecosystem），包括生活化、人、創(chuàng)造力、生態(tài)四個維度進行LOCO配色拆分，平臺采用主橙色，分類業(yè)務招聘、房產(chǎn)、黃頁、二手車等從橙色延續(xù)到藍色，并將LOCO符號拆分延展，組合成相應的業(yè)務品牌符號。緊緊圍繞設計語言核心理念，保證了一致性與多元化。

全業(yè)務通用原則：一致、疊加、多彩、圓潤為基調(diào)，表達專業(yè)、豐富、多元、親和的設計理念。

根據(jù)品牌基因設定固定配色規(guī)則，例如通用標簽規(guī)則的設計，讓每一個組件、每一個元素都具有了58的靈魂。

03 元素

為提升設計效率，我們建立了共享設計資產(chǎn)池，其中包括插畫庫、icon庫、元素庫、圖片庫、組件庫、玩法庫等等。積累需要漫長的過程，所以研發(fā)了水晶球共享平臺，鼓勵設計師上傳，互通有無的同時保持設計對齊。

04 工具

工欲善其事，必先利其器。2020年初在58UXD高級總監(jiān)何瀟帶領下成立了TOOLKITS設計工具研發(fā)小組。小組成員緊密配合，設計驅(qū)動全方位打造設計中臺，利用工具輔助設計流程中的各個觸點。

在設計流程的不同階段，為設計、產(chǎn)品、技術提供相應的工具。

典型案例：

• 58問卷系統(tǒng)：企業(yè)定制化云服務平臺。服務于企業(yè)以及產(chǎn)品的調(diào)研。提供豐富的問卷模版與58特色的商家數(shù)據(jù)服務。
• IWIKI：文檔庫管理平臺。上傳知識沉淀、分享、用研、競品分析等，同時支持規(guī)范查詢等相關內(nèi)容。
• IWORK：產(chǎn)品需求管理平臺。產(chǎn)品、設計師、技術的任務池，追蹤整個設計流程。
• 58云盤：文件存儲云平臺。源文件等大型資產(chǎn)存儲，支持遠程在線協(xié)作。
• 水晶球：設計資產(chǎn)分類管理中心。素材可視化分類，設計產(chǎn)出的復用與再造，為智能化生產(chǎn)提供原材料。
• 斑馬：人工智能設計平臺。提供智能合圖、摳圖、素材模版搭建等功能，最終通過機器制圖實現(xiàn)設計自動化。
• 風火輪：組件可視化三方協(xié)作平臺。從代碼、設計樣式等進行全面打通，提高設計還原度。實現(xiàn)代碼組件化，減少溝通成本，全面提效。
• MATRIX：中后臺設計組件平臺。致力于打造企業(yè)級的產(chǎn)品設計體系，建立適用于設計團隊、開發(fā)團隊、產(chǎn)品團隊的全鏈路通用產(chǎn)品解決方案。讓項目開發(fā)更直觀，更高效、更簡單。

圖中為共建項目的責任人，項目背后還有很多努力的同學，整個設計系統(tǒng)離不開58UXD每一位設計師的辛苦付出。如果對其中項目感興趣的同學，敬請關注58UXD相關文章。

以上分別從標準、內(nèi)核、元素、工具等角度分析了優(yōu)化的關鍵點。58UXD將探索更多的輔助方法幫助設計師減輕負擔，更好的服務用戶。

我們的目標：讓設計提升服務，讓生活簡單美好。

作者：李巖，設計專家

本文來源于人人都是產(chǎn)品經(jīng)理合作媒體@58用戶體驗設計中心（微信公眾號@58UXD），作者@李巖

題圖來自 Unsplash，基于CC0協(xié)議。