樣設計成多選的樣式既能同時
Posted: Mon Mar 24, 2025 10:20 am
案例 圖中的兩款產品在價格區間的篩選上提供了兩種控制輸入:單選框+滑動輸入數位輸入。 為什麼要這樣做呢? 篩選功能設計:互動細節全面拆解 滑動輸入和數位輸入提供了自由的輸入範圍但操作成本略高;單選框輸入範圍局限但更有效率且快速。
因此兩者結合使用會更加科學既能照顧有精確需求的用戶又能提 印度尼西亚电报筛选 供便利的選項。 案例 左圖是大眾美食類型的篩選器:預設為單選邏輯右上角有一個「多選」按鈕點擊會轉換為多選邏輯。
這個互動乍看之下還有點複雜但為什麼要設計成這樣而不是像右圖一樣設計成多選的樣式既能同時滿足單選和多選的需求介面也更簡單呢? 篩選功能設計:互動細節全面拆解 促成這種設計的可能性很多以下為可能的原因: 單選為高頻場景多選為低頻場景也就是說大部分人都在使用單選只有少部分人需要用到多選;但如果設計成多選的樣式在高頻場景下操作流程就變繁瑣了。
優先為高頻場景考慮不要一味追求統一性和介面精簡。 多選是新功能當引入一個新功能時如果無法確定效果可以不覆蓋原本的邏輯以免影響到老用戶的使用習慣。 總結 彈窗形態: 半彈窗適用於結構較簡單的篩選; 全域彈窗適合複雜的結構(如左右結構導航) 彈窗佈局: 分組折疊式選項的瀏覽效率高適合需要在多個類別下選擇選項的情況; 左右結構導航式類目查找效率高適用於類目層級較多的情況。
篩選項: 列表式排布適合檢索標籤式排布的展示效率更高; 合理外置高頻篩選項; 在選項上增加輔助描述有助於使用者決策。 作者:皮皮;微信公眾號:K權發佈於人人都是產品經理未經作者許可禁止轉載 題圖來自基於 協議 此文觀點僅代表作者本人人人都是產品經理平台僅提供資訊儲存空間服務。
因此兩者結合使用會更加科學既能照顧有精確需求的用戶又能提 印度尼西亚电报筛选 供便利的選項。 案例 左圖是大眾美食類型的篩選器:預設為單選邏輯右上角有一個「多選」按鈕點擊會轉換為多選邏輯。
這個互動乍看之下還有點複雜但為什麼要設計成這樣而不是像右圖一樣設計成多選的樣式既能同時滿足單選和多選的需求介面也更簡單呢? 篩選功能設計:互動細節全面拆解 促成這種設計的可能性很多以下為可能的原因: 單選為高頻場景多選為低頻場景也就是說大部分人都在使用單選只有少部分人需要用到多選;但如果設計成多選的樣式在高頻場景下操作流程就變繁瑣了。
優先為高頻場景考慮不要一味追求統一性和介面精簡。 多選是新功能當引入一個新功能時如果無法確定效果可以不覆蓋原本的邏輯以免影響到老用戶的使用習慣。 總結 彈窗形態: 半彈窗適用於結構較簡單的篩選; 全域彈窗適合複雜的結構(如左右結構導航) 彈窗佈局: 分組折疊式選項的瀏覽效率高適合需要在多個類別下選擇選項的情況; 左右結構導航式類目查找效率高適用於類目層級較多的情況。
篩選項: 列表式排布適合檢索標籤式排布的展示效率更高; 合理外置高頻篩選項; 在選項上增加輔助描述有助於使用者決策。 作者:皮皮;微信公眾號:K權發佈於人人都是產品經理未經作者許可禁止轉載 題圖來自基於 協議 此文觀點僅代表作者本人人人都是產品經理平台僅提供資訊儲存空間服務。