起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識設計復盤｜B端產品首頁設計總結與思考
業務人員在推進首頁設計的過程中，需要考慮到實際業務場景、目標用戶定位等多個方面，那么作為設計人員，你要怎么權衡各方面的需求并作出篩選和提煉，以完成首頁設計的目標？本篇文章里，作者便做了復盤，一起來看一下他的經驗總結。
首頁的內容來自于各個業務模塊，底層的數據或者內容已經在具體功能頁面實現了，但是首頁不可能呈現所有內容，產品經理需要根據產品價值和業務場景做出篩選及二次加工提煉。
另外首頁需要根據不同的客戶群和用戶角色做出針對性的設計，或者提供定制化功能，由用戶進行配置，從而帶來產品價值，提高用戶的效率。
最近剛好完成了一款門戶產品設計，今天就總結下首頁的設計過程。
一、用戶需求與產品定位
這是一款面向多角色用戶的產品，包括需求方、開發方、運營方。產品主要服務于需求方和開發方，實現從數據需求到數據產品的撮合交易。
需求并不復雜，需求方負責提出數據需求，開發方利用平臺數據完成模型開發，向需求方交付數據產品。運營方負責需求發布到產品交付的全過程管理，因此偏向于后臺管理員的角色。除此之外，每種角色還會用一些后臺管理功能，處理與其他角色的協作任務。
簡單概括下各類角色的需求：
- 需求方：查看及申請數據產品，如果沒有滿足需求的數據產品，可以發布定制化需求。
- 開發方：查看及承接需求，搜索查看平臺中的數據，利用這些數據資源完成數據產品開發，最終交付需求方。
明確了用戶需求之后，產品定位就是滿足用戶的數據需求，“實現數據需求到數據產品交付的一站式平臺”。如此以來，產品的內容基本也就確認了。整個門戶包括首頁、數據需求、數據資源、數據產品4大內容頻道。
雖然梳理了不同角色的需求，因為開發周期比較緊張，首頁內容并沒有實現動態化的設計。最終在需求方和開發商之間，我們將需求方作為核心用戶，首要目標是實現數據需求發布和數據產品的交付。
二、產品設計方向
對于首頁的產品形態，我們經歷了一個逐漸清晰化的過程。
1）思維發散
最開始內部有各種想法。
有的同事認為應該參考互聯網產品首頁，側重于產品宣傳，包括產品的價值介紹、功能亮點等。
有的同事傾向于業務內容展示，根據用戶角色附加功能性操作，幫助用戶完成任務。
有的同事則認為可以依附后臺管理功能，打造成中后臺產品的管理首頁。
每個方向似乎都有一定的道理。通過與業務方的不斷溝通，最終確定了設計方向。
2）收斂確認
平臺雖然聚集了不同的用戶角色，但仍然是屬于組織型的內部產品，最終目標是實現組織間的數據共享交換。第一階段的產品目標主要是面向一線執行人員提供各類服務。目的是幫助他們更好地完成工作任務，產品的功能性要求更高，過多的宣傳介紹信息并沒有太大的價值。
互聯網品宣類官網的設計形式并不適合當前產品的定位。中后臺的管理首頁的形態，功能性太強，不太適合大量數據的信息化展示。最終我們借鑒了互聯網電商產品的形態，便于內容展示，同時保證產品符合用戶的基本認知和使用習慣。
三、首頁產品設計
首頁的任務是面向所有用戶角色，作為信息匯聚展示，實現用戶與內容的快速連接。經過分析討論和競品分析后，我們將設計重心放在以下2個維度：
1. 平臺內容全方位展示
1）整體框架與布局
整體框架與多數網站一樣，自上而下分為頭部區、內容區、底部區。內容區又劃分為了首屏區和樓層區兩大模塊，以用戶需求的優先級進行內容布局。
2）首屏空間設計
考慮到產品定位以數據產品的交易撮合為目標，數據產品作為平臺核心信息，需要強化曝光。為了更高效地利用屏幕空間，首屏信息采用了緊湊型的設計方案。劃分為三個功能區，包含了左側數據產品列表，中間運營搜索區以及右側輔助模塊等內容。
通過產品列表可以讓用戶了解平臺豐富的數據產品品類，同時可以彌補用戶搜索過程中可能出現的不足，便于用戶逐級查找商品。
我們的平臺介于完全開放的互聯網產品和完全封閉的企業內網產品，未來將在一定范圍或者地域開放，納入不同行業的合作伙伴。因此預留了運營區域，便于后期產品功能的拓展。另外在此區域中還增加了搜索功能，一方面可以在沒有運營活動時，作為打底信息，同時可以提升搜索功能在頁面中的比重。
此外首屏空間中，我們還增加了「新手入門」、「客戶案例」、「功能教學」、「幫助中心」等入口，引導新手用戶了解平臺功能。
總體而言，緊湊型的首屏空間相對于貫穿式的Banner 廣告位，內容更加豐富，更加適合功能性的產品。
3）樓層化的展現方式
樓層是常見的展示方式，有利于內容聚焦、增強信息層次和秩序，并且相互獨立的樓層空間方便內容的擴展。
另外首頁匯集了全平臺的信息，頁面會比較長。多屏空間下，客戶的瀏覽量會逐步降低。結合樓層錨點，用戶可以快速了解整個頁面內容、定位目標樓層，增強底部樓層曝光幾率。
2. 構建用戶與內容的連接通道
用戶行為目標是具體的數據需求、數據資源和數據產品，因此需要通過各種設計策略構建用戶與內容的連接通道。
1）強化搜索
未來，平臺會聚集成千上萬的開發商和產品，搜索就成為連接用戶和各類數據產品非常重要的方式。受限于框架形式，搜索功能僅以icon形式展示，視覺效果并不突出。于是我們進行了適當的優化，在首頁Banner區增加了搜索功能。
另外在產品列表頁面，除了固有的產品分類，我們還增加了分類下的搜索關鍵詞，便于用戶直接發起產品搜索。
2）內容場景化
B端產品是為了解決用戶問題而存在的，用戶必然是在一定的場景下，才會使用B端產品。由于門檻所限，用戶可能會出現不知道該搜索具體產品的場景，只能不斷的試錯，但是用戶對自己的應用場景是明確的。
為了解決該場景下用戶的需求，我們增加了產品專題樓層，通過用戶熟悉的“應用場景”作為連接紐帶，拓展用戶與產品的連接渠道。同時產品專題聚合了一類數據產品，方便用戶集中快速查看，用戶效率更高。
3）細化內容顆粒度
無論是產品列表還是內容樓層，首頁的內容顆粒度都盡可能地細化，方便用戶直接查看具體的需求、資源或者產品，實現用戶與內容的直接連接。
4）強化前后臺聯動
由于不同的用戶角色，都有一定的后臺功能，為了實現前后臺的快速聯動，在用戶卡片區，增加了部分高頻后臺管理功能直達功能頁面，從而提高用戶效率。
四、總結
以上就是整個首頁的設計總結，其實設計方案還有很多待解決和優化的內容，后續會根據用戶的實際使用反饋逐步調整。說幾點感受：
- 首頁有各種產品形態，歸根結底產品形態要符合用戶需求和產品定位，不能盲目套用各種模板；
- B端產品的首頁設計很關鍵，是用戶了解和使用產品的第一觸點，設計的好壞直接影響到用戶對產品的認知和流量的分發；
- 首頁沒有具體的用戶需求，需要產品設計師根據自己的經驗、對用戶業務場景的理解以及競品分析挖掘，歸納出產品需求；
- 產品設計師需要能夠對首頁的需求和內容做出取舍，否則可能就會變成雜貨鋪，堆積了各種信息，雜亂無章；
專欄作家
子牧先生，公眾號：子牧UXD（HelloDesign），人人都是產品經理專欄作家。產品體驗設計師。8年互聯網行業經驗，擅長體驗設計思維、設計方法論、交互設計研究。
本文原創發布于人人都是產品經理，未經許可，禁止轉載。
題圖來自 Unsplash，基于 CC0 協議。
該文觀點僅代表作者本人，人人都是產品經理平臺僅提供信息存儲空間服務。
- 目前還沒評論，等你發揮！
