信息圖表視覺設(shè)計

信息圖表視覺設(shè)計信息圖表視覺設(shè)計一、教學(xué)目標(biāo)：（1）知識目標(biāo)：通過本章的學(xué)習(xí)，使學(xué)生對信息圖表視覺設(shè)計的構(gòu)成要素與設(shè)計原理有一個全面的了解。（2）能力目標(biāo)：讓他們能夠熟練的掌握信息圖表設(shè)計的構(gòu)成要素以及設(shè)計原理。為后面的學(xué)習(xí)打下基礎(chǔ)。二、教學(xué)重點(diǎn)：信息圖表視覺設(shè)計的構(gòu)成要素三、教學(xué)難點(diǎn)：信息圖表視覺設(shè)計的設(shè)計原理四、教學(xué)方法：（1）多媒體教學(xué)（2）課件PPT展示以及案例展示（3）課堂討論五、授課時數(shù)：第9周：理論4課時、實(shí)踐2課時目錄1.了解信息圖表2.信息圖表設(shè)計的構(gòu)成要素與原理3.信息圖表設(shè)計的表現(xiàn)方式01信息圖表的構(gòu)成要素02信息圖表的表達(dá)原理信息圖表設(shè)計的構(gòu)成要素與原理2第一節(jié)圖圖的重要性：圖像，不僅包含靜態(tài)的圖畫、圖片、圖形、照片文字等，也包含動態(tài)的動畫和影像等構(gòu)成元素。圖的作用：使復(fù)雜抽象的信息傳達(dá)變得直觀化、形象化、藝術(shù)化，使枯燥的數(shù)據(jù)變得趣味化，更易于大眾接受和理解。常見的種類1.文字記載、敘事的同時具有視覺美與形式美常見的種類1.文字主要出現(xiàn)在標(biāo)題和內(nèi)容中，簡明扼要、可讀易懂；用來強(qiáng)化信息；注重信息編排的整體視覺效果。常見的種類2.圖形符號平面空間中用輪廓劃分出若干有含義的空間形狀；簡潔、直觀、便于信息的傳達(dá)。常見的種類2.圖形符號符號是指社會成員共同約定的，用來表示某種含義的記號或標(biāo)記。(數(shù)字)1230456789常見的種類2.圖形符號綜合來說，圖形符號就是易于大眾理解的圖案記號；常用于公共區(qū)域，一般用來引導(dǎo)公眾行為或方位。常見的種類重點(diǎn)1.圖表如何做到化繁為簡、一目了然很大程度上取決于圖形符號語言的運(yùn)用。2.設(shè)計原則：避免增加閱讀難度盡量不要使用文字。常見的種類3.插圖

