前言

產品經理，應該具有模型思維，所謂模型，就是解決問題的套路。

把一些成熟的解決方案，抽象、提煉出來，既能提高設計效率，又能實現標準化。

這篇文章，分享B端的交互設計規范，涉及到的組件能覆蓋80%的場景。

內容較多，建議先收藏再看。

列表頁

1、查詢表格頁

1.1作用

1）展示大量結構化的數據，通過搜索或設計查詢條件定位到要瀏覽的數據。

2）當需要對數據進行排序、搜索、分頁、自定義操作等復雜行為時。

1.2布局

整個頁面包含兩個功能模塊：導航模塊和內容模塊。內容模塊包含上下兩個區塊，篩選區和表格區。

1）篩選區

篩選區的功能主要是設置搜索或篩選條件，給用戶提供準確的查詢范圍。詳細的規范見 業務組件》列表頁》數據篩選區

2）表格區

呈現數據內容的模塊，詳細的規范見業務組件》列表頁》表格

1.3交互邏輯

1）適配

大屏（寬度 > 992 px）內容區域寬度根據屏幕寬度動態變化；

中屏（寬度 < 992 px）內容區寬度不再縮小，出現橫向滾動條。

2）表格區

1、默認展示50條數據。

2、當數據撐滿視圖窗口時：表格

總結

以上是生活随笔為你收集整理的产品经理经验谈100篇（四）-B端交互设计规范的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。