<address id="ttjl9"></address>

      <noframes id="ttjl9"><address id="ttjl9"><nobr id="ttjl9"></nobr></address>
      <form id="ttjl9"></form>
        <em id="ttjl9"><span id="ttjl9"></span></em>
        <address id="ttjl9"></address>

          <noframes id="ttjl9"><form id="ttjl9"></form>

          用戶體驗大小事—數據可視化設計五點論

          2022-12-5    seo達人

          1.數據可視化為主的APP分類

          常使用數據可視化的APP大致分為這幾類:「天氣類」「生理健康類」「財務記賬類」「數據分析類」「運動健身類」等。下面為大家介紹一些代表性的APP。

           

          「天氣類」

          「墨跡天氣」和「天氣通」根據城市實景和當下天氣對實時景觀圖進行模糊處理,增強產品的關聯性和代入感。

          「生理健康類」

          Clue會根據不同階段的心情做可視化,比如易孕期會用一些生理圖形提醒用戶你的狀態。這或許會給我們做自己的產品帶來一些思考。

          你今天真好看是一款人工智能測膚美妝的應用,會使用各圖表闡明你的膚質水平。

          「財務記賬類」

          記賬類APP和理財類APP幾乎囊括了所有圖表樣式,折線圖、餅狀圖、條形圖都不在話下。

          「專業數據分析類」

          移動端設備的高速發展,使專業的數據分析平臺不再局限于PC端展示,于是移動端的數據分析軟件也應運而生。以下為友盟和神策商店圖。

          「運動健身類」

          移動設備在消費市場得到很大的變化——從手機到可穿戴設備。移動設備越來越實惠,實現了前所未有的大面積普及。

          大家對步數、飲食、體重等數據也更加看重。市面上做的比較好的APP有:keep、薄荷健康、小米運動等。

          同事給我推薦了一個應用—garmin connect(佳明),它的界面繽紛、數據豐富、但是卻不會讓人感受到焦躁,這里面包含了一些設計原理。

          介紹這么多數據可視化為主的APP,相信大家對數據可視化已經有了初步的感受。想要做好數據可視化應該怎么著手呢?以下結合實際案例進行說明。

           

          2.可視化數據圖的配色

          在上篇文章我們了解到,顏色是有溫度和進退性的,不同的配色帶來不同的體驗。因此,可視化設計也需要考慮到配色對數據的影響。

           

          「深色底」

          深色底圖表通常為了營造一種氛圍和感覺,展示出的數據信息一般不會特別繁雜,數據選用亮度較高的色彩,這樣數據信息容易從深色中跳出來。

          「淺色底」

          如果需要清晰展示大量的數據,建議選用淺色底,淺色底上識別度相對較高。但需要注意的是:如果數據信息量太小,淺色底上會顯得頁面太空,這會讓用戶覺得你的平臺沒有內容或者熱度。當然,有經驗的設計師可以通過圖形質感、顏色等優化。

          下面就以小米運動為例:我們對2個頁面的閱讀效率進行比較。在以數據分析為主、有大量數據的頁面中,淺色底的頁面可讀性更高,閱讀效率也更高。

          「彩色底」

          有時為了讓頁面更加生動,我們將數據信息展示在大面積色塊上。商務金融類APP可采用用藍色、綠色系作為底色。運動類APP可選用的色彩自由度更高,偏活力的色彩,如橙色、黃色、橘色等都可以。

          「圖片底」

          圖片底:為了讓數據更有可信度和關聯度,在一些天氣類APP中經常會使用這種方式,圖片內容與數據信息產生關聯,提升可讀性。

           

          3.各類圖表的使用場景

          每種圖表都會對應它適合的數據類型。作為設計師一定要了解它們之間的對應關系,使得設計有理有據。

           

          「折線圖」

          顯示為一組由單個線條連接的點;用于表示在一段連續時間內發生的大量數據波動,有單折線圖和多折線圖之分。

          「曲線圖」

          顯示為光滑的曲線;如果數據是連貫的,且點與點之間的數據具有分析價值,用曲線圖比用折線圖合適。

          「餅圖&環形圖」

          環形圖可以理解為空心的餅狀圖。常用于顯示部分相對總體的百分比。還可用來顯示進度加載等。

          「條形圖&柱狀圖」

          條形圖可以理解為橫著的柱狀圖。常用于展示同屬性的數據、可以對比其數值。

          「熱度圖 / 熱力圖」

          常用于地理位置分布統計,進而可以分析景區、站點、高速等的人流分布狀況。另外APP界面的點擊熱力圖可以清晰展示哪個功能被點擊的次數最多,給我們帶來體驗優化的依據。

          「雷達圖」

          在比較多個類別程度和查看整體情況很適合,既可以查看自身整體情況,也可以對比多個方面的數據。這是一種展示效果不錯的數據表達方式,在展示整體綜合信息上很直觀。

           

          「儀表盤」

          儀表盤設計最初來源于工業設計的車輛控制臺,由于其專業、科技感的內核,現在多被一些強調科技、專業的產品所借鑒、例如網絡監控、金融信用等。

           

          4.圖表運用到界面中去

          了解基本的圖表類型后,接下來的重點是圖表的界面設計。移動設備的屏幕較之PC端小,用戶每次可接收的數據信息量小,所以如何有效運用圖表的設計是我們需要掌握的一項很重要的部分。

           

          「單個數據」

          頁面中就展示一個比較重要的數據,如何設計?圓形是一個不錯的選擇,因為它可以在頁面中形成視覺中心。不管是餅狀圖,還是環形圖,或是擁有視覺中心的雷達圖,都會讓頁面上呈現一個視覺重點。

          上圖的案例,為了讓頁面更加豐富,采用重色將界面撐滿,求得視覺上的飽滿。

           

          「多組數據」

          手機屏幕空間有限,多組數據在展示的時候一定要盡量讓主次數據的圖表類型不一致。曲線圖、餅圖、環形圖、柱狀圖等基礎圖表,交替使用,這樣使得整個頁面層次清晰,內容豐富。最常見的錯誤就是設計師沒有對信息區分層級,所有的內容看起來都一樣重要。

          當設計師面對幾大模塊展示大量的數據信息時,建議每個模塊單獨采用一種圖表類型,各個模塊的圖表類型均不同,這樣會減輕用戶對數據展示的疲勞度。

           

          5.可視化數據的動效

          動效可以提升產品趣味性,尤其在展示大量數據信息時,使用動效能緩解閱讀壓力。數據圖表中常見的動效有以下幾種:

           

          「動態呈現數據」

          「導航切換」

          「功能動態切換(點擊按鈕切換形態)」

          「屏幕橫縱向切換數據」

           

          寫在最后:希望我們都能好好把握數據可視化,把握數據時代,真正讓數據驅動業務,驅動發展。不過我們也不要為了使自己的設計看起來炫酷而加上各種發光漸變,過分的動效導致加載無能,因為完美的方案不是沒什么可以加,而是沒什么可以減。


          作者:一個辛普森

           轉載請注明:學UI網》用戶體驗大小事—數據可視化設計五點論

          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加藍小助,微信號:ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系01063334945。


          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。


          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司



          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://www.syprn.cn

          存檔

          亚洲va欧美va天堂v国产综合