插圖的作用：（1）插畫、圖解（2）例證、實(shí)例（3）舉例、說明常見的種類3.插圖插圖的基本功能簡潔明了的傳達(dá)信息引起觀者的興趣適用于表現(xiàn)復(fù)雜的產(chǎn)品信息3.插圖的形式（1）扁平化圖形圖形清晰明確輕量化的視覺感受界面圖表中經(jīng)常使用3.插圖的形式（2）線描圖形用線條勾勒科學(xué)性、比例性科普類圖表使用居多3.插圖的形式（3）手繪圖視覺效果生動、細(xì)節(jié)豐富；合理把握畫面清晰度和準(zhǔn)確度，注重信息的傳達(dá)。（3）手繪圖3.插圖的形式（4）照片特點(diǎn)：真實(shí)直觀形象地傳達(dá)事物形象；易于激發(fā)觀者的興趣。作用：（1）注目效果（2）看讀效果（3）誘導(dǎo)效果3.插圖的形式（5）動圖包含Gif動畫、Flash動畫、3D動畫吸引力、參與感、時間連續(xù)性適于展示事物發(fā)展過程3.插圖的形式（6）效果圖透視原理、一定比例、模擬真實(shí)形態(tài)；直觀、生動的表達(dá)設(shè)計意圖；涉及環(huán)境、建筑、產(chǎn)品設(shè)計等信息圖表中常用設(shè)計重點(diǎn)造型結(jié)構(gòu)真實(shí)，符合透視規(guī)律，具有空間感，注重藝術(shù)性色彩簡潔、概括、生動注意表現(xiàn)出不同材質(zhì)的質(zhì)感，使設(shè)計成果更真實(shí)，更具說服力文字?jǐn)?shù)據(jù)真實(shí)客觀，清晰明確，主題突出，排版合理重點(diǎn)圖形符號與插畫的區(qū)別：圖形符號視覺單純、抽象，往往代表某個事物的屬性、狀態(tài)、特征，約定俗成，具有通用性，更偏重于理性繪制信息、畫圖解意，基本不需要文字說明。而插畫具有裝飾性，在繪制圖形時更偏重畫師的個人感情色彩與技法。第二節(jié)表表的含義：利用表的形式將信息內(nèi)容整理的具有條理性、邏輯性，提升閱讀的愉悅感。表的狀態(tài)：是用象征性的圖形引導(dǎo)視覺理性觀看的一個設(shè)計元素，如象征主從關(guān)系的樹干與樹杈圖形，象征總分關(guān)系的花冠狀圖形，象征事物不斷向前發(fā)展運(yùn)動的列車圖形，象征事物進(jìn)化總結(jié)的金字塔圖形等等。常見的結(jié)構(gòu)1.排列通過線、面來架構(gòu)；將圖像、文字、數(shù)字進(jìn)行統(tǒng)計與歸類，理清信息的性質(zhì)和特點(diǎn)；表格狀、樹狀、金字塔狀金字塔狀閱讀順序明確清晰隱形輔助線需要有明確的閱讀順序才能使用常見的結(jié)構(gòu)2.對照兩個或兩個以上的數(shù)據(jù)或信息以圖表的形式比較分析。左右、長短、高低、圖底、內(nèi)外、虛實(shí)、動靜常見的結(jié)構(gòu)3.標(biāo)注可以起到明確信息和進(jìn)一步解釋說明的重要作用。用引線、文字、色彩對信息進(jìn)一步的指示說明，輔助類的設(shè)計手法；通過在圖表某一部分添加文字或數(shù)據(jù)進(jìn)行說明以達(dá)到圖解的作用；或單獨(dú)列出圖表中出現(xiàn)的圖標(biāo)或色塊進(jìn)行解釋說明，在一些信息龐大的圖表中非常常見。標(biāo)注的方式（1）引線通過引線將圖表中某個圖形引出，加以文字說明；或?qū)D形引出進(jìn)行放大。標(biāo)注的方式（2）注明通過文字或圖形直接在所示位置加以注明；具有看圖識字和文字圖解化的功能。標(biāo)注的方式（3）色標(biāo)采用對應(yīng)色塊來查找所指位置，再通過圖例的索引加以說明。常見的結(jié)構(gòu)4.連接圖表中的每個信息都不是孤立存在的，每個單位信息之間是通過線、面等元素來為之構(gòu)建不同用途的圖表框架，同時起到表明組織關(guān)系和相互之間關(guān)系的作用。連接的方式有很多種，有單向和多向連接，有一次和多次連接，有串聯(lián)也有并聯(lián)。這些方式由圖表所示內(nèi)容決定。常見的結(jié)構(gòu)5.流程圖表的視覺流程；圖表與其他平面排版作品最大的區(qū)別在于前者中的信息通過圖解后變得更有調(diào)理，觀看秩序性更強(qiáng)。在圖表設(shè)計中設(shè)定流程秩序是表現(xiàn)信息之間關(guān)系時常用的結(jié)構(gòu)方式，要遵循視覺秩序的基本法則和閱讀習(xí)慣，以便閱讀時能更好的獲取信息。圖表要具有明確的視覺流程，視覺流動要具有方向、起止的順序感。秩序尤為特殊和重要。常見的結(jié)構(gòu)5.流程單向從左到右、從上到下、或曲或直多向由內(nèi)向外、橫豎交叉，具有散點(diǎn)的觀看效果。常見的結(jié)構(gòu)5.流程無論是單向還是多向，一般都遵循先左后右、先上后下、先大后小、先明后暗、先動后靜的流程規(guī)律，以此強(qiáng)化圖表信息的傳達(dá)效果。常見的結(jié)構(gòu)重點(diǎn)結(jié)構(gòu)方式并不是完全獨(dú)立的，在一個完整的圖表設(shè)計中可能會運(yùn)用多種方式以達(dá)到更加清晰、明確、全面地傳遞信息的目的。第三節(jié)色彩色彩的含義：不只起到裝飾和增加美感的作用，和圖形、文字一樣起到傳遞信息的作用，色彩和圖形結(jié)合，減少文字使用的比例可以達(dá)到輕量化的舒適閱讀體驗(yàn)。在圖表設(shè)計中色彩的使用需要注意色彩的象征性、對比性以及秩序性三個方面。第三節(jié)色彩色彩的象征性：從色彩心理學(xué)來講，色彩能代表心情、冷暖、天氣、季節(jié)、輕重、味覺、性別等信息；在信息圖解中，不能以自我喜好與純粹裝飾為目的，而是用相似色、近似色讓觀眾得到直觀信息，通過色彩去分擔(dān)部分文字與圖形產(chǎn)生的視覺閱讀壓力，讓色彩也起到表達(dá)信息內(nèi)容與流暢閱讀順序的作用。用色彩圖解了水、奶、咖啡的比例成分，讓人直觀地感受到咖啡的味覺。橙色=濃縮咖啡藍(lán)色=水位置顯示配料的調(diào)和順序色彩的厚度=用量。用不同明度的顏色代表不同天氣狀況，讓人直觀地感受到天氣的變化。歷年全球各地最受歡迎的瀏覽器。每個顏色代表不同的瀏覽器，區(qū)域性的色彩能夠非常直觀的表達(dá)。美國同性婚姻合法化的圖表；彩虹點(diǎn)明了圖表調(diào)查的主題。色彩的對比性處理信息圖表中單位信息時，增強(qiáng)概念與色彩之間的對應(yīng)關(guān)系是明確單位信息的關(guān)鍵性設(shè)計方式。一個色彩代表一個概念或一個信息，如果不同概念或信息的色系使用相近，信息就無法產(chǎn)生對比性，就會造成概念的模糊。全球逾5億票房影片排行榜不同的色彩代表不同的影片票房排名。美國四大球（棒球、橄欖球、籃球、冰球）的球隊吉祥物命名，并把它們按照虛構(gòu)、軟體、魚、恐龍、鳥、哺乳、人進(jìn)行了分類。每一種色彩代表一種分類。色彩的秩序性色彩在版面中的作用除了代表信息，還要提升到視覺美的藝術(shù)層面上。利用色彩構(gòu)成的方法既可以強(qiáng)調(diào)信息數(shù)值上的變化，又能傳達(dá)視覺秩序的美感。1.強(qiáng)調(diào)套色搭配增強(qiáng)色彩的互補(bǔ)性或類似色搭配，能起到強(qiáng)調(diào)視覺層次感、增強(qiáng)信息清晰度的作用。類似色搭配類似色的色系相近，配色協(xié)調(diào)舒適。把握好色彩運(yùn)用的節(jié)奏，可以緩解閱讀疲勞感。互補(bǔ)色搭配互補(bǔ)色的色彩對抗性強(qiáng)，視覺沖擊力大，能夠增加視覺活躍感。但在一張信息圖表中，盡量只使用一套互補(bǔ)色或類似色。2.利用色彩推移將色彩按照一定規(guī)律有秩序地排列、組合的一種色彩搭配形式，可以感受到信息的規(guī)律變量過程。色彩推移的形式平行推移和放射推移利用比較多，推移根據(jù)信息數(shù)值的大小、多少可以選擇純度推移、明度推移、色相推移。障礙調(diào)查圖表，環(huán)形圖表根據(jù)調(diào)查百分比數(shù)值的減少色調(diào)也發(fā)生相應(yīng)的變化，產(chǎn)生一種純度推移?！禫ogue》雜志研究了英國女王在過去12個月的著裝打扮，發(fā)現(xiàn)藍(lán)色的確是具有“王室風(fēng)范”的顏色。有序的色彩排列方式，使版面形成了一種圖表的視覺效果?！禫ogue》雜志研究了英國女王在過去12個月的著裝打扮，發(fā)現(xiàn)藍(lán)色的確是具有“王室風(fēng)范”的顏色。有序的色彩排列方式，使版面形成了一種圖表的視覺效果。本章小結(jié)：信息圖表的基本構(gòu)成要素就