InforGraphic(信息圖表)是近年來逐漸興起來的一種設(shè)計表達,又稱Data Viz (數(shù)據(jù)可視化),其最大的特點就是將一些冷冰冰的數(shù)據(jù)及信息以豐富的設(shè)計語言表達,在信息能夠清晰傳達的同時又給人賞心悅的感覺。當然,信息圖表并不是什么新產(chǎn)物,它其實一直存在,就算在互聯(lián)網(wǎng)時代以前,很多雜志及報刊在傳達數(shù)據(jù)及信息時就曾經(jīng)有過類似的設(shè)計。而在很多編輯軟件中,我們也可以輕易產(chǎn)生一些柱狀及圖餅形的數(shù)據(jù)展示。那與今天所流行的信息圖表有什么不同?如果用一句話來表達,那就是,以前的圖表著于數(shù)據(jù)的可讀性,而今天在保證數(shù)據(jù)的可讀性前提下,也著重于數(shù)據(jù)的可觀性。
在今天,信息圖表已經(jīng)成為信息有效傳達的強有力工具,特別是在外國,無論是大中小型公司,有很多都已經(jīng)開始嘗試用信息圖表來進行品牌的構(gòu)建、公司年度報告設(shè)計、向特定客戶群傳達及進行教育,而且大多數(shù)都是通過互聯(lián)網(wǎng)來傳播,使到其資源及面向的人群非常之廣,可以說,現(xiàn)在的設(shè)計師如何能夠出一個好的信息圖表已經(jīng)逐漸成為一項必須掌握的內(nèi)容。而在表現(xiàn)形式上,可以是靜態(tài)的,也可以利用象FLASH進行交換式展示,甚至是視頻展示。
數(shù)讀是網(wǎng)易一個面世時間并不太長的新欄目,聲稱用數(shù)據(jù)說話,提供輕量化的閱讀體驗,而該欄目在每期中均采用了以信息圖表為主的展示方式,而從出來的效果來看,我個人感覺視覺效果還是非常不錯的,基本遵守設(shè)計為數(shù)據(jù)傳達服務(wù)的設(shè)計原則。在本文中,我嘗試結(jié)合該欄目信息圖表設(shè)計的一些要點,選擇其中的個別信息圖表設(shè)計來進行分析。
一、不要告訴,要展示!
在《乘機必讀,看哪種飛機最安全》一文中,編輯要傳達幾個重點信息,危險地點(飛機發(fā)生危險的多發(fā)地點)、危險時刻(飛行時哪個時段最容易出現(xiàn)危險)、安全駕駛(哪種飛機型號相對更安全)、安全位置(在飛機上坐在哪個位置相對更安全)及安全概率(與其它導(dǎo)致死亡的情況相比)。每個標題都涉及很多數(shù)據(jù)要表達,但如果只是用文字,這幾個意思用幾行字就可以告訴讀者(但讀者有沒有興趣聽是另一回事),而本文中編輯在每個標題中都使用了圖表來設(shè)計,雖然整個設(shè)計顏色很節(jié)制(僅用了兩種顏色),但已經(jīng)足夠引起讀者的興趣。
在設(shè)計中,不僅僅是羅列數(shù)據(jù),而是進入主題的情景之中,用設(shè)計語言形象化地進行表達。上圖通過簡單的圖案形象化地表達從起飛到降落的整個過程,配上數(shù)據(jù),讓人一清二楚。
在《失敗的中國式控煙 全球四成香煙中國制造》一文中,在細節(jié)上通過香煙作為數(shù)據(jù)的背景,簡單直接,而在右則,則進一步形象化地傳達出這個數(shù)量的對比,這種表達可以進一步加深人們對數(shù)據(jù)的認識,而不僅僅是知道一個數(shù)據(jù)。
在《方興未艾的中國高樓競賽》一文中,采用了高樓剪影來排列,雖然這種方式非常常見,但既然有效,用多幾次也沒有所謂:
上述三個例子就是通過真實的圖案或模擬事件的情景來表達。
二、打破常規(guī)的表達
信息圖表在表達上是需要通過充分的設(shè)計語言來表達,打破常規(guī)的一些表達能夠使信息圖更容易抓住讀者的眼睛,整個圖表富吸引力,但在這里,需要留意一點的是,必須避免設(shè)計過度,不要忘記你的終極目標是數(shù)據(jù)及信息要傳達,最理想的狀態(tài)當然是設(shè)計及數(shù)據(jù)得到完美的平衡。
在《中超俱樂部生存狀態(tài):貧富差異大,收支難平衡》一文中,設(shè)計人員打破了以往通常的柱狀、直線圖及圓餅,利用圓環(huán)來表達數(shù)據(jù),能夠讓人產(chǎn)生視覺吸引力的,同時也與表達的足球主題非常契合。
圓環(huán)內(nèi)部下方通過傳統(tǒng)的直線統(tǒng)計圖傳達其它項目的統(tǒng)計,與圓環(huán)結(jié)合是一個很理想的搭配及互補。打破常規(guī)的表達可以形成一個焦點,所以并不需要在一個設(shè)計中所有圖表都要出人意表地進行這種設(shè)計,否則顯得有些凌亂。在本文的其它統(tǒng)計數(shù)據(jù)中則采用了傳統(tǒng)的圖表。但顏色卻必須一致地應(yīng)用,這里的藍綠鄰近色的搭配貫穿了本文的所有設(shè)計,使整個設(shè)計形成清新、和諧及符合主題的氣息。
在《中國外科整形數(shù)世界第二 十年毀掉20萬張臉》一文中,只有一張圖片,所以這張圖片是否能夠產(chǎn)生吸引人的效果至關(guān)重要。
在《透明的美國政府官員財產(chǎn)》一文中,用下圖表達了駱家輝的個人資產(chǎn)構(gòu)成:
三,產(chǎn)生一個視覺焦點
萬變不離其宗,與其它的平面設(shè)計一樣,在設(shè)計一些信息較多的圖表時,有一個視覺焦點,更加容易使人認清主題,引起閱讀的興趣。
在《中國電影票價占人均收入1/57 為美國的8.5倍》一文中,希望通過數(shù)據(jù)來說明中國電影票價的昂貴。切入點可以有很多,本文的設(shè)計人員選擇了爆米花作為點題,由于其尺寸及位置都很突出,使它無疑成為了一個視覺焦點。再通過形象化的表達,傳達出各種相關(guān)的數(shù)據(jù)。
圖表的排版使讀者輕易能夠知道閱讀的順序
四、顏色
信息圖表中的顏色運用當然可以是豐富多樣的,但如果作為主要是網(wǎng)頁傳播的信息圖表,你也不能過于為所欲為,通用性及中性是優(yōu)先考慮的顏色搭配。有很多信息圖表都會分享到其它網(wǎng)頁及博客上被人瀏覽,一些過于刺眼的顏色應(yīng)該盡量避免,而中性的顏色(特別是一些不飽和顏色)可以使信息圖表符合最多數(shù)人的審美觀。
網(wǎng)易數(shù)讀考慮到其自身風格,他們往往采用白色背景,但如果你為客戶設(shè)計的信息圖表,我倒不贊成你過多使用白色背景,因為大多數(shù)網(wǎng)站的背景也是白色,一個白色背景的信息圖表放在一個白色背景的網(wǎng)頁上,有時會造成不知從哪里開始的困惑,加上一個背景,則形成了自己的地盤。
數(shù)讀大部分的色調(diào)都不會超過三個,三個色調(diào)已經(jīng)足夠(當然,這里并不存在一個絕對標準),這也可作為我們設(shè)計的一個基本準則,如果有背景的話,最淺的色調(diào)作為背景,其余兩種色調(diào)作為上面元素來設(shè)計。如果你無法判定你的主題應(yīng)該用哪種色調(diào)準確,除了查找相關(guān)顏色搭配書籍,其實有些網(wǎng)站可以幫助你完成這個步驟。如:Adobe’s Kuler及COLOURlovers ,你只要懂點簡單的英文就可以按照自己的主題來尋找顏色搭配效果往往非常不錯。
在《比百度百科靠譜的維基百科》一文中,設(shè)計人員通篇只有了三種顏色(粉紅,粉藍,灰色),就產(chǎn)生了良好的效果:
而在中國這一行,則采用突出的其它顏色來強調(diào),這是一個恰當?shù)倪x擇,通過這種強調(diào),呼應(yīng)了標題,這也是信息圖表的一個吸引力,能夠產(chǎn)生不比不知道,一比嚇一跳的感覺。
這個圖表雖然使用了簡單的柱狀,但由于是向下指向,由綠至紅過度,形成了一下地層的構(gòu)造,符合主題的氣息(水深火熱嘛),而男足的直線條則與柱狀圖表形成雙重對比(形狀及數(shù)據(jù))。
五:文字
文字與顏色一樣,必須節(jié)制清晰,從理論上說,網(wǎng)頁上的字體要比印刷品的字體使用得更節(jié)制,數(shù)讀中的字體有時甚至通篇只使用一種字體,當然,使用兩三種問題都不大,但無論何種字體,都應(yīng)該平實、端莊及清晰。
在《18億畝紅線安全的只是數(shù)字》下圖中所有中文都使用一種字體,無論是標題還是說明文字。從橫向比較來看,這種字體也是數(shù)讀的最主要字體,這也形成了一種清晰的系列感。當然,將主標題或副標題采用另一種字體也是一種完全可以考慮的。
六、增加氣息
恰當?shù)卦黾右恍┎鍒D能夠活躍版面,填充空間,平衡視覺,但這些插圖一般在視覺上不能強于信息圖表,同樣是上文《18億畝紅線安全的只是數(shù)字》,設(shè)計人員加了兩幅插圖:一是中部的線條勾勒圖,由于只是線條構(gòu)成,在視覺上只是起到一個輔助補充的角色。而在最下方,拖拉機的插圖雖然顯得厚重很多,但這個位置已經(jīng)是本圖表的最下方,所以并不會對上方的閱讀造成干擾(但在顏色上仍然與本圖表的色調(diào)一致)。
七:交換式的設(shè)計
利用一些新的動態(tài)設(shè)計,可以使圖表給人一種更吸引人的感覺,同時也增加了一種參與感。在《超150年老字號企業(yè)中國僅5家,日本上萬》一文中,通過移動的拉桿,直觀地傳達了主題的數(shù)據(jù)。
讀者可以拉動拉桿,地圖上會出現(xiàn)不同年代出現(xiàn)的企業(yè)并且仍傳承至今的地區(qū)(圓點不是指數(shù)量),而鼠標點擊圓點,則出現(xiàn)具體的企業(yè)數(shù)量。
結(jié)語:
數(shù)讀的編輯人員在設(shè)計各期的圖表上,都體現(xiàn)了一種清晰簡潔悅讀的體驗,而且由于各種基本原則能夠在各期都得到一貫的應(yīng)用,也使該欄目賦予了鮮明的設(shè)計風格,其中的一些要點是可以使初學信息圖表設(shè)計的讀者一點啟發(fā)的。
顧名思議,數(shù)讀主要以數(shù)據(jù)為主,但有些信息圖表,可能還會有很多文字及背景介紹,在處理這些復(fù)雜的圖表時,必須將設(shè)計信息圖表理解為設(shè)計人員在講一個故事,有開始,有發(fā)展,最后是結(jié)尾。這也需要設(shè)計人員具有一定的邏輯統(tǒng)領(lǐng)能力,在處理前先用鉛筆畫一個草圖是一個不錯的選擇。另外,在圖表設(shè)計上應(yīng)該嚴謹科學,在比例及對比上應(yīng)該符合各個數(shù)據(jù)的關(guān)系,一些基礎(chǔ)的餅狀及柱狀等應(yīng)該用真實的數(shù)據(jù)產(chǎn)生,然后再進行美化。
最后也不厭其煩地再說一次:信息圖表是為了讓數(shù)據(jù)更容易更清晰地表達,而不是僅僅為了設(shè)計而設(shè)計。過于著重設(shè)計是否漂亮而輕視數(shù)據(jù)的清晰表達似乎是目前很多信息圖表設(shè)計最容易出現(xiàn)的一個誤區(qū)如果你的客戶寧愿看EXCEL圖表而不是看你設(shè)計的圖表,則基本可判定這個圖表設(shè)計得不清晰。