基于視覺傳達設計的信息圖設計方法研究

李湘皖

引言

《圖解力》一書中提到：針對內容復雜、難以形象表述的信息，先進行充分的理解、系統梳理、再使其視覺化，通過圖形簡單清晰地向讀者呈現出來的圖叫作信島圖。每天，我們在各種媒介中都能看到信息圖的身影。進入互聯網時代后，人類社會信息占有量達到了空前龐大的程度，亟需一種更加有效的形式予以傳播。此外，包括HTML5、CSS3等技術的完善和許多數據分析軟件的出現等多重因素，使得信息圖首次在社會各領域廣泛傳播開來。正因為信息圖的重要性被逐漸發現，有很多學者撰文研究信息圖的設計方法，比如：西北工業大學機電學院的高敏倬、陳登凱、謝凝試圖從圖形符號出發，通過研究用戶的信息加工程序和模式，開發出一個APP，讓設計師在沒有掌握專業設計軟件和手法的情況下更便捷和人性化地制作出信息圖;在《自己動手制作“感人”的信息圖》一文中，作者首先明確信息圖的類型、收集信息資料、制作草圖等流程，最后使用了網站的信息圖的在線制作服務和Adobe Illustrator軟件分別制作了兩幅信息圖。

那么是不是任何圖形和文字相結合傳達信息的圖表都能算信息圖呢？信息圖到底屬于哪種設計范疇？它有什么設計規律？如何制作出優秀的信息圖呢？

一、信息圖的設計范疇

（一）信息圖和視覺傳達設計：首先，筆者認為，信息圖設計屬于視覺傳達設計在新媒體和大數據時代，延伸出的全新設計形式。所以，當我們要分辨一張作品是否屬于信息圖時，可以嘗試將圖中的文字都遮住抹去，考察只看圖形是否能夠有效辨識這張設計作品的主要含義。如果剩下的圖形仍然能夠有效傳達信息，那它就是一張信息圖，反之，那它就不具備視覺傳達設計的特征，所以不是一張信息圖。

（二）信息圖、MG動畫設計和交互式信息圖設計：視覺傳達設計發展到新媒體時代，除了信息圖這一種形式外，還有MG（Motion Graphic）動畫設計和交互式信息圖設計這兩種形式。有時客戶不僅需要制作出靜態的信息圖，還有更高的需求。同時基于作品展示方式的要求，設計師會嘗試選擇動態的形式更有效地傳達信息，也就是MG動畫。MG動畫能更有效地傳達信息，動畫的復雜程度可以根據客戶需求決定;隨著htm15技術的發展，交互式信息圖也開始流行不同于其他的視覺傳達形式以及普通的網頁設計在這種形式的視覺傳達設計作品中，觀眾可以通過點擊的方式，獲得更深層的數據信息。以上信息圖、MG動畫和交互式信息圖三種視覺傳達設計的形式，設計的難易程度由易到難，而且靜態信息圖設計是MG動畫和交互式信息圖設計的基礎。本文討論的信息圖都是指的靜態信息圖。

二、信息圖設計的基本原則

明確了信息圖設計是屬于視覺傳達設計范疇之后，筆者就信息圖的設計特性、設計目標、設計要點和設計形式等方面，分析歸納信息圖設計的基本原則：

（一）以圖形設計為主導：視覺傳達設計要求信息圖中的圖形要通過造型、顏色、版式安排和紋理等視覺形式傳達信息，文字則起輔助的解釋說明作用。有些看似信息圖的作品中，文字和數字布滿畫面，同時起到信息傳達支撐作用，這種作品不算作信息圖，只能算是一副圖表。

（二）突出達成一個設計目標：信息圖在商業經濟中常常被用作一種營銷手段。這時，信息圖的設計目標主要包括三個營銷目的：通過增加閱讀流量達成銷售目的、通過傳達思想凸顯品牌特征、通過社會分享達到社會引領的效果。在信息圖設計和評價信息圖設計效果的時候，我們不能以這三個目標來共同衡量.而是選擇其中一個目標貫穿在整個信息圖設計過程，并以是否達到這個目標為最終的衡量標準即可。

