最近互聯網行業迎來很多波動，企業在裁員的同時，也帶來設計趨勢的變化。

造成了越來越多的 C 端 UI 設計師想要來淌 B 端體驗交互設計這趟渾水，出現了很多設計師在觀望，想要入局？但又不知道，應該如何學習？這里推薦五個快速學習的方法，能夠讓你理解 B 端設計入門知識。

閱讀書籍

雖然讀書在很多時候會被嘲笑為效率低、內容過時。再加上 B 端設計，放眼望去國內真正值得閱讀的書籍其實并不多。其原因主要是在國內，界面設計的傳播，很大程度上是源自移動互聯網的普及，也就造成了我們對于桌面端的設計理解非常欠缺。這時候不妨把視野放大，去看看國外的設計書籍。這里推薦幾本較為經典的書籍，能夠幫助大家快速入局。

《決勝 B 端》

雖然這本書主要是為產品經理寫的一本書，但是里面的很多內容也同樣適用于 B 端設計師。誰叫 B 端設計師就是半個產品經理呢？建議大家可以去閱讀這本書的前五章，書中講清楚了關于 B 端與 C 端的差異，同時你可以站在設計的角度，去思考他們之間存在的差異

《WEB 界面設計》

雖然這本書的 “年事” 已高，但是也不妨礙它里面的內容值得大家去閱讀。正因為國內桌面交互設計書籍的欠缺。也就導致了我們只能夠多去看一些國外書籍。當然里面的案例是非常久遠的，需要小伙伴們根據書中內容，結合自身產品去思考對比。

《WEB 表單設計》

表單是 B 端產品當中非常重要的一個環節。如果做過比較系統的小伙伴就會知道。一個系統當中如果不包含任何的數據，他就如同人們只有外面的軀殼。而沒有靈魂。

大家可以想一想，你再去試用一個低端產品的時候，你根本不知道這款產品的用途究竟是什么。因此在低端系統當中，表單的設計非常重要。如果你設計好了表單，也就意味著你的系統已經非常成熟。因此他可以認真的閱讀這本書。去了解表單背后設計的邏輯。他不光是簡單的信息排列組合。里面會涉及到不同字段的真正的用途。

上面這些書籍就不做過多的介紹，都是一些經典好書，看名字就知道它究竟是用來做什么的。

組件用法

在你閱讀上面的基礎書籍過后，便可以深入了解 B 端產品的組件設計。

因為從原子設計的理論來看，B 端產品就是由原子、分子、組織、模板、頁面所組成，而組件作為我們設計當中的基礎單位，等于說我們了解了組件的使用，就知道 B 端設計的基礎原理。

在組件的設計過程當中，我們可以通過目前較為成熟的設計系統去窺探一二，這也是建議很多零基礎的小伙伴需要去認真閱讀的內容。

這里建議初學者可以多看國內較為出名的三款設計系統：Ant Design、Element、Arco Design

并且在每一個設計系統里面都有對應的設計資源的分享、設計組件的解析、以及設計原則的確定，能夠讓你了解到在之后的工作當中，我們究竟需要去做哪些設計相關的事情。

當然，很多人在了解設計系統時，其實是較為茫然的，你可以通過這樣兩種方法，去對設計系統進行簡單分析：

對比法：在閱讀不同設計系統之間的設計組件規范時，通常你會感到非常的迷茫，比如在設計原則上，很多小伙伴不清楚多個設計系統之間的差異，當你對某一類型的規范產生疑惑時，這時候可以打開各大設計系統，去對比他們之間存在的差異，這樣你的理解會更加的深刻。

思考法：思考為什么他們之間會存在差異，是服務對象不同？還是產品規模差異？對于他們的差異，一定要知其所以然。不然簡單的對比只是一個笑話。

當然并不是了解了組件，就會知道應該如何設計，還記得我們剛才說的原子設計？我們還需要了解具體組件，如何在頁面當中進行使用。

組件落地

當你了解完組件過后，你對整體的設計就有了初步認識，但真實的工作當中，你會發現組件只是設計當中一小部分，除了組件之外，我們還需要去理解整個組件在頁面當中存在的意義，這樣你才能夠對組件有一個全方位的認知。

建議大家可以將每一個組件進行截圖，然后在真實落地的產品當中，去尋找一到兩個案例。試著通過頁面的分析，讓你理解到在這個產品當中，組件究竟存在于哪些頁面當中，它為什么要這樣設計？如果讓你去設計會有其他的設計結果嗎？

通過組件的頁面分析，能夠讓你快速理解在真實的工作當中，這個組件究竟是如何使用，你可以考慮一下如果是你，你會怎么去做。

頁面臨摹

頁面臨摹，一定是設計師再熟悉不過的一種方法。通過臨摹，你能夠確定閱讀的具體寬度與內容，讓你對整個產品的頁面布局有初步的認知。就像移動端設計一樣，我們 B 端產品的頁面布局也會存在一些固定的設計模式，通常情況下 B 端產品不要去標新立異，所以了解頁面的設計模式就顯得尤為重要。

關于臨摹哪些產品的頁面，我這里也會有一定的建議，可以嘗試：“Coding、飛蛾” 兩款研發管理的工具產品。

關于兩款產品的截圖，已經為大家提供了截圖版本，感興趣的小伙伴可以附件下載 “測試產品截圖” 。

前后臺推導

其實在我看來，很多 C 端轉型 B 端的設計師，缺乏的是對于 B 端產品的理解。

分享一個案例：

大家對站酷這個網站應該非常熟悉吧？假設現在讓你去設計站酷的后臺文章管理系統，如果是你，你會怎么做？

在對課程的授課當中，其實就會發現，很多人能夠合理的運用各種各樣的組件，但是在組件的選擇當中，往往缺乏前后臺關聯的思路。因為對于一個 B 端產品來說，系統當中每一個字段信息都會有在系統當中存在的意義。而我們 B 端設計，真正目的不在于將幾個信息聯合、分組。

如果你不明白這些信息出現的前后關系，對于系統而言，是不具備任何價值的。由此我們可以通過前臺頁面，嘗試著分析后臺產品的具體內容，這樣能夠幫助你進行很多聯動的思考，讓你的設計不會在評審時受到多方面的質疑。

最后說說

雖然目前網絡上信息非常的多，但是很多剛入行的同學切忌好高騖遠，先要了解基礎的設計模式才好為后續的設計鋪路，關于基礎的 B 端設計，后面還會給大家帶來一系列的分享，也希望小伙伴們能夠利用好有限的資源去更好的學習。想學習更多平面設計技巧，歡迎前往杰越教育官網！