中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

文章從四個(gè)方面切入，對(duì)圖表設(shè)計(jì)做了相關(guān)總結(jié)，希望能夠給你帶來(lái)啟發(fā)。

用戶在使用產(chǎn)品過(guò)程中，會(huì)接觸到大量的數(shù)據(jù)。其實(shí)數(shù)據(jù)對(duì)用戶來(lái)說(shuō)就是文字和數(shù)字的組合，大腦處理純文本的速度比較慢。例如我們來(lái)看一支球隊(duì)的技術(shù)統(tǒng)計(jì)，場(chǎng)均116.7分，28.3助攻，45.0籃板…這些數(shù)據(jù)對(duì)于我們來(lái)說(shuō)都是冷冰冰的，我們很難快速的了解其背后的含義。

圖表的出現(xiàn)可以幫助我們對(duì)數(shù)據(jù)進(jìn)行可視化處理，提升了數(shù)據(jù)的可讀性。因?yàn)橄啾扔诩兾谋?，用戶處理圖形信息的速度要快得多。

在這里我們使用的是雷達(dá)圖，球隊(duì)各項(xiàng)主要統(tǒng)計(jì)一目了然。

常見(jiàn)圖表種類(lèi)

那么如何才能設(shè)計(jì)出用戶滿意的圖表呢？要回答這個(gè)問(wèn)題，首先我們要知道目前常見(jiàn)的圖表種類(lèi)有哪些。

折線圖，曲線圖，餅圖，環(huán)狀圖，條狀圖，雷達(dá)圖，地圖等可以說(shuō)是我們目前最常見(jiàn)的圖表樣式了。具體到每種圖表適用于表現(xiàn)什么類(lèi)型的數(shù)據(jù)我這里就不多說(shuō)了，數(shù)學(xué)老師應(yīng)該都說(shuō)過(guò)，今天主要來(lái)說(shuō)圖表設(shè)計(jì)。

我們可以從以下四個(gè)維度來(lái)剖析圖表設(shè)計(jì)：可讀性，一致性，視覺(jué)層級(jí)和美觀性。

可讀性

圖表設(shè)計(jì)的初衷就是為了讓用戶浩如煙海的數(shù)據(jù)中解脫出來(lái)，圖表需要幫助用戶更好的”讀取”數(shù)據(jù)，所以在這里我將可讀性放在圖表設(shè)計(jì)的首要位置。

圖表的可讀性主要注意以下三點(diǎn)。配色，文字和群組。

配色

圖表的配色這里主要來(lái)說(shuō)背景色，一般來(lái)說(shuō)，圖表的背景色我們可以分為深色和淺色。淺色背景的圖表更有利于用戶閱讀，可以有效的提高數(shù)據(jù)的可讀性。

可能有人會(huì)問(wèn)了，既然淺色背景更有利于閱讀，那么我們就可以直接下結(jié)論了“圖表背景一律使用淺色”，為什么還要考慮深色呢？

那是因?yàn)橛械慕缑鎯?nèi)容過(guò)少，為了使界面看起來(lái)不那么單調(diào)，我們會(huì)使用深色背景。因?yàn)榻缑鎯?nèi)容本身就少，用戶一眼就能看完，所以深色背景對(duì)可讀性影響不大。但是我們要記住，當(dāng)數(shù)據(jù)過(guò)多的時(shí)候，必須使用淺色背景。

文字

對(duì)于信息的讀取，圖表可以快速但是無(wú)法做到準(zhǔn)確，這就是圖表要輔以文字說(shuō)明的意義所在。

文字的可讀性主要體現(xiàn)在字體(襯線字體和非襯線字體)，字號(hào)，配色和排版。以排版為例，用戶的閱讀習(xí)慣是從左往右，從上往下，也是我們常說(shuō)的Z型閱讀模式。這種模式下，左對(duì)齊的文字排布就非常有利，用戶可以無(wú)意識(shí)的回到段落左端，開(kāi)始新一行的閱讀。而居中和左對(duì)齊使得段落每一行左端的位置都不一樣，用戶每次都要有意識(shí)的尋找開(kāi)始位置，閱讀起來(lái)會(huì)很累。

