視覺理論下的多媒體課件界面設計分析

趙潔　何健民

摘要：多媒體課件被廣泛的應用于課堂教學中，在視覺心理下，課件給人的第一印象是界面的設計。界面精心的版面設計和完美的藝術構思，有著提高教學效果的作用。該文從視覺理論的角度，通過文字的設計、背景和圖片的選取、動畫效果的運用、色彩的搭配以及整個的版面布局來對多媒體課件的界面設計進行分析。

關鍵詞：視覺理論；多媒體；課件；界面設計

中圖分類號：G642 文獻標識碼：A 文章編號：1009-3044（2014）33-8004-03

Abstract：Multimedia courseware has been widely applied in classroom teaching， in the visual psychology， courseware gives the first impression is the interface design. Layout design meticulously interface and perfect artistic conception， with the teaching effect. In this paper， from the visual angle of the theory， character design， background and the selected pictures， animation effects， use of color selection and matching as well as the overall layout to the analysis of multimedia courseware interface design.

Key words： visual theory； multimedia； courseware； interface design

據(jù)統(tǒng)計，在人類通過感覺器官收集到的各種信息中，視覺約占65%。在視覺理論下，一個優(yōu)秀的多媒體課件僅有其專業(yè)知識的內容是不夠的，還要讓人賞心悅目，才能讓學習者對學習的知識進入長時記憶。而多媒體課件的界面是多媒體系統(tǒng)的視覺平臺，因此，界面精心的版面布局，豐富的色彩和動畫效果的搭配，讓頁面圖文并茂，重點突出，吸引學習者注意力的同時，還加深其對教學內容的記憶與理解。

1 多媒體課件界面設計中存在的問題

1.1 缺乏整體的美感

課件的界面在整體的版面布局、色彩搭配上設計的不恰當，以至于給人的第一印象就是缺乏美感，吸引不了學習者的注意力，達不到預期的教學效果。

1.2 內容元素組織凌亂

整個課件的界面過于花哨，內容組織的比較凌亂，無秩序感。一個頁面里呈現(xiàn)的內容不是過多就是過少，重點不突出，學習者能記憶的極少。

1.3 主題背景與所選取的文字及圖片不搭配

在制作多媒體課件時，教師為了方便快捷，會采用固定的模板去設計其界面，完全不考慮其形式與內容是否統(tǒng)一。為吸引學習者的注意力，界面上會過多的插入與內容無關的圖片。在文字的設計上，忽略了字體的字號及顏色與主題背景的相搭配。

1.4 動畫效果運用的不恰當

動畫的設計在課件里有著畫龍點睛的妙筆。部分教師為了省時省力，在課件界面設計時，畫面內容多以靜態(tài)形式來呈現(xiàn)，以至于界面出現(xiàn)形式單一的效果，過于呆板。另一部分教師卻是為了吸引學習者的注意力，過多的展示動畫效果，使各種形式的動畫設計效果充斥整個頁面，給人眼花繚亂的感覺。

2 視覺理論下的多媒體課件界面設計

2.1文字的設計

文字在多媒體課件里是最基本的元素內容，是傳遞教學信息的主要載體。在進行文字的設計時應注意以下幾個方面的問題。

首先，文字內容必須簡潔明了，在對教材內容理解的基礎上，讓表述的語句簡明精練、重點突出，真正做到是對教學內容要點的展示。對于重點和難點，可以通過對字號大小、粗細、樣式、色彩的設置來區(qū)分。

其次，字體的選擇必須選擇容易閱讀的字體，盡量少用或不用潦草的字體。正文部分通常采用宋體、楷體等書寫規(guī)范的字體。大號標題部分一般可采用藝術字體樣式，小號標題一般可采用黑體、隸書、華文彩云等樣式略粗的字體。同時，字體的選擇要有統(tǒng)一的風格與層次感。

最后，字號大小、樣式及色彩的選擇應該滿足教學需要。通常情況下，字號盡量選擇20號以上的，保證學習者能看清楚屏幕上的內容。文字的顏色應該與背景色區(qū)分開來，避免其顏色相重疊。

2.2 背景和圖片的設計與處理

在界面設計里，背景尤為重要，它決定著課件的整體設計風格及整體基調?？梢园凑找曈X理論里格式塔的規(guī)則來設計背景。即人們是在確定了背景的前提下對視覺形象進行認識，這種圖底分離的形象認識方式是人最基本的認知方式[1]。同時，在設計背景時，應該形成統(tǒng)一的風格，有一個整體基調。

