溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
本篇內容主要講解“有哪些實用的數據表單設計技巧”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“有哪些實用的數據表單設計技巧”吧!
對于大多數 SaaS 平臺，數據表單是必不可少的組件，可讓用戶獲得相關數據和洞察，從而采取正確的決策。
作為一個前企業家，我使用過各種 SaaS 平臺，例如 Mailchimp，Shopify，Klaviyo，Zendesk 等。它們提供不同的服務 —— 電子郵件、訂單管理、客戶服務等解決方案，其共同點是，都需要將數據反饋給用戶。而數據表單則是傳輸大量數據最好的方法。
數據表單之所以有效，是因為它們能夠有序地組織信息和數據，使用戶能夠輕松地掃描、比較和分析自己選擇的信息。這篇文章介紹了我在設計數據表時遵循的關鍵設計模式。
這一點對于超過 30 行的表單尤其重要。當用戶必須向下滾動才能查看所有可用信息時，如果沒有固定表頭，用戶將很難理解和區分多行數據 —— 其中大部分可能是隨機數。一個固定的表頭可以幫助他們輕松地使用數據表，避免了向上滾動查看字段含義 。
我傾向使用 8px 網格系統進行設計，將表頭尺寸保持在 16px(最小值)—— 防止你的設計看起來過于沉重和擁擠。
對于數據表單，需要兩個組件對所有信息進行排序。一是表頭，用于理解顯示的數據。二是固定側欄 ，與每一行數據相連接 ，常用于項目名稱，例如活動名稱、產品名稱、股票名稱等。
當數據表單需要水平滾動展示隱藏列時，通過固定第一列項目名稱，可以獲得與固定表頭相同的組件優勢，提升信息傳達效率。
設計固定側欄時，請在該列的右側添加陰影和垂直分隔線，提示用戶該表支持水平滾動。
△ 當數據表有太多列時，通過固定第一列項目名稱，使表單更易理解
自定義欄允許用戶根據自己的偏好選擇表單顯示內容。當涉及多個指標和數據集時，該功能可以滿足不同的用戶目標 。常用于自助廣告平臺，例如 Facebook Ad Manager、Google Ads、AdRoll 等，在這些平臺上有多種營銷指標，每個用戶的優先級都不同。
△ 自定義欄允許用戶根據自己的喜好對數據表進行個性化設置
我從開發朋友那里學會了對表單進行分頁，通過限制正在處理的信息量，減少加載時間。另一種方法是使用漸進式加載，當鼠標滾動到最后一行時，表單自動加載一組新的數據。對比后者，分頁器允許用戶一次跳過好幾個組數據，滿足用戶非連續性瀏覽的需求。
大多數表單每頁顯示行數可能超過 30 行，因此，將分頁器固定在表單頂部或底部會更加友好，方便用戶在頁面之間切換，無需過度地快速滾動。
△ 使用分頁可以減少加載時間，因為它限制了正在處理的信息量
過濾器組件對于篩選目標信息、屏蔽無關數據量至關重要。日期篩選是最基本的過濾器，能夠根據用戶指定日期來顯示信息。當每列具有固定的展示字段，這意味著信息不是隨機的，而是固定的選擇，您還可以設置單項信息的過濾器。
最好在過濾器下拉列表中提供復選功能，允許用戶選擇多個變量 —— 過濾系統越靈活，用戶就越容易操縱他們的信息。
△ 過濾器組件對于減少根據用戶要求顯示的數據量至關重要
排序類似于過濾，可以根據用戶的需要重新排列信息，調整信息展示順序。在大多數情況下，左列會對表單進行默認排序，用戶可以單擊標題對表單進行相應的排序設置。
您可以將排序添加到表頭中，例如按數字或字母順序對各個數據進行排序。但請不要濫用此功能，它對于狀態或類別等特定指標，可能是多余的 —— 過濾器處理這些數據會更合理。
盡量避免使用線型圖標，選用面型圖標來增加可見性。懸停狀態能夠傳達整個區域可單擊的視覺提示 。
△ 排序類似于過濾，根據用戶的需要重新排列信息
復選框允許用戶選擇多個項目，并對所選項目執行某種操作 。幫助用戶節省時間和精力，不必重復相同的步驟。想象一下，所有的行都有相同的選框，這些選框會重復出現 —— 這會使你的表單看起來雜亂無章。
我通常將復選框的大小保持在 24px(最小尺寸)，居中布局，提高可用性。此外，高亮顯示被選定的行，增強對比性 。
△ 復選框允許用戶選擇多個項目并對所選項目執行操作
“極簡主義” 這個詞已經被廣泛地使用，空白似乎是現在的趨勢，但在這種情況下，少就是多。在設計數據表單時，重點應該放在數據本身而不是用戶界面上。用戶已經在與大量的數字和信息交互，復雜的界面只會增加用戶的認知負荷。
沒有必要添加額外的視覺干擾，例如不必要的圖標、斑馬行、隨機顏色等。
△ 當你讓你的 UI 設計師瘋狂的時候會發生什么?
在設計中，排版是樣式指南中的一個關鍵元素，對于品牌推廣至關重要。但在設計表格時，您應該遵循上面的指示(簡單和簡約)，不要在表格中使用任何復雜的字體樣式。
沒有推薦的字體，但建議盡量避免使用襯線字體，因為它們往往會吸引人的注意力，導致額外的視覺負擔。此外，避免出現大寫單詞，它會使你的設計看起來沉重。
△ 襯線字體在表格上看起來很奇怪 —— 不知道你們是否看到過使用襯線字體的數據表單
對于特定的表單，項目名稱還可以充當鏈接，這是一種符合用戶習慣的交互形式，用戶很容易理解鏈接會將其帶到何處。
設計文本鏈接時，請使用不同的顏色向用戶展示此鏈接 —— 僅在文本上加粗或設置下劃線并不能提供足夠的視覺提示。
設計文本鏈接時，請使用不同的顏色向用戶展示此鏈接
表單的操作通常放在最后一列。當沒有太多的信息列，需要水平滾動信息時，這種模式就很適合。也可以將操作放在第一列或第二列，這樣用戶就不需要在滾動時跟蹤這一行，但操作較多時，可能會產生認知過載，導致不必要的錯誤。
鼠標懸停可以保持簡約的外觀 —— 只有當用戶將鼠標懸停在相應的行上時， 操作圖標和文本才會出現。
到此，相信大家對“有哪些實用的數據表單設計技巧”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
