第四章多媒體課件屏幕界面設(shè)計(jì)

地理教學(xué)論課程群——地理課件設(shè)計(jì)制作主講教師王才軍

2010年11月第五章多媒體課件屏幕界面設(shè)計(jì)

一、界面設(shè)計(jì)的重要性二、屏幕界面的構(gòu)成三、界面設(shè)計(jì)的原則四、屏幕界面的設(shè)計(jì)一、界面設(shè)計(jì)的重要性

1.有助于學(xué)習(xí)者對(duì)知識(shí)的理解和記憶2.方便教師(或?qū)W生)對(duì)課件的使用3.激發(fā)學(xué)生學(xué)習(xí)興趣

多媒體課件界面設(shè)計(jì)

二、屏幕界面的構(gòu)成

菜單、圖標(biāo)、按鈕熱字、熱區(qū)多媒體課件界面設(shè)計(jì)

控制類教學(xué)類窗口對(duì)話框示警盒文本、圖形、圖像、活動(dòng)影像、動(dòng)畫、聲音1.窗口二、屏幕界面的構(gòu)成

2.菜單1)全屏窗口菜單

2)條形菜單3)彈出式菜單

4)下拉菜單

5)圖標(biāo)式菜單

二、屏幕界面的構(gòu)成3.圖標(biāo)

圖標(biāo)是課件中最常用的一種圖形界面對(duì)象，是一種小型、帶有簡潔圖形的符號(hào)可分為圖示圖標(biāo)和符號(hào)圖標(biāo)兩種風(fēng)格

二、屏幕界面的構(gòu)成

4按鈕1)WINDOWS風(fēng)格按扭2)閃爍式按扭3)動(dòng)畫式圖形按扭4)熱點(diǎn)式按鈕熱點(diǎn)按鈕二、屏幕界面的構(gòu)成5對(duì)話框二、屏幕界面的構(gòu)成6示警盒當(dāng)用戶出現(xiàn)了不當(dāng)?shù)牟僮骰蚪o出了諸如永久性刪除文件這樣具有“危險(xiǎn)性”的命令時(shí)，系統(tǒng)通常會(huì)以兩種方式向用戶示警二、屏幕界面的構(gòu)成

三、界面設(shè)計(jì)的原則(1)一致性原則(2)適應(yīng)性原則(3)靈活性原則(4)易學(xué)易用性原則多媒體課件界面設(shè)計(jì)

四、屏幕界面的設(shè)計(jì)1屏幕界面的整體設(shè)計(jì)2多媒體素材設(shè)計(jì)3顏色的運(yùn)用4界面的轉(zhuǎn)換設(shè)計(jì)5界面設(shè)計(jì)中應(yīng)注意的問題多媒體課件界面設(shè)計(jì)

1.屏幕界面的整體設(shè)計(jì)1)界面窗口的大小設(shè)計(jì)2)布局3)主題

4)教學(xué)信息設(shè)計(jì)四、屏幕界面的設(shè)計(jì)1)界面窗口的大小設(shè)計(jì)建議使用當(dāng)時(shí)流行的分辨率設(shè)計(jì)內(nèi)容較多時(shí)可在窗口邊緣加滾動(dòng)捧四、屏幕界面的設(shè)計(jì)——1屏幕界面的整體設(shè)計(jì)2)．布局標(biāo)題區(qū)屏幕主體區(qū)(主要呈現(xiàn)教學(xué)信息)要求：文字描述應(yīng)簡短，圖像質(zhì)量要高

狀況、情況、注釋行等功能鍵區(qū)、按鈕區(qū)

標(biāo)志符號(hào)位置四、屏幕界面的設(shè)計(jì)——1屏幕界面的整體設(shè)計(jì)2)布局a.均衡b.規(guī)整c.對(duì)稱d.可預(yù)見性e.簡明f.連貫g.整體性h.簡單四、屏幕界面的設(shè)計(jì)——1屏幕界面的整體設(shè)計(jì)3)主題每一個(gè)框面內(nèi)容最好都有一個(gè)主題，出現(xiàn)在窗口較醒目的位置。

四、屏幕界面的設(shè)計(jì)——1屏幕界面的整體設(shè)計(jì)4)教學(xué)信息設(shè)計(jì)影響信息選擇和顯示的因素：A.密度(信息量)總體密度１５％——2５％局部密度４０％～６０％四、屏幕界面的設(shè)計(jì)——1屏幕界面的整體設(shè)計(jì)4)教學(xué)信息設(shè)計(jì)B.顯示信息的顯示通?？紤]到版面、文字信息、特殊記號(hào)、功能鍵等。四、屏幕界面的設(shè)計(jì)——1屏幕界面的整體設(shè)計(jì)2.多媒體素材設(shè)計(jì)文字底圖聲音動(dòng)畫、視頻四、屏幕界面的設(shè)計(jì)1)文字用盡量少的文字來表明事實(shí)的含義，不要將文字排列成錐體形狀，不同內(nèi)容的文字顏色應(yīng)設(shè)計(jì)為不同。但要避免造成如下圖般花花綠綠一大片。四、屏幕界面的設(shè)計(jì)——2.多媒體素材設(shè)計(jì)2)底圖底圖不宜顏色較深或突出以免喧賓奪主建議不用底圖，或?qū)⒌咨O(shè)置為淺色四、屏幕界面的設(shè)計(jì)——2.多媒體素材設(shè)計(jì)3)聲音

功能：引起注意、舒緩等候、提示反應(yīng)、表示事件進(jìn)程、提供情景音效、提供反饋等。使用原則：（1）勿用太多（2）音量可調(diào)（3）多用間歇性的短音樂，（4）用聲音作轉(zhuǎn)移效果（5）聲音選擇應(yīng)配合文字與圖像、視頻內(nèi)容四、屏幕界面的設(shè)計(jì)——2.多媒體素材設(shè)計(jì)4)動(dòng)畫、視頻圖象