圖片能更直觀的傳遞信息，易于學習者理解。在選取圖片的時候，一定要考慮所插入的圖片是否與內容相符合，是否易于理解。因此，對圖片的選擇盡量精選，還要根據(jù)需要用Photoshop圖像處理軟件對圖片進行處理，例如，用裁剪工具對圖片進行剪裁，用仿制圖章工具，修補工具等可以去除圖片上的標志，用魔術棒、套索、鋼筆等工具可以摳圖后進行圖片的合成，這些簡單的處理，可以使插入到其中的圖片與背景銜接的更加自然，使整個畫面顯得更加美觀。

2.3 動畫效果的運用

在界面設計里，動靜相結合，適當?shù)膭赢嬓Ч倪\用，使畫面效果生動，能夠吸引學習者的注意力。如為引起學習者的注意，對于重要的內容、問題的答案，可以用飛入、切入等動態(tài)效果顯示。由于人眼對方向“下”的視覺感受性最強，因此，方向“自底部”是課件動畫里最優(yōu)的出現(xiàn)方向。其次是方向“自左側”、“自左下部”與“自右下部”，最差的出現(xiàn)方向是“自右上部”[2]。

2.4 色彩的選擇與搭配

在界面設計里，色彩的渲染，使得課件的界面更加美觀和人性化。通常，課件應有一個統(tǒng)一的主色調，但單一的色調讓課件缺乏生機，因此，合理的搭配色彩，把色彩融入到內容中，通過色彩，把作品體現(xiàn)的情感表現(xiàn)出來。

2.4.1 基本色調的統(tǒng)一

課件應有一種主色調，其它的色調只起輔助作用。主色調通常選擇冷色調或中間色調。主色調確定后，選擇互補色或同色系的其它顏色作為輔助色。一個頁面里，避免使用過多的顏色，色彩應控制在三種以內。顏色過多會讓界面顯得花哨，不利于學習者的注意力集中到學習內容上和知識的傳授。

2.4.2 色彩的對比與調和

在界面設計里要注重色彩整體性的設計，在其運用上要考慮色彩的調和與對比，色彩調和與對比的基本原則是：大調和，小對比。

色彩的調和是指兩種或兩種以上的色彩相互搭配，色彩之間相互協(xié)調，達到和諧統(tǒng)一[3]。調和美的配色標準之一就是讓人賞心悅目。在一個頁面里，色彩之間應做到統(tǒng)一性調和與對比性調和。統(tǒng)一性調和就是將同一類或相類似的色相、飽和度及明度的色彩組合在一起，例如淡藍和淡黃搭配在一起顯得和諧、柔美。對比性調和就是將色相、明度、飽和度反差較大的顏色組合在一起，形成強烈對比時，可以進行如下調和，例如選擇藍色作為主色調，搭配上對比色黃色，整個頁面色彩既大方、活潑，又不失協(xié)調[4]。

色彩對比包括著色相對比、飽和度對比、明度對比、互補對比和冷暖對比。例如，在一個頁面中使用互補對比時，為保持畫面的和諧與平衡，就要使用另一色系的顏色，并且要考慮兩個不同色系的顏色所占區(qū)域的位置和大小。

2.4.3 前景色與背景色的搭配

前景色包括著文字、按鈕的顏色，它們在界面設計里是信息傳遞的重要元素，一定要清晰。背景色是界面中的襯托顏色，烘托著主題。選擇色彩時，前景色與背景色要適度的對比，有醒目的視覺效果。通常，背景顏色深，前景色就淺；背景色淺，則前景色就深。如在深色的背景下，則采用白色或黃色的淺色字；在淺色的背景下則采用深藍、黑灰的深色字。

2.4.4 運用色彩的情感效果

界面設計里，充分運用色彩引起的聯(lián)想來傳遞情感。不同的顏色會給人帶來不同的心理感受，如綠色讓人聯(lián)想到春天和大自然，感受到生機勃勃的景象；藍色讓人聯(lián)想到蔚藍的天空和大海，感覺到寧靜；紅色容易引人注意，引發(fā)激動、興奮、緊張的情緒，但很容易造成視覺疲勞。

2.4.5 依據(jù)講授內容選擇色彩