上面說(shuō)到了用戶瀏覽習(xí)慣，接下來(lái)再給大家分享另一個(gè)容易被我們忽視用戶瀏覽習(xí)慣。我們?cè)谠O(shè)計(jì)餅狀圖的時(shí)候，份額最大的部分應(yīng)該放置在12點(diǎn)鐘方向，因?yàn)橛脩舳剂?xí)慣從12點(diǎn)鐘的位置開(kāi)始瀏覽。其余的部分按從大到小依次排，順時(shí)針逆時(shí)針都可以。

群組

群組的設(shè)計(jì)理念跟卡片式設(shè)計(jì)相類(lèi)似，都是對(duì)信息進(jìn)行分割讓用戶更容易消化。以轉(zhuǎn)賬功能為例，對(duì)于收款人信息，我們可以使用左邊的列表樣式逐條展示，其實(shí)這樣做問(wèn)題也不大，而且還省事。但是這種展示方式屬于毫無(wú)主次的陳鋪出所有信息，用戶無(wú)法明確優(yōu)先級(jí)。在這個(gè)界面中，用戶最關(guān)心的是收款人信息，而收款人信息中用戶的關(guān)注重點(diǎn)依次是收款人姓名>收款賬號(hào)>開(kāi)戶行。如果用左邊的列表樣式，優(yōu)先級(jí)這個(gè)維度就無(wú)法體現(xiàn)。

那么我們可以對(duì)信息進(jìn)行分組整合，將收款人姓名，賬號(hào)，開(kāi)戶行整合到一起，還通過(guò)使用icon來(lái)幫助用戶快速定位重點(diǎn)信息，提升閱讀速度。

一致性

一款產(chǎn)品中所出現(xiàn)的圖表肯定不止一種，為了消除不同類(lèi)型圖表給用戶帶來(lái)的認(rèn)知負(fù)擔(dān)，我們可以通過(guò)給圖表添加相同的設(shè)計(jì)元素來(lái)建立圖表的一致性原則。這些相同的設(shè)計(jì)元素可以是背景色，排版，標(biāo)題樣式等。

以咕咚為例，這里面出現(xiàn)的幾種圖表樣式都是比較統(tǒng)一的。

視覺(jué)層級(jí)

不同的數(shù)據(jù)有不同的重要程度，我們可以通過(guò)配色，群組，字體，間距等手法來(lái)使圖表的視覺(jué)層次分開(kāi)，有助于用戶對(duì)于數(shù)據(jù)的輕重緩急有一個(gè)直觀的判斷。

相比于淺色，深色背景更能吸引用戶的注意力。

美觀性

其實(shí)如果一個(gè)圖表可以滿足以上的三個(gè)條件已經(jīng)可以說(shuō)是相當(dāng)不錯(cuò)了，但是我們要更進(jìn)一步，從美觀性的角度再對(duì)圖表進(jìn)行提升。好的圖表應(yīng)該是具有美感的，最好具備有趣，獨(dú)特等要素。這樣才可以吸引用戶的注意力，讓他們想看個(gè)究竟。看到特別出彩的圖表樣式，用戶甚至?xí)シ窒??；渥龅摹皵?shù)讀NBA”就是一個(gè)非常好的例子。

現(xiàn)在我們可以看到一些圖表會(huì)引入一些動(dòng)效，動(dòng)效可以美化界面，有趣的動(dòng)效還可以起到娛樂(lè)用戶的作用，但是動(dòng)效會(huì)降低加載速度。比如下方的一個(gè)電子收據(jù)動(dòng)畫(huà)，這個(gè)動(dòng)畫(huà)看起來(lái)很酷炫，但是它的存在使得用戶需要4秒鐘才能看到交易細(xì)節(jié)。這個(gè)等待時(shí)間顯然超過(guò)了用戶的心里預(yù)期。所以在動(dòng)效的使用上，我們一定要找到一個(gè)平衡點(diǎn)。

總結(jié)

這就是我從可讀性，一致性，視覺(jué)層級(jí)和美觀性這四個(gè)方面對(duì)圖表設(shè)計(jì)的總結(jié)，希望可以對(duì)大家有所幫助。大家有任何問(wèn)題和想法，歡迎留言來(lái)交流。

#專(zhuān)欄作家#

王M爭(zhēng)，人人都是經(jīng)理專(zhuān)欄作家，資深互聯(lián)網(wǎng)人。

本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來(lái)自 Pexels，基于 CC0 協(xié)議