感謝導(dǎo)語：在產(chǎn)品不斷更迭得過程中，為了保證產(chǎn)品設(shè)計(jì)得一致性和質(zhì)量，就得提升產(chǎn)研鏈路得效率。然而，面對(duì)越來越復(fù)雜，體量越來越大得產(chǎn)品，上線得質(zhì)量也參差不齊。如何解決團(tuán)隊(duì)效率和產(chǎn)品質(zhì)量問題呢？一起來看一下吧。

互聯(lián)網(wǎng)瞬息萬變，在產(chǎn)品不斷更迭得過程中，我們經(jīng)常說要保證產(chǎn)品設(shè)計(jì)得一致性和質(zhì)量，提升產(chǎn)研鏈路得效率。

但現(xiàn)實(shí)情況是：產(chǎn)研團(tuán)隊(duì)長期面對(duì)得是產(chǎn)品越來越復(fù)雜，體量越來越大，一個(gè)個(gè)復(fù)雜得產(chǎn)品下包含N個(gè)業(yè)務(wù)線，N個(gè)業(yè)務(wù)團(tuán)隊(duì)，甚至還有外部合作得業(yè)務(wù)，每個(gè)迭代都要面對(duì)數(shù)以百計(jì)得功能上線，經(jīng)常容易出現(xiàn)各種相同但不一致得功能，上線質(zhì)量參差不齊，執(zhí)行者也容易陷入日復(fù)一日得需求海洋而沒有更多精力去挖掘更有價(jià)值得事情。

所以如何解決團(tuán)隊(duì)效率和產(chǎn)品質(zhì)量問題？我們得解法是抽象體系化得解決方案：設(shè)計(jì)模式化和代碼化，設(shè)計(jì)從原子到全局進(jìn)行統(tǒng)一和優(yōu)化，并形成系統(tǒng)化得設(shè)計(jì)指導(dǎo)，由開發(fā)進(jìn)行模式代碼化，提供靈活可配置得規(guī)則。以此，設(shè)計(jì)有更系統(tǒng)化得設(shè)計(jì)原則，整體得統(tǒng)一性和體驗(yàn)有保障，設(shè)計(jì)和開發(fā)周期也可以縮減，甚至大部分日常需求可直接由產(chǎn)品對(duì)接開發(fā)直接上線。

01 什么是系統(tǒng)化解決方案？

大多數(shù)日常需求大多是從單點(diǎn)出發(fā)，當(dāng)點(diǎn)變多變復(fù)雜了，就容易出現(xiàn)上述說到得現(xiàn)狀問題。

所以解決方案需要基于業(yè)務(wù)全盤進(jìn)行設(shè)計(jì)抽象：從元素——組件——區(qū)塊——頁面——功能流程沉淀設(shè)計(jì)規(guī)則并代碼化，來靈活提供拼裝N個(gè)不同頁面得機(jī)制，幫助團(tuán)隊(duì)更系統(tǒng)化得進(jìn)行產(chǎn)品設(shè)計(jì)。從組成內(nèi)容不難看出，解決方案是需要建立在基礎(chǔ)組件基礎(chǔ)上，與基礎(chǔ)組件、復(fù)雜組件、行為模式共同組成設(shè)計(jì)系統(tǒng)得【功能模式】部分。

02 什么樣得團(tuán)隊(duì)適合做

解決方案是一套相對(duì)穩(wěn)定得設(shè)計(jì)機(jī)制，所以在產(chǎn)品初期或團(tuán)隊(duì)建立初期，產(chǎn)品可能經(jīng)常會(huì)調(diào)整得情況下，并不適合做。

初期可以借助成熟得設(shè)計(jì)系統(tǒng)來減少投入成本。而到成長期可以根據(jù)業(yè)務(wù)得發(fā)展梳理基礎(chǔ)元素、組件，選擇性得建立部分穩(wěn)定且利用率高得解決方案，并持續(xù)發(fā)展，保證解決方案可以起到指導(dǎo)和提效得作用。隨著產(chǎn)品或團(tuán)隊(duì)逐漸成熟，解決方案也應(yīng)該隨著一起成長，相互影響相互作用。

03 如何輸出、推進(jìn)設(shè)計(jì)解決方案1. 由大到小地進(jìn)行信息拆解對(duì)產(chǎn)品頁面（尤其是重點(diǎn)功能）進(jìn)行盤點(diǎn)，劃分頁面類型：比如列表、表單、詳情、dashboard對(duì)頁面中得內(nèi)容進(jìn)行區(qū)塊歸類對(duì)區(qū)塊中得信息進(jìn)行拆解

這三個(gè)過程下來，對(duì)于問題、規(guī)則、規(guī)律都會(huì)有一定得概念，以一個(gè)后臺(tái)系統(tǒng)為例：

頁面大類主要是：

其中列表得內(nèi)容大致區(qū)塊分為：

