https://www.ui.cn/detail/422106.html
https://www.25xt.com/appdesign/48714.html
作爲一個新時代全能打雜，日常工作包括移動端、PC端的UI設計以及各類平面視覺設計，其中自然少不了令人“禿”然的B端後臺產品設計。
畢業兩年來一直都做着B端產品的UI設計工作，參與過的後臺產品設計面對的主要客戶有公司內部、各大企業以及政府機構。工作和學習的過程中走過不少彎路，也在不同的項目中不斷反思和總結。把自己的一些想法和經驗分享出來，總結自己工作中遇到的問題和解決的方法，記錄自己思考和理解的過程，也希望對即將或正在從事B端後臺產品設計的你有一點點啓發或幫助。
希望在日後的工作和學習中，通過實踐來不斷完善自己對B端後臺產品的理解。
目錄
一、明修棧道C和暗度陳倉B
二、後臺產品設計思路
三、後臺產品設計規範
四、經驗觀點及設計資源
一、明修棧道C和暗度陳倉B
1.1初識B端產品和C端產品
按照C端產品和B端產品的專業術語來解釋的話，C端Consumer，表示爲消費者、個人用戶或終端用戶設計，直接面向普通用戶提供服務來幫助他們實現個人需求。B端Business，它面對商業和企業，是爲幫助企業集團等實現商業目的而設計的軟件、工具或者平臺。
在我們日常生活中，在手機上使用的大多是C端產品，單一的C端產品通常是爲了實現單一的需求，比如看網紅的抖音、聽音樂的酷狗、買車票的12306、社交的微信等，這些產品有自己的核心功能，其他的功能則是附加的，倘若沒有這些附加功能，雖然用戶體驗感會降低，但並不會影響產品的核心功能。
而面向B端的產品，我個人稱之爲“暗度陳倉”，當個人用戶爲實現個人需求產生了一系列動作，往往伴隨着該需求的另一端也會反饋一系列動作，即C端產品的後臺產品線（BtoC），比如淘寶賣家平臺、餓了麼商家版等。除此之外，還有面向商家、企業、業務部門提供的企業級服務產品，以及面對企業或者個人提供的平臺級工具產品等。
雖說我們日常使用的更多是C端產品，但是B端產品對我們的影響也是時時刻刻都存在着的。C端產品在明，逐漸改變着現代人的生活方式，B端產品在暗，間接服務於用戶，讓一切流程化秩序化，並且具有多個主要功能點。
——“ToB還是ToC？這是個問題......”
——“不管ToB還是ToC，最後都還是ToP（people）。”
1.2B端和C端產品的區別
在我看來，C端產品以消費互聯網爲主，B端產品以產業互聯網爲主，C端更感性，而B端更理性。
從使用者的角度來說——
C端產品關鍵詞包括免費使用、迅速上手、體驗爲王、你能讓我做什麼；
B端產品的關鍵詞則是付費購買、上手緩慢、效率第一、你能爲我做什麼。
從開發的角度來說——
C端週期短，B端週期長；
C端用戶多，B端用戶少；
C端邏輯簡單，B端邏輯複雜；
C端競品較多，B端競品較少；
C端主戰場是移動端，B端則是PC端；
C端是用戶體驗驅動，B端是解決問題驅動；
C端產品的使用決策權在用戶手中，而B端產品的使用決策權則在客戶手中（B端客戶不一定是用戶）；
C端產品除了產品的體驗以外，也要讓產品更美觀，讓活動更有趣，讓用戶更舒服，產品經理有很強的同理心，B端產品的實用性大於美觀性，能切實解決問題、配置資源的B端產品纔是一個好的B端產品，產品經理要具有更強的邏輯思維能力。
1.3後臺產品常見分類
後臺產品按其作用可大致分爲兩類，一是支撐前臺產品，二是管理各種資源。我認爲後臺產品應當是囊括在B端產品的範圍之內的，常見的類型包括：
C端產品的後臺產品線——如淘寶商家版，餓了麼商家版，對訂單和用戶進行管理，支持C端產品的業務進展；
平臺級工具產品——如微信公衆平臺，對文章和讀者的數據統計和管理；各大互聯網公司的開放平臺，如微博開放平臺等；
企業級服務產品——虛擬主機系統（VMware），雲主機管理系統（深信服、xensystem、騰訊雲）以及各種雲SaaS；
企業的業務處理平臺——對內有考勤、報銷等OA辦公系統，對外有CRM客戶管理系統，ERP資源及供應鏈管理系統。
二、後臺產品設計思路
2.1初識後臺產品設計
說起後臺產品，很容易想到複雜、龐大、邏輯縝密，而作爲設計師，苦於競品短缺、架構複雜，設計的前期工作比設計本身要複雜得多。
後臺產品不同於普通用戶所使用的APP，它在用戶初次使用和短暫時間內的認知成本是較高的。當用戶用慣了一個音樂類的app，再給他幾個其他的音樂APP，用戶是可以迅速上手並且輕易解決自己的需求的。而後臺產品則不然。
對於後臺產品來說，首先，所見之少，它並不是隨隨便便就可以下載使用的，即便你在使用的過程中，也因角色不同而受到權限限制，一般來講很難像超級管理員一樣接觸到整體功能；其次，門檻之高，後臺產品的使用者一般都是在該行業沉澱了很久，所以要對後臺產品進行設計就需要同樣瞭解該行業、甚至更能洞察該行業，業務本身的複雜性質決定了後臺產品架構也會比較龐大；然後，無論是工廠商家的進銷存管理，還是政府醫院的工作流和業務流，乃至企業內部的產品，除了不同行業都有門檻外，對信息和產品也有“保密協議”的使命感，所謂“隔行如隔山”，在後臺產品更是如此；最後，後臺產品設計往往沒有固定的功能架構和商業模式，對於產品經理的邏輯思維能力要求更高，設計師不僅僅是做界面、優化流程，也要主動和產品經理溝通交流，並對產品進行思考和探索。
這大概就是後臺產品相關資源較少、設計難度較大的一些原因。
2.2後臺UI設計工作流程
後臺UI設計的工作，大體分爲三個部分：需求分析——設計執行——數據分析。
在需求分析階段，要對產品本身和行業本身有一些基本的認知。要了解產品的基本情況，比如產品目標、用戶人羣、產品定位、需求分析、功能模塊、主要競品和產品特色。 做這個產品是爲了解決什麼問題？想實現什麼目標？使用這個系統的用戶有哪些？不同角色的用戶有哪些具體的權限？是否需要對每一個用戶的行爲都生成操作日誌？產品有哪些主要的功能模塊？產品的業務流程是怎樣的？有哪些同類型的產品？和他們相比我們的產品有什麼特色和特點？成功地做出大而全的後臺產品，是整個設計團隊和開發團隊能力的體現，而對很多小團隊來說，只能做一些大團隊不願去做的產品，或另闢蹊徑在某些方面做專做精。
在設計執行階段，參照PM給出的功能清單做原型和流程的梳理，需要關注的有當前版本規劃、功能模塊、功能類型、功能描述、任務優先級、完成時間等，交互原型則伴隨着功能描述、規則判定條件、觸發條件等內容。原型設計完成，開始做UI視覺方面的設計，而這時後端同步構思需求的實現方案。UI設計師向前端了解實現框架，方便交接和溝通。當界面實現，UI設計師應該是最早進行測試的，力求視覺設計和代碼實現無誤差。在完成設計執行後，從信息層級、文字、圖標、圖片等方面進行設計走查，進行多次設計驗證與測試。
數據分析是產品優化迭代的重要依據。進行多番測試和評審後交付客戶（或內部）使用，根據產生的具體問題進行不斷迭代，且觀察產品能否通過準確的數據反映問題、體現能力，應虛心接納使用者的使用建議並嚴謹思考其合理性，用戶的使用和反饋是優化產品的重要途徑。只有達到了管理和運營的指標，後臺產品纔是真正產生了價值。
2.3制定設計規範的作用
爲後臺產品制定設計規範有哪些作用和好處呢？簡單來說就是對產品好、對自己好、對團隊好、對客戶好。
對產品——在項目完成第一版較爲穩定的版本時，着手製定設計標準，統一公司視覺設計規範及某些特定交互設計規範。同一個項目會有多個設計師的參與，規範化的設計語言，避免因設計控件混亂而影響設計輸出；
對自己——組件化同類元素，提高工作效率，建立公司產品的組件庫，以便不同項目的複用及設計延展；在同一個項目中也能更好的把控該項目的視覺規範，提高效率；
對團隊——設計規範的制定，規範了設計團隊的輸出，同時方便了與開發團隊的交接和協作。通過設計規範的制定，前端實現也能擁有一套可供複用和擴展的組件庫，助力上下游交接及團隊協作；
對客戶——制定設計規範的同時需要考慮設計延展性，爲不同客戶的定製化需求提供更高效的輸出。同時在進行產品迭代時，設計規範的組件化調整也大大提高了工作效率。
三、後臺產品設計規範
*以下內容僅供參考和交流，圖片內容不代表真實尺寸，請結合特定產品靈活使用。
3.1頁面佈局
1）統一尺寸——據統計，目前PC端用戶屏幕分辨率佔比排名前三的是1920*1080、1366*768、1440*900，以1440來設計的話，向上適配或者向下適配誤差會比較小。 適配方案——面向多個客戶，後臺產品設計功能型頁面的尺寸統一爲1440*900，按照柵格系統原則向上或向下適配；展示型頁面以1440*900爲主，同時設計出極端情況（寬度爲1280以及寬度爲1920）的效果圖，力求實現前端實現效果和高保真設計圖誤差最小。面向公司內部的後臺系統，由於各個職工電腦屏幕是統一採購、統一尺寸，所以開發適配的分辨率可以統一尺寸進行設計，這個尺寸根據公司內部採購屏幕的尺寸和分辨率選擇即可（提前和前端溝通好）。
2）頁面框架——頁面框架主要分爲左右欄佈局和上下欄佈局，還有其他的佈局。左右欄佈局包括頂部欄、左側菜單欄、主體內容三大區域，其中頂部菜單欄、左側菜單欄爲固定結構，右側主體內容根據分辨率進行動態縮放；上下欄佈局包括頂部菜單欄和主體內容兩大區域，其中頂部菜單欄爲固定結構，主體內容進行動態縮放且需定義主體內容左右兩邊空白區域最小值；左右欄佈局時，左側菜單可收縮展開，收縮狀態下固定寬度。
3）柵格佈局——柵格系統的使用是爲了解決自適應和響應式問題，從而更好地進行產品設計和產品開發。響應式柵格採用24列柵格體系實現，以滿足2，3，4，5，6分比佈局等多種情況。固定寬度Column，將間隔Gutter進行動態縮放。需要柵格化處理的內容的總寬度=23列（1列=1寬度Column+1間隔Gutter）+1寬度Column=24寬度Column+23間隔Gutter。谷歌規定模塊和結構之間要以8px爲基準，佈局間相對間距可採用8px以及8的倍數，但一些小組件(按鈕、間隔、輸入框 )可以以4爲基準。柵格佈局是爲了輔助設計，靈活運用，不要被它所侷限。
4）尺寸設定——一般在整體區域左上角放置產品LOGO及產品名稱，大部分系統頂部欄高度48+8n，側邊欄寬度200+8n。我常用的是頂部欄高度56px，側邊欄寬度200px，側邊欄收縮狀態寬度56px，右側的側浮窗寬度400px。
5）相對間隔——定義主體內容的上下左右邊距，定義主體區域內各模塊的邊距及安全寬度，超出內容區域的部分採用區域內滾動或整屏滾動，視情況固定導航欄。
3.2標準色
1）顏色分爲品牌色、輔助色、中性色。根據不同產品的不同需求，可能也會將統計圖、標籤等進行統一標準色設定。
2）品牌色即產品主色，產品主色的設定直接影響產品氣質和直觀感受，也是產品直接對外的形象。品牌色要根據產品特性、用戶使用場景、產品定位等進行選取，儘量做好色彩的延伸性，可支持換膚。品牌色的應用場景包括操作狀態、按鈕色、可操作圖標等。
3）輔助色用於提示其他場景，比如成功、失敗、警告、無效等。
4）中性色常用於文本、背景、邊框、分割線等，需要考慮深色背景和淺色背景的差異，可以選擇同一色相控制透明度變化，用來表現不同的層級結構。
5）其他色如統計圖、數據可視化、多個標籤的不同配色方案根據項目情況單獨設定。
3.3標準字
1）後臺系統常用的字體：windows系統，中文Microsoft YaHei，英文Arial；Mac字體，中文PingFang SC，英文Helvetica；除此之外可以選擇的字體還有segoe UI、思源黑體、Hiragino Sans GB等。
2）後臺系統中常用字體大小爲12px、13px、14px、16px、18px、20px、24px、30px。
3）行高設定，根據文字大小及使用場景設置行高，一般行高=文字大小+6px/8px。
3.4圖標
1）圖標是UI設計中重要組成部分，一般分爲功能圖標和應用圖標，以圖形的方式傳達概念，可以降低理解成本，使得界面更加協調美觀。在後臺產品中，圖標的功能則更偏向輔助性，輔助用戶對功能的認識。
2）除了某些常用的圖標，有一些專業性的操作和詞彙則需要設計師進行繪製，現在比較高效方便的方法是在iconfont提供的圖標模板上用AI繪製，畫板1024*1024，提供圓形、正方形、矩形形狀(文末提供下載)。圖標尺寸按照8的倍數進行延展，繪製完成後生成svg格式文件，提交到阿里巴巴矢量圖標庫的項目組裏，方便前端調用，調整大小和顏色更爲方便，且能夠優化系統內存和性能。
3）分享一個我個人常用的AI使用小習慣，因爲ctrl+q、ctrl+w作爲退出和關閉我用的不多，而且有時候手抖會在保存時候不小心點成了關閉，所以我無情地把ctrl+q、ctrl+w變成了拓展和拓展外觀的快捷鍵......感受還不錯。
3.5按鈕
1）按鈕是後臺產品進行交互設計是重要元素，提供給用戶進行點擊操作，是視覺上最引人注目的控件，具有一定的視覺受範性。常用按鈕可分爲填充按鈕、線性按鈕、文字按鈕。
2）按鈕的交互狀態包括默認、懸停、點擊和不可用。
3）按鈕根據需求分爲不同尺寸，大中小三個級別用在不同的場景，一般按照8的倍數設定。如高度分別設定爲24、32、40px。
4）規範整理時要規定不同類型按鈕的寬高、圓角及文字大小，同時還要將按鈕的不同狀態展現出來。
5）填充按鈕之間間距最小爲10px。
3.6導航
1）導航的類型有很多種，常用的比如頂欄菜單、側欄菜單、摺疊菜單、下拉菜單、麪包屑、分頁、步驟條、時間軸、tab標籤頁、膠囊菜單、徽標數等。
2）類導航中的字體大小可進行統一設定。
3）頂欄菜單多爲一級菜單，點擊切換，或作爲下拉菜單的父級，將子級菜單合理分類。
4）側欄菜單爲垂直導航菜單，可以內嵌子菜單。
5）下拉菜單的觸發方式一般有鼠標懸停和鼠標點擊兩種。
6）步驟條引導用戶按照流程來完成任務，一般步驟不得少於兩步。
7）分頁的高度設定爲24px、30px、32px，根據應用場景適當增減內容，比如設定每頁展示數據的條數、跳轉至指定頁等。
8）麪包屑用於說明層級結構，使用戶明確當前所在位置，並且可以回到任一上級頁面。
9）徽標數用來通知用戶當前有未讀消息，一般出現在圖標的右上角或者跟在文字後面。
3.7表單
1）表單多由一條或多條列表項組成，單一列表項的類型有字段輸入框、條件選擇器。
2）字段輸入框的標題和輸入框分佈方式包括左右、上下、無標題。左右分佈是常見的對齊方式，比較適合PC端的使用；上下分佈增加了表單的整體高度，視情況選擇使用；無標題經常應用在登錄註冊，雖然減少了面積，但是增加了理解難度。
3）輸入框的交互狀態包括默認、輸入結果、提示錯誤、禁用、獲取焦點。
4）輸入框的尺寸可按照8的倍數進行設定，比如24px、32px，也可根據系統實際情況進行設定，我常用的輸入框高度爲30px，寬度視情況而定，無圓角。上下佈局的多個輸入框上下間距爲20px，有錯誤提示時候豎向增加10px或橫向顯示在輸入框右側（預留出位置）。
5）表單中標題文字左對齊，輸入框左對齊，標題文字距離輸入框20px（多個長度不同的輸入框算最長的）；標題文字右對齊，輸入框左對齊，也是常用的方式。輸入框內正文字體14px，文字和左右兩邊邊框的邊距10px。
6）選擇器包括單選、多選、時間選擇、開關切換、下拉選擇、滑塊選擇、旋鈕等。單選框多爲圓形，複選框多爲方形。
7）搜索框和選擇框的高度爲30px或按照8的倍數自行設定，通常和輸入框保持一致。搜索框距離右側按鈕4px，內部文字14px。
8）單選多選框尺寸16*16px，多個選項橫向排列間距16px，縱向排列間距8px。
9）開關按鈕外框40*20px，內部圓形16*16px。
3.8表格
1）表格在後臺產品UI設計中站的比重非常大，用來展示數據、統一管理、作爲詳情入口，是最清晰、高效的形式之一。在設計規範中需設定表頭高度、表格行高、表格列寬範圍，同時也包括表格中的按鈕樣式、標籤樣式。
2）表格主要分爲五大區域：選擇搜索區、操作區、表頭、正文、底欄。選擇搜索區放置篩選框和搜索框，爲用戶提供按需搜索，可以大大提高用戶效率；操作區指各種對錶格內容進行增刪改查、批量處理、配置列的動作；表頭展示列標題，一般具有排序功能；正文主要展示各種各樣的數據，要注意行高、對齊、分割、信息層級等，要考慮是否提供行內操作；底欄顯示分頁、總數統計等。
表格信息一般主要功能爲增刪改查，查看和編輯是最基本的功能，表格信息支持篩選、搜索、排序、分頁。對可批量操作的表格數據在第一列增加多選框。
3）行高——表格行高可設置爲表格內字體高度的2~3倍，主表格會間隔顯示不同顏色，用於區分不同行數據、加強視覺流引導，展開單行的內置表格可採用純色，選中行應有視覺上的反饋。表頭要和表格內容有視覺上的區分。表格行高可採用36、40、48、60等。
4）行數——表格行數太多加載速度會降低，延長用戶等待時間；行數太少會導致用戶不斷翻頁，降低使用效率。比較合適的默認表格行數是20或50，用戶可以根據自己需求選擇默認的行數。設定行數之後，如果每頁行數多餘每屏行數，可在表格內引入滾動條，這時可以固定表頭滾動內容。
5）列寬——列寬根據內容字段長短需要有不同且合理的默認值，使得表格字段有良好的展示效果。列內容的長度固定時，列寬應大於固定寬度（比如時間、MD5、SHA1）；列內容不固定時，能預判最大寬度的按照最大寬度設定列寬（比如IP地址、MAC地址、姓名），不能預判最大寬度的設定列寬按照常用寬度，多於內容省略以“...”展示，鼠標懸停出現完整內容（比如詳情、描述）。
6）列數——表格列不應過多，列數比較多的情況下應該合理進行合併、隱藏、刪除或進行優先級處理。常用的方法有引入配置列，用戶可自定義展示必需列以外的其他列；只展示重要信息，下拉展開列查看完整信息；在表格中引入橫向滾動條，根據實際情況選擇是否要始終固定基本信息列（如第一列是文件名）和操作列（最後一列的操作）。
7）對齊方式——表格內的文本應按照文本類型不同進行統一規範，如金額類數值保留相同位數小數，SHA1雖然是一串數字但是其實那並不是數據而是一串編碼，所以可以像文文本一樣左對齊。根據文本內容不同，對齊方式也應靈活調整，可採用文本左對齊、數據右對齊、金額小數點對齊的方式。數據前面有標籤的，將標籤前置對齊。類似IP地址、MD5、SHA1、域名這樣的信息，也可以根據產品需要在文本前面增加“複製”圖標，方便用戶調用。
8）詳情入口——表格內部數據的詳情入口，將能點擊下鑽查看詳情的內容以不同顏色表示，同時在表格行最後一列操作按鈕部分放置一個查看按鈕。
3.9反饋
1）包括彈框、側滑框、骨架屏、全局提示、警告提示、消息提醒、加載狀態等。分爲模態框和非模態框，區別是是否會打斷用戶工作流。
2）彈框又稱對話框，是疊加在應用主窗口上的彈出式窗口，以對話的方式使用戶參與進來。
3）彈框——彈框出現時，主題內容增加一層遮罩#000，透明度50%，避免使用雙層彈框，可同時採用有關閉圖標的彈框和無關閉圖標的彈框，引導用戶對內容進行正確操作。如果設定系統內所有彈框均可以點擊彈框外區域關閉， 則需要爲用戶新增或編輯內容的彈框彈出二級確認的彈框，或者再次進行交互梳理。
4）側滑框——又稱抽屜，出現在右側，固定寬度400px，高度覆蓋在主題內容之上，點擊側滑框以外的區域則收起側滑框。
5）骨架屏——爲某些特定數據提供數據加載等待時的佔位圖形組合。
6）全局提示——建議停留時間3s，可根據文字字數調整停留時間，文字內容限制在30以內。
7）警告提示——用不同顏色和樣式展示需要關注的信息。
8）通知提醒——消息通知和告警信息用通知提醒框，單個消息從頁面右側以抽屜的方式劃出，用戶可手動關閉，或停留3s後自動關閉。
3.10缺省狀態
1）繪製不同類型的情感畫插畫表示缺省狀態，如404、500、暫時沒有數據、沒有新消息等。
2）頁面需要一個默認的底色，錯誤文字使用14px，與情感化插畫間距20px，與按鈕間距30px；
3.11數據可視化
1）數據可視化部分可能是後臺產品中對視覺設計要求較高的部分，使用情境爲各類統計圖、大屏展示頁面等。
2）功能型頁面的數據可視化可以引入圖形化設計組件，Echarts、G2、d3等；展示型頁面的數據可視化則可以做的更有趣，比如立體的統計圖、粒子地球效果、靈活有趣的網絡拓撲圖等。
3）考慮到數據可視化可能會需要深色淺色不同的背景，在數據可視化統計圖的色彩搭配上要注意顏色的拓展性。
四、經驗觀點及設計資源
4.1設計前端一家親
Ant Design的設計組件，實現框架React、Angular——https://ant.design/docs/spec/layout-cn
Element的設計組件，實現框架Vue 2.0、 Angular——http://element-cn.eleme.io/#/zh-CN/component/checkbox
iView的設計組件，實現框架Vue——https://www.iviewui.com/docs/guide/theme
飛冰的設計組件，實現框架React——https://alibaba.github.io/ice/
Layui的設計組件——https://www.layui.com/demo/grid.html
G2可視化圖形組件——https://antv.alipay.com/zh-cn/g2/3.x/demo/index.html
Echarts可視化圖形組件——https://echarts.baidu.com/
d3.js可視化圖形組件——https://github.com/d3/d3/wiki/Gallery
在線柵格化計算工具——http://grid.guide/#/1000/24/34/8/0
4.2不醜也要多讀書
《B端產品經理必修課》
《交互設計精髓》
《U一點料·Ⅱ》
《簡約至上:交互式設計四策略》
4.3文章和作品推薦
Christie Tang《如何更好地使用柵格系統》——原版https://uxdesign.cc/responsive-grids-and-how-to-actually
use-them-970de4c16e01 中文版https://www.ui.cn/detail/465158.html
UXBoy《柵格系統及其在後臺設計中的應用》——https://www.uisdc.com/grid-system-and-application-in-background-design
蝸牛醒《新人來收！10分鐘幫你掌握柵格系統基礎知識！》——https://www.uisdc.com/grid-system-basics
MrLei《原子化設計-後臺產品組件庫建設》——https://www.zcool.com.cn/article/ZOTYyNTQw.html
八戒Maria《如何寫後臺系統UI設計規範 》——https://www.zcool.com.cn/article/ZODIwNTg4.html 千夜Ryan
Vision《B端產品設計》——https://www.uisdc.com/product-design-to-business
Z清暉《面向企業中後臺產品的設計系統大合集》——https://www.ui.cn/detail/409269.html
BruceXLS《B端網頁設計規範全方位彙總》——https://www.ui.cn/detail/427365.html
可樂Cola《如何利用走查表驅動設計改版》——https://www.ui.cn/detail/451478.html
Michal Parulski的後臺可視化設計作品——https://dribbble.com/Shuma87
zoeyshen的後臺可視化設計作品——https://dribbble.com/zoeyshen
三魚先生的數據可視化設計作品——https://feizai.zcool.com.cn/
寫在後面
不管是做C端產品還是B端產品，都是爲了實現用戶的需求、幫用戶解決問題。
剛接觸後臺產品的UI設計師工作時候，最希望能把產品做的炫酷、美觀，工作中慢慢地發現項目的背後思考更爲重要，產出的設計成果也應該有理有據、支撐整個設計體系。網上供大家使用和學習的資源非常多，對一些公司來說、專門去制定一套自己的後臺設計規範不免顯得費時費力，合理引入antdesign和element等開源的設計組件，會使得設計師以及設計師的好朋友前端小哥哥事半功倍，有助於設計師把更多的精力投入到沉澱行業知識、研究產品架構、梳理交互方式和創新視覺表現上。
在後臺產品的設計過程中，更應該把寶貴的時間用在更值得關注的事物上，讓設計師能夠輔助業務挖掘，從趨於相同的表象中找到產品獨有的閃光點，從而切實解決問題和實現價值。
希望對你有幫助。