最近在負責我們公司的官網改版，現在復盤一下整體的改版過程；而改版主要的中心點在于能憑直覺讓用戶使用的產品。因此，基于這一思路，UI這一塊，對于B端產品來說，標準、規范大于創意。

提起官網設計，有些朋友可能會感覺：不就是換個樣式嗎？

的確，官網亦或者APP的更新換代是更換樣式；但也遠遠不只是更換樣式。即使是布局部分，也只是在網站核心元素不變的前提下改版。但重點是——如何通過一個細節的改變，構建一個全新的布局系統設定；讓大家透過每一個觸點，直觀感受到網站所改版解決的痛點以及新賦予的功能。

其實說到底，改版的過程就是更換精準用戶的過程。

一、我們網站的用戶是誰呢？1. 從數量上看，我們官網用戶大致分為三類

首先第一類是潛在的大企業客戶: 他們訪問網站目的是搜尋、調研，是否是可以為可靠的長期服務。

再者第二類是潛在的小企業客戶：他們訪問網站目的是搜尋低成本的服務，就是看可否節約成本。

2. 從身份上看，我們官網用戶大致分為兩類

第一類是決策者，其本身就能決定是否購買產品/服務，這類的就是以長期合作為目的。

第二類是搜索者，帶著目的收集、比對關鍵信息，供決策者參考;這是以信息服務有目的的。

而改版的目的是從目前的主要客戶，更加精準地為挖掘和服務那些剛剛成型的精準用戶。

當然了，大家都知道設計之前要確定需要;在需求分析階段，要對產品本身和行業本身有一些基本的認知。

要了解產品的基本情況，比如：

產品訴求——做這個產品是為了解決什么問題？產品目標——想實現什么目標？用戶人群——使用這個系統的用戶有哪些？不同角色的用戶有哪些具體的權限？是否需要對每一個用戶的行為都生成操作日志？產品定位——面向哪類人群，滿足哪類場景，解決什么問題？需求分析——產品的業務流程是怎樣的？功能模塊——產品有哪些主要的功能模塊？主要競品——有哪些同類型的產品？產品特色——和他們相比我們的產品有什么特色和特點？

這里就不多敘述了，因為在我看來這確定需求過程其實就是打麻將前的洗牌過程，目的是讓你從別的事情或者思緒中平靜下來，注意力轉移到這個需求上的過程。

二、開始改版前，首先確定的是定位，解決什么問題

我們的網站屬于商務網站，也就是B2B網站，那么面對的就是商務人士，也就是服務商和投資者.從情感化設計來說。

三、確定好定位后，確定設計風格

現在很多網站追求的是設計復查或者炫酷，其實簡潔的風格和舒適的留白空間是一種永不落后的潮流，沒有人會不喜歡一個干凈整潔的網站;就像家居裝修一樣，追求的是錯落有致，不是一成不變的。

有時候無論是網站還是圖片使用流行的簡約的風格，采用的標準化得導航欄，反而讓客戶能夠瀏覽到整個網站的內容，找到他們想要的信息。

已經離開蘋果的 Jony Ive 說過：簡單不是一種純粹的視覺效果，你需要理解事物的本質，才能將與之相關的一切簡化。

喬布斯也反復強調：只有當我們的產品是簡單的它才沒有科技帶來的距離感。

所以針對頁面或者產品，應是能憑直覺使用的產品才是有親和力并且觸手可及的。

最后決定設計風格偏向簡潔風。

四、確定好設計風格后，接下來就是研究原型邏輯

設計和產品沒有什么鴻溝而言，究其根本其實原型都是根據一個中心來的，它的邏輯也是根據這個中心展開的；概括說來就是產品原型中心就是定位用戶，邏輯這個定位用戶的思維處理。

1. 那我們的定位用戶又是什么呢?

我們是B2B平臺，所以面對的用戶是B端；那么我們得理解什么是B端；B端釋義為：Business，意為企業用戶或商業用戶。B端產品往往是為針對這類用戶開發的系統型軟件、工具或平臺。例如：CRM 系統、 ERP 系統、OA系統、SAAS等等。

2. 設計根據原型，用怎樣的方法進行布局

理解了原型，根據定位，頁面的設計就有了要求；那就是需要做到每一個功能點能夠清晰明確的展示，并且讓用戶知道每個功能按鈕或頁面的使用意圖。避免功能堆砌關系混亂。

不要覺得這是不必要的，就側重設計的美觀性了。

因為B端產品承載的信息和邏輯是比較復雜一些的，所以需要對功能層級的劃分呈現多考慮一點，需要有清晰的邏輯，而設計師也要多站在企業用戶的角度去考慮，使任務能夠精準化觸達。