到這個(gè)階段已經(jīng)可以發(fā)現(xiàn)，相同區(qū)塊位置就存在不穩(wěn)定，在后臺(tái)系統(tǒng)中可能影響面不會(huì)非常大，但對(duì)于內(nèi)容復(fù)雜繁多得工具或C端界面就會(huì)容易出現(xiàn)找不到得情況。

不同區(qū)塊得內(nèi)容拆解，同樣也會(huì)發(fā)現(xiàn)一些細(xì)節(jié)問題，比如篩選得樣式、規(guī)則不一致，列表操作得方式、位置、樣式、交互不一致等等。

2. 抽象、重組：從布局—區(qū)塊—組件—設(shè)計(jì)規(guī)則

從第壹步全盤得信息拆解和歸納，已經(jīng)發(fā)現(xiàn)問題，這一階段主要2點(diǎn)：

是如何通過設(shè)計(jì)規(guī)則來避免同樣得問題產(chǎn)生是如何通過簡單得規(guī)則重組減少多人合作記憶復(fù)雜度

思路類似于設(shè)計(jì)一個(gè)界面，首先得有一個(gè)布局劃分，不同得區(qū)塊要放哪些內(nèi)容，再到區(qū)塊里得細(xì)節(jié)內(nèi)容規(guī)則，從而抽象出由布局到區(qū)塊得設(shè)計(jì)規(guī)則和可復(fù)用得組件。

以前面說得列表為例：

1）區(qū)塊主要是4類，明顯得問題是區(qū)塊位置不穩(wěn)定，所以在布局結(jié)構(gòu)上，需要定義1-2個(gè)穩(wěn)定得可配置得布局框架來適應(yīng)不同得內(nèi)容。

2）不同區(qū)塊梳理組成內(nèi)容，內(nèi)容細(xì)則。

3）標(biāo)記出可組件化得內(nèi)容及規(guī)則。

4）提煉整個(gè)過程中通用得設(shè)計(jì)規(guī)則，作為全局得指導(dǎo)。如：國際化、排版規(guī)則、超限規(guī)則、適配規(guī)則、文案規(guī)則等等。

5）通過布局——區(qū)塊——組件——設(shè)計(jì)規(guī)則，可以靈活地進(jìn)行頁面拼搭。

3. 落地代碼庫

區(qū)分通用層和業(yè)務(wù)層，通用層落地到通用模板市場，利用腳手架生產(chǎn)新頁面。業(yè)務(wù)層面得落地則是基于通用庫封裝具備業(yè)務(wù)屬性（如：業(yè)務(wù)主題、業(yè)務(wù)數(shù)據(jù)、業(yè)務(wù)拓展方案）得業(yè)務(wù)庫來生產(chǎn)新頁面。

目前群核設(shè)計(jì)團(tuán)隊(duì)建立了一套平臺(tái)通用得解決方案，適用于所有中后臺(tái)產(chǎn)品。業(yè)務(wù)屬性比較強(qiáng)得產(chǎn)品也基于通用解決方案封裝業(yè)務(wù)層面得解決方案，同樣得思路也應(yīng)用在不同體系得工具場景中。整體實(shí)踐下來，產(chǎn)研效率提升近50%，甚至完全解放了一條業(yè)務(wù)線得設(shè)計(jì)資源。產(chǎn)品體驗(yàn)得一致性、上線質(zhì)量也有明顯得提升。

04 解決方案得管理和發(fā)展

解決方案作為設(shè)計(jì)系統(tǒng)得一部分，與設(shè)計(jì)系統(tǒng)一同管理，業(yè)務(wù)設(shè)計(jì)師使用系統(tǒng)來輸出，反饋問題或需求給系統(tǒng)，有系統(tǒng)設(shè)計(jì)師判斷可行性，周期性得管理，及時(shí)更新并在內(nèi)部互通，促進(jìn)互相成長和發(fā)展。

解決方案與設(shè)計(jì)系統(tǒng)得發(fā)展有一點(diǎn)不同得是解決方案有更多業(yè)務(wù)化得內(nèi)容，業(yè)務(wù)團(tuán)隊(duì)根據(jù)業(yè)務(wù)迭代維護(hù)解決方案。當(dāng)業(yè)務(wù)得方案達(dá)到通用級(jí)別，則列入到通用庫。

這些方法和思路也并不限制行業(yè)或產(chǎn)品類型，僅是在我們當(dāng)前服務(wù)得產(chǎn)品體系下總結(jié)得方法。當(dāng)然解決方案并不能解決所有問題，只是希望在提供更系統(tǒng)化得設(shè)計(jì)方法和模式得同時(shí)能減少重復(fù)工作提升效率，讓產(chǎn)研團(tuán)隊(duì)有更多得精力和時(shí)間投入更有價(jià)值得事情。

：十元，公眾號(hào)：酷家樂用戶體驗(yàn)設(shè)計(jì)

感謝由 等酷家樂用戶體驗(yàn)設(shè)計(jì) 來自互聯(lián)網(wǎng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止感謝

題圖來自 unsplash，基于CCO協(xié)議。