配色方案應該是依據(jù)內容而確定。例如：設計有關食品的界面時，食品的美味與營養(yǎng)可以用黃色、橙色來體現(xiàn)；設計科技類的界面時，為了讓學習者的邏輯思維更加清晰，主色調多用藍色或綠色系列的冷色調。

2.4.6 依據(jù)講授對象選擇色彩

根據(jù)調查，嬰兒喜愛紅色和黃色，兒童大多喜愛鮮艷的顏色，中學生和成年人則喜歡的是藍色系色彩。隨著年齡增長，多數(shù)人偏愛的顏色由暖色轉向冷色。進行界面設計時，應了解講授對象，依據(jù)不同年齡階段的學習者喜歡的顏色來構思整個界面色彩。

2.4.7 依據(jù)不同場合選擇色彩

色彩能表達感情，引起不同的情感體驗。同一顏色在不同的場合也會給人帶來不同的心理感受。喜慶的場合，如婚禮、慶典，人們喜歡用紅色來烘托氣氛。人們常在生活中將紅色看作歡樂的象征色，但紅色也常被看作危險、爆炸及恐怖的象征色。在界面設計時，應依據(jù)不同的場合選擇顏色。

2.5 版面布局

版面布局是將組成課件界面的元素通過符合視覺心理的規(guī)律組合在一起。布局時要緊扣主題內容，做到導航清晰、重點突出、邏輯性強，統(tǒng)一而有變化，有秩序感。版面的布局直接影響著課件界面的整體美觀。在設計多媒體課件界面時，通過運用版面布局、色彩渲染、文字和圖片素材的合理組織，使設計出來的界面更加符合學習者的視覺心理。

2.5.1 界面的整體效果

界面的整體效果就是界面設計要均衡、對稱，只有這樣，布局才美觀、大方，才能吸引學習者的注意力。設計時，要注意文字、圖片和色彩的相互烘托，達到視覺心理上的平和。但也不能過分講究對稱，這樣會讓界面顯得呆板、拘謹。布局時不僅要錯落有致、富于變化，還要有對比關系，才能讓界面有層次感。

2.5.2 構圖的平衡

人的視覺在一個版面內，注意力的價值是不均衡的，最容易受到重視的畫面通常是上部、左部、左上和中上，這四部分是版面中最佳視域。在課件界面設計中，為了提高視覺注意，可以將最重要的視覺信息安排在注意力價值高的區(qū)域。

2.5.3 適當?shù)牧舭滋幚?/p>

界面適當?shù)目瞻讓σ曈X效果的提高有著重要的意義。適當?shù)目瞻?，有強烈的視覺集中效果，使界面設計布局清晰、疏密有序[5]。如在一個界面里，文字、圖片不能布滿整個界面，要留有一定的空間，各元素及其內容不易過多。

2.6 課件的整體設計風格

課件的整體設計風格包括以下四個方面：

1）顏色的搭配：協(xié)調、自然，具有層次感。

2）區(qū)域的處理：內容、標題及功能性按鈕應固定在某些相同的區(qū)域，方便瀏覽與操作。

3）字體的設置：字體及顏色的選擇、字號的大小、字體放置的位置，應相互協(xié)調，前后對應。

4）圖像的處理：圖片的色彩、大小及位置要協(xié)調，并且圖像的選擇要吻合內容與主題。

3 結束語

多媒體課件的界面設計是技術與藝術的結合，既要注重整體的版面設計，又要注重對其中各組成元素的細節(jié)上的精心處理。在視覺心理下，內容組織的科學性與界面設計風格及版面布局的藝術性共同組成了一個視覺效果和教學效果良好的課件界面。

參考文獻：

[1] 劉艷秋，殷寶媛.網(wǎng)絡課程視覺設計中格式塔理論應用的探[J].甘肅聯(lián)合大學學報（自然科學版），2006（6）.

[2] 黎嬌娥.基于視覺感受性的 CAI 課件優(yōu)化分析[J].高等函授學報（自然科學版），2005（8）.

[3] 呂中元.淺談多媒體課件的界面設計[J].電腦知識與技術，2009，5（14）.

[4] 趙潔，何健民.淺析色彩心理學在多媒體課件設計中的應用[J].保山學院學報，2012（5）：34-37.

[5] 熊麗.試論多媒體課件界面設計[J].文教論壇，2007（12）.