5個設計大師不說的法則,現在就讓你知道



資訊圖表(Infographic)是「資訊」與「圖像」的完美結合!兼具「說故事」和「視覺化」兩種迷人的方法,將難以理解的數據、理論、流程變得一目瞭然,把讓人抗拒的文字、無法溝通的立場變得友善。

大家常常問:「什麼是好的資訊圖表設計?」除了好的資訊整理之外,在設計上滿足掌握記憶點、資訊層次、視覺動線、顏色運用與互動性這5個法則是我們對自己作品的標準,若你看過許多好的資訊圖表,你會發現,它們大部分都滿足這些法則。
資訊圖表將難以理解的數據、理論、流程變得一目瞭然。
資訊圖表將難以理解的數據、理論、流程變得一目瞭然。

1.難忘的記憶點—你希望讀者看完以後帶走什麼資訊內容?

最怕讀者看完資訊圖表以後什麼也沒留下,記得將設計重點放在你想傳達的資訊重點,是澄清事實、提出問題、統整比較,還是鼓勵採取行動?一味地將所有資訊圖像化只會失去焦點。
超過3個重點就等於沒有重點,參考下圖範例,如果想要強調台北市長的市「讚」率,可以將資料分成兩類:「台北市長的市讚率」和「其他五都市長的市讚率」來觀察百分比,如此一來就可以發現台北市長的數據比其他五都市長全部加起來還要多!同時因為圓餅圖中的組成類別減少為兩類,調整為甜甜圈圖(中空的圓餅圖)更能一目了然,還可以將想要強調的資訊圖像化置放於圖表中。

2.資訊的層次分明—不怕資訊多,只怕資訊沒層次

一秒鐘、一分鐘、十分鐘⋯⋯你的設計能夠讓目光停留不同時間長度的人讀到不一樣的資訊深度嗎?
通常資訊看起來又臭又長是因為缺乏「層次」,要讓資訊呈現層次分明,首先要搞清楚這些資訊的「結構」和「重要次序」:資訊的結構 一個適當的標題,再透過視覺化的方式呈現資訊結構,能讓人在第一眼抓到這些資訊之間的關係,接著看資訊內容時就比較不容易迷失在資訊裡。
資訊的重要次序 將你想要傳遞的訊息按照重要順序分層,再透過視覺呈現設計來突顯重點,例如字級使用大至小,使層次清楚呈現(最大為標題、最小至附註)、善用顏色區分重點、依照資訊的重要性安排其所佔的版面大小。

3.清楚的視覺動線—掌握注意力及眼球運動的軌跡

讓人無所適從的不是資訊內容本身,而是混亂的視覺動線設計。
只要觀眾在接受資訊時感到混亂、困惑,就會阻礙他們理解資訊,在這種情況下,你的資訊圖表在第一眼就很有可能被觀眾的大腦打槍。
影響視覺動線的重要因素:閱讀慣性。人們平常的閱讀習慣是最難改變的一件事情,其建立在閱讀行為的便利及效率之上。閱讀慣性雖然會因為文化而有所不同,但大致上遵循著從上而下、自左而右(文案採橫式書寫時)、自右而左(文案採直式書寫時)的方向。
如果想要打破一般的閱讀方向慣性,就要很清楚這樣做的動機,可能和傳遞的資訊本身內容有關,如樹的蒸散作用過程(從樹根在地底吸收水分一路往上到頂端的樹葉被蒸散出去)、也可能是為了透過打破規則創造更大的視覺張力。
想要打破規則的視覺動線需要更清楚的視覺動線引導與暗示,這時候就需要知道一些「眼睛的語言」。
除了常見的視覺引導符號(如箭頭、輔助線)和前面提到的資訊層次規劃(圖像和字體大小層級的安排),善用「眼睛的語言」,你也可以做出視覺動線清楚的資訊圖表!

4.顏色運用有邏輯—加法比減法容易

資訊圖表連顏色使用也需要經過思考規劃!初學者製作資訊圖表很容易迷失在顏色的遊樂園中,每個迷人的顏色都想嘗試,最後卻花花綠綠的讓觀眾眼花撩亂,模糊了最先想要傳達的訊息。
建議初學者從兩到三種顏色開始練習,再慢慢增加。在思考顏色運用的規劃時,可以想想這幾個問題:

. 整張資訊圖表想要給人的感受是什麼?

「是歡樂、和諧、悲傷、強烈、理性或是感性⋯⋯?」依照自己想要傳達的感受選擇適合的主色系,再依照資訊內容選擇輔助的顏色,如果想要傳達的感覺相對中性,或是沒有特別想要傳達的感覺,可以依照資訊內容本身的特性選擇對應的顏色,顏色的聯想往往和生活經驗的連結和共鳴有很大的關係,如提到水,很多人會想到藍色,提到愛情,大部分的人會想到紅色或粉紅色系,如果你想要加強讀者對於資訊圖表中提到的關鍵事物的連結和印象,用符合該事物形象的顏色會是很好的選擇;相反的,如果該事物在資訊圖表中只是配角,其實它本身的顏色更適合跟著整張圖表的色調搭配。

. 顏色的語言

「『禁止』和『通過』,你會分別用什麼顏色表示?」除了具體事物之外,還有一些抽象的感觀或體驗,像是「禁止」和「通過」,相信很多人都會聯想到「紅綠燈」,因此回答「紅色」和「綠色」。使用能夠引起溝通對象共鳴的顏色,通常能夠大幅降低誤解和困惑發生的機率,若應用得當,還能夠提高資訊吸收和記憶的效果!

5.有共鳴的互動性—創造不一樣的溝通體驗

建立連結與參與感,除了多從讀者的角度出發思考之外,還有一些具體的面向可以著手:

. 文案設計

最容易創造互動性的方法,可以對讀者說話、用問句作開頭引發思考等等。

. 引導設定

清楚的引導讓讀者知道當下該做什麼、該思考什麼,或是讓讀者知道事後該怎麼做、該改變什麼。

. 資訊提供

提供更多資訊、資源,在溝通對象的興趣和共鳴被勾起之後,可以去哪裡做更進一步的學習和了解呢?

<文摘要來源>

《人人都能上手的資訊圖表設計術:台灣第一家INFOGRAPHIC設計公司,經典案例、操作心法、製作祕笈全公開!》
#購書快易門
時報悅讀網 http://bit.ly/2wpNoYo
博客來 http://bit.ly/2vAxRaE
誠品 http://bit.ly/2vAn4x9
金石堂 http://bit.ly/2vKOjWa
讀冊 http://bit.ly/2vA9mdC
#悅讀電子書
ePUB (KOBO) http://bit.ly/2ijEuJ6
ePUB (HyRead) http://bit.ly/2vRrA9Q
PDF(hami書城) http://bit.ly/2ikHvZN
PDF (MyBook) http://bit.ly/2wvTnxx
PDF (PuPu) http://bit.ly/2iilN8x

最多瀏覽

胃氣很重要,一起來喝粥養生吧

為什麼要讀書?引導孩子找到讀書的理由

一樓分到的比樓上還少?你不得不知的都更真相