（三）抓住用戶短暫的注意力：由于我們身處信息爆炸的時代，信息無處不在。信息圖必須把握用戶注意力集中的短短幾秒鐘：在題頭或者設計作品的視覺中心位置抓住用戶，并吸引他們繼續往下看。在豎向構圖的信息圖中，需要在題頭700dpi的范圍之內制作出能有效吸引用戶的圖形圖像內容，這大概是電腦屏幕1/3左右的位置;如果是橫向的信息圖，則應該在中心位置做出精彩的內容。（如圖1）所示，這是為英特爾公司瀏覽器制作的信息圖，在這個豎向構圖的信息圖中，我們在頂部、中部和底部可以很清楚地識別“Good ldea”（好主意）這幾個鮮明的字，這都是能吸引觀者的主意力，讓他們繼續往下看信息圖，以期發現到底是什么好主意。

（四）提煉好的設計形式：設計形式是指信息圖中組織圖形和文字的方式.比如：對比、對稱、層級遞進和均衡分布等。有時用戶提出的設計需求，讓設計師不能馬上找到合適的設計形式來表現。（如圖2）所示，客戶的意圖是為了宣傳極客文化，如果在信息圖中進行與極客相關的信息羅列，信息圖的效果將會很平淡。但是在這件設計作品中，設計師以西雅圖極客和硅谷極客為例，繪制出兩類極客的典型形象和著裝特點，讓觀者從具象的對比中獲得信息，畫面效果效果有趣、生動而吸引入。所以，要將商品信息組織概括成一種合適的設計形式，是需要設計師創意思維的。選擇了合適的設計形式，信息圖的設計效果將會非常好，同時給觀者留下深刻的印象，并極好地達成營銷目的。

（五）使用統一的計數方式：信息圖中會引用包含大量數據的圖表，其中計量數據時，有不同的計數表達方式。在一組數據的呈現和表達過程中一定要保證前后統一，否則會極大破壞信息圖的統一性。

三、信息圖的設計流程

信息圖設計和其他類型的視覺傳達設計一樣，設計的過程包括構思策劃、繪制草圖、使用軟件制作定稿、修改完善和客戶反饋等設計步驟。但信息圖又有以下的特殊性：首先，信息圖是完全基于數據的可視化設計以數據分析為基礎;其次，龐雜的信息一定要在信息圖中層次分明并通過合適的圖形、顏色、字體和版式進行組織;再次，信息圖的設計元素種類多、數量多且比較零碎，選擇合適的軟件來完成制作，用正確的思維分析客戶的反饋，常常能讓我們的設計過程達到事半功倍的效果。所以，在信息圖設計過程中，除了要牢牢把握住以上五個設計原則，還要遵循特定的設計流程。

（一）分析數據信息：將信息分層組織，讓設計師清晰明7一在給設計師呈現腳本信息時，可以將原數據信息文件按照標題、內容、數字論據等層級，使用標黑加粗的方式進行整理后，進行處理。這樣，設計師接手時，就能更好地分層、分部分將它們設計成相對應的圖形信息圖。

（二）要使用有說服力的數據論據：獲取數據時，需要注意以下的幾點：1.可以通過在搜索引擎輸入關鍵詞獲得數據;2.使用搜索引擎的過濾器來獲得更精確的信息;3.不要使用單一作者提供的片面數據信息，因為可能太過片面。

（三）注意使用一手數據：選用.gov、org和.edu這樣的網站發布的一手數據。可以在這些網站，先找到與設計項目王題相關的文章，再通過引用文獻找到更多的相關數據。同時，有時要注意避免引用這樣的數據和信息：“經研究表明……”，但并未列出是基于什么研究。