位置:基本一致，放在屏幕中央或右半部。大小:一般不超過屏幕的1/4，建議:將動(dòng)畫的底色設(shè)為白色或淺色。在視頻窗口下方設(shè)計(jì)播放、停止、快進(jìn)、倒退、錄制等控制按鈕四、屏幕界面的設(shè)計(jì)——2.多媒體素材設(shè)計(jì)3.顏色的運(yùn)用

優(yōu)勢(shì)：可吸引用戶視覺感官，引起注意，色彩使用恰當(dāng)，就能促進(jìn)對(duì)屏幕上各部分識(shí)別，突出差異，使顯示更富有趣味性。缺點(diǎn)：使用不當(dāng)，會(huì)分散注意力，使視覺更易疲勞。我們從以下幾方面來討論正確使用色彩1)、彩色的作用2)、色彩的運(yùn)用方法四、屏幕界面的設(shè)計(jì)1)彩色的作用

(1)作為一種組織屏幕信息、形成良好屏幕格式的手段。(2)色彩本身充當(dāng)有特定意義的視覺符號(hào)顏色是有意義的。(3)借助色彩逼真地反映客觀世界。(4）增添屏幕的吸引力，激起用戶的興趣。

四、屏幕界面的設(shè)計(jì)——3.顏色的運(yùn)用2)色彩的運(yùn)用方法

明確色彩使用的目的和可能的作用，力求發(fā)揮色彩輔助交流、促進(jìn)信息傳播的作用

(1)對(duì)色彩的基本認(rèn)識(shí)(2)避免同時(shí)使用太多顏色(3)色彩的可分辨性和協(xié)調(diào)性(4）用色彩來起強(qiáng)調(diào)作用(5）色彩的含義要與用戶的色彩經(jīng)驗(yàn)和期望相一致(6）色彩的空間位置分布(7）色彩的順序四、屏幕界面的設(shè)計(jì)——3.顏色的運(yùn)用(1)對(duì)色彩的基本認(rèn)識(shí)作用：輔助交流，為屏幕增色目標(biāo)：完成信息從機(jī)到人的有效傳遞四、屏幕界面的設(shè)計(jì)——3.顏色的運(yùn)用——2)、色彩的運(yùn)用方法

(2)避免同時(shí)使用太多顏色同一畫面中以四五種顏色為限。過多的顏色會(huì)增加學(xué)習(xí)者的反應(yīng)時(shí)間，增加出錯(cuò)的機(jī)會(huì)，易于引起視覺疲勞。

四、屏幕界面的設(shè)計(jì)——3.顏色的運(yùn)用——2)、色彩的運(yùn)用方法

紅藍(lán)紅藍(lán)紅藍(lán)

黃藍(lán)黃藍(lán)黃藍(lán)紅綠紅綠紅綠(3)色彩的可分辨性和協(xié)調(diào)性四、屏幕界面的設(shè)計(jì)——3.顏色的運(yùn)用——2)、色彩的運(yùn)用方法

避免將對(duì)比強(qiáng)烈的顏色放在一起，如黃與藍(lán)，紅與綠或紅與藍(lán)。(4）用色彩起強(qiáng)調(diào)作用活動(dòng)中的顏色鮮明，非活動(dòng)中的顏色應(yīng)暗淡前景色：暖色，飽和的、鮮艷的色彩背景色：冷色、暗色、淺色。用對(duì)比色來表現(xiàn)分離,用相似色來表示關(guān)聯(lián)。四、屏幕界面的設(shè)計(jì)——3.顏色的運(yùn)用——2)、色彩的運(yùn)用方法

(5）色彩含義與用戶經(jīng)驗(yàn)和期望一致幾種常用色彩的意義內(nèi)涵：紅色：停止、火、熱、危險(xiǎn)黃色：警告、慢速、測試綠色：前進(jìn)、狀況良好、清楚、植物、安全藍(lán)色：冷卻、水、安靜、天空、中立暖色：活動(dòng)中的。要求作出反應(yīng)的、關(guān)系密切的冷色：靜止的、狀態(tài)信息、背景的、關(guān)系疏遠(yuǎn)的灰色、白色：中性四、屏幕界面的設(shè)計(jì)——3.顏色的運(yùn)用——2)、色彩的運(yùn)用方法

(6）色彩的空間位置分布視野中心多選用紅、綠色視野邊沿較適于選用藍(lán)、黃、黑色相鄰色塊之間還應(yīng)有亮度上的區(qū)別，簡單方法是給色塊邊沿加上明顯邊界線。

四、屏幕界面的設(shè)計(jì)——3.顏色的運(yùn)用——2)、色彩的運(yùn)用方法

(7）色彩的順序用色彩的漸變序列來表達(dá)某種順序信息，如數(shù)值從大到小、過程從開始到結(jié)束等，那么色彩的排列應(yīng)與光譜順序相吻合，即紅、橙、黃、綠、藍(lán)、靛、紫四、屏幕界面的設(shè)計(jì)——3.顏色的運(yùn)用——2)、色彩的運(yùn)用方法

4.界面的轉(zhuǎn)換設(shè)計(jì)好的界面轉(zhuǎn)換設(shè)計(jì)有助于學(xué)習(xí)者理解框面之間的知識(shí)結(jié)構(gòu)、知識(shí)層次。四、屏幕界面的設(shè)計(jì)信息結(jié)構(gòu)、層次建議使用效果課件的出現(xiàn)垂