說白了毫不拖泥帶水是設計 B 端產品最重要的工作。

在產品設計之初，需要全面考慮，把握產品設計的大方向與業務發展的一致，這樣不至于設計出來的成品不至于總是返工。

設計師也是需要同步搭建頁面通用的設計框架，統一的視覺設計語言，通用的組件的規范，這樣可快速復用提效設計，也可以把更多的精力投入到梳理產品邏輯及交互方式和功能的視覺表現上。

當然了，原型設計完成，開始做UI視覺方面的設計的時候，后端也是需要同步構思需求的實現方案。

畢竟設計不是獨立存在的，因為設計師不是藝術家，不是主觀暫居第一位的，藝術家畫一幅畫，別人看不懂或者不喜歡，我們可以說是他不是伯樂，不懂藝術；但是設計師不是，設計的本質就是為產品而服務的;因此工作中項目中，設計和開發的配合也是至關重要， 耽誤項目周期或者項目進度這是不可出現的。

因此設計也要時刻與產研團隊保持溝通，從技術和設計層面綜合考慮，哪種視覺呈現方式更合理，哪種方式更提效更穩定，支持的場景更全面……確保當前產品方案可行性，哈哈。這樣也避免了設計出來的頁面或者交互和開發進行N輪的battle啦。

因此研究好原型的邏輯的目的就是——我們設計的核心重點：界面清晰易懂，用戶的操作門檻低，能夠快速的使用產品，高效、專注完成任務。

確定好原型邏輯，就是開始設計了。

3. 初稿后出現不同的修改意見，這是不可避免的

設計的每個頁面的展示情況，總是會出現不同的修改意見，這是不可避免的。

而用戶呢（額，不對，這時候充當用戶的可能是你的產品，可能是你的領導，也可能是你的產品業務同事，哈哈哈…苦悶的審稿過程），總是在你設計的初版形式上讓再加一點其他的東西，改一些其他的東西。

我覺得啊，這是一個值得思考的問題，因為客戶的不同，總是伴隨著這些一點一點的積累開始的，也許現在的顏色，你要克制的顏色總是在改稿情景中出現，打亂你現有的布局。

對于這些不可忽視的意見或者非必須的修改意見，解決的方法就是整齊而靈活易修改的布局，及其一套設計規范和產品組件規范。

整齊而靈活易修改的布局，大白話就是將圖形化資產組件化，分可形成模板，合則可拼搭成案例。為設計值提供強大的靈活性和定制性；目的是提高了設計延展性，為不同客戶的定制化需求提供更高效的輸出。一套設計規范，目的是設計從信息層級、文字、圖標、圖片等方面進行設計走查，設計語言的規范化避免因設計控件混亂而影響設計輸出。產品組件規范，目的是建立公司產品的組件庫，組件化同類元素，提高工作效率，以便不同項目的復用及設計延展；在同一個項目中也能更好的把控該項目的視覺規范，提高效率；并且前端實現也能擁有一套可供復用和擴展的組件庫，也助力上下游交接及團隊協作。

當然了，這些都是頁面一開始著手就要確定的。

五、確定設計定稿，就是開始開發了

開發的過程，需要設計跟進，不求百分百還原，但是也要達到90%，沒有開發的配合，你的圖也就是靜態圖而已，所以，這個過程必須跟進！負責等到產品上線， 如果別人吐槽了，但是你的設計圖確實是設計的OK的，那你就哭去吧。

以上就是整個網站改版的設計復盤了，最后我想說呢，不用一直追求酷炫和復雜，簡單何嘗不是一種精致。

奧卡姆剃刀原理說過：如無必要，勿增實體，即簡單有效原理。 所以切勿浪費較多東西去做，用較少的東西，同樣可以做好的事情。

正如席克定律所言：人在面臨選擇越多的時候，所要消耗的時間成本越高。

本文由 @liang 原創發布于人人都是產品經理，未經許可，禁止轉載。

題圖來自Unsplash，基于 CC0 協議

非常感謝您讀完創新互聯的這篇文章："針對B2B網站改版，我做了一次設計總結復盤"，僅為提供更多信息供用戶參考使用或為學習交流的方便。我們公司提供：網站建設、網站制作、官網建設、SEO優化、小程序制作等服務，歡迎聯系我們提供您的需求。

網站名稱：針對B2B網站改版，我做了一次設計總結復盤
網頁鏈接：http://m.newbst.com/news47/315297.html

成都網站建設公司_創新互聯，為您提供網站維護、網站建設、營銷型網站建設、網站營銷、網頁設計公司、品牌網站設計

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