（四）繪制線框草圖：設計師完成設計作品的第一個步驟往往是繪制手繪草圖，這樣有助于設計師展開思路，但也容易因涉及方方面面，而過于細化。如果在遞交初稿給客戶的時候，呈現的是這種手繪草圖，容易在與客戶討論的過程中，糾纏于更多細節方面討論。如果，這時設計師用的是線框圖，（如圖3）所示，情況就會有很大改善。線框圖提供的是一個信息框架指引，而不是讓設計師一開始就具體到選擇設計形式。這樣就比較容易得到來自客戶的有建設性的意見。在當作初稿的線框圖中，要求繪制盡可能簡單而且精確。首先，它要告訴客戶，信息是如何在最終的作品上組織和可視化表達的，這樣客戶能根據自己的營銷目標提出有建設性的意見。其次，也能夠讓設計師自己在正式開始設計制作前，有機會在信息框架的基礎上做設計決策，如：設計風格等。如果沒有線框圖作為基礎，設計師在做設計決策時往往是采用最簡單易行的方式進行信息圖設計這樣，讓最后的信息圖設計質量大打折扣。繪制線框圖最好的工具是Adobe Illustrator，顏色最好采用黑白色的形式，這樣客戶在看初稿時，不會容易迷失在細節中。

（五）確定設計風格：信息圖的設計風格要從三個方面來決定：主題、目標和受眾.如果是悲傷的主題，就不要選擇亮色和歡決的字體。設計師可以參考設計師配色書籍和網站，確定合適的和最新的配色趨勢。除了顏色和字體，插畫的圖形風格也是確定設計風格非常重要的設計元素，比如為年輕的客戶選擇明快清新的設計風格，為商業客戶選擇商務聚焦的風格。

（六）使用Illustrator完成信息圖設計：lllustrator中有專門的圖表工具。以柱狀圖和餅圖工具為例，它們可以通過在類似Excel的輸入框中完成數據輸入，再由軟件將數據轉換成圖表，圖表的顏色和形狀都可以進行非常容易的再編輯。在使用Illustrator時，有一些使用的小竅門是經常用到的：第一，要記住幾個快捷鍵：Shift鍵可以保證對象等比例縮放;Space鍵可以方便移動選框和路徑如果要編輯圖中的一部分，則要使用蒙版，并在選取確定的情況下，使用control/Command+7鍵;按住Alt鍵同時拖拽，可以在指定位置復制對象;第二、善用Illustrator的顏色版和重新著色工具。如果我們在繪制信息圖時，使用了客戶不喜歡的顏色或發現用色錯誤，要逐個修改信息圖中的顏色將是一件非常耗時的工作。但如果我們使用顏色板和重新著色工具，就能快捷而智能地快速一次性替換多個顏色。

（七）編輯修改：當客戶看到你的第一稿之后，他們會提出一些非常具體的問題，比如，我不喜歡這個顏色或者我就是不喜歡看這個“狗”的造型等。這時，設計師要善于挖掘客戶這些要求背后的問題。比如，客戶說不喜歡這個配色，也許是顏色的配色與主題不符，而不是客戶的個人喜好問題。

（八）發行與評價：當設計師完成設計，交稿給客戶時，一定要適當闡述設計過程，并突出設計的信息圖旨在契合客戶指定用戶消費群的閱讀品味。同時，為了能夠方便客戶發布在各類宣傳媒介上，還可以在制作好的信息圖基礎上，制作一個小型的MINI信息圖。（如圖4）所示，方便在新浪微博、微信公眾號等傳播宣傳媒介上發布。最后，當我們評價信息圖是否達到客戶的設計目標時，要根據設計信息圖的原則，著重于一個設計目標來衡量。

小結和展望

信息圖設計是視覺傳達設計另外兩種流行的設計形式：MG動畫和交互式信息圖設計的基礎。這三種視覺傳達設計形式在新媒體時代都呈現出井噴的發展態勢。對比西方發達國家而言，我國的信息圖設計尚處于起步階段”。國內，針對這三類設計的設計方法理論總結還是比較缺乏的。這可能跟新媒體時代發展的速度之快，以及我國對視覺傳達設計概念的理解仍然趨于陳舊有關。過宏雷在《視覺傳達設計專業定位與課程體系建構》一文中提到“在復雜的數字化生存環境中，視覺傳達設計的專業建設要摒棄本位主義思想，借助信息、交互、體驗因素的引入，擴充新的研究領域和理論體系?！蓖瑫r，張陽也在《新媒介時代下視覺傳達設計教育的思變與創新》中提到“視覺傳達設計多元化、多學科交叉的專業定位，是設計藝術學科健康發展的必然要求?！敝挥袑W校開設了信息圖相關的課程，學生才能收獲知識，企業獲得急缺人才，教師也能更加關注并實現更多研究成果。