◆李冬霞

界面設(shè)計的好壞是影響學(xué)生進行有效學(xué)習(xí)的重要因素?；赪eb2.0的網(wǎng)絡(luò)課程界面元素設(shè)計以服務(wù)于網(wǎng)絡(luò)課程的使用者為主，Web2.0強大的服務(wù)功能主要表現(xiàn)在以下方面。

1）Blog和Wiki讓學(xué)習(xí)者在線發(fā)表自己的學(xué)習(xí)心得、疑惑、感情流露等，通過借助RSS與Tag將自己創(chuàng)作的內(nèi)容主動發(fā)布出去，從而和對自己創(chuàng)作內(nèi)容有共同興趣的人群實現(xiàn)分享、交流，在他人的反饋下，學(xué)習(xí)者進行反思，加深理解。

2）社交網(wǎng)站和Tag標簽讓學(xué)習(xí)者在線上尋找到有共同興趣愛好的學(xué)習(xí)同伴，形成個人學(xué)習(xí)社會圈，同時學(xué)習(xí)者有機會接觸到專業(yè)領(lǐng)域?qū)W者，與他們建立起社會關(guān)系網(wǎng)絡(luò)，分享他們的研究成果、思想觀念[1]。

3）Web2.0提供如Podcast、問卷調(diào)查、Wiki、心得報告、日志、聊天、BBS、測驗、投票、互動評價等多種在線學(xué)習(xí)活動。學(xué)習(xí)者通過參與這些學(xué)習(xí)活動，實現(xiàn)多層面的溝通交流。

4）借助RSS，教師向?qū)W生布置作業(yè)，通過與學(xué)生互相定制學(xué)習(xí)頻道、Blog了解學(xué)生的作業(yè)情況，利用Wiki技術(shù)對學(xué)生提交的作業(yè)給予回復(fù)[2]。具有可讀可寫特性的Web2.0可以記錄學(xué)生學(xué)習(xí)行為，教師可以查看學(xué)生訪問課程的次數(shù)、時間以及場所，也可以查看某個教學(xué)模塊的學(xué)生參與情況。教師可以從學(xué)習(xí)態(tài)度、學(xué)習(xí)方法等方面給出評價，如采用問卷、學(xué)生反饋、網(wǎng)絡(luò)調(diào)查、專家意見、學(xué)習(xí)者留言等多種方式，而不再只針對學(xué)習(xí)成績給出單一的評價，從而實現(xiàn)多元化的評價。

5）基于Web2.0的網(wǎng)絡(luò)課程為學(xué)生提供獨立自主學(xué)習(xí)工具、可視化知識管理軟件，如電子字典、有道云筆記、思維導(dǎo)圖（Mindmanager）、概念圖（Concept Map）等，促進學(xué)習(xí)者隱性知識顯性化，提高學(xué)習(xí)者思維的發(fā)散性和想象力，這樣更有利于學(xué)習(xí)者信息交流、知識共享、協(xié)同建構(gòu)知識，從而提高其獲得知識技能的效率，提高協(xié)作學(xué)習(xí)的能力，滿足學(xué)習(xí)者的個性化學(xué)習(xí)需要。

基于Web2.0的網(wǎng)絡(luò)課程界面元素設(shè)計主要是為了構(gòu)建個人學(xué)習(xí)環(huán)境，創(chuàng)設(shè)與學(xué)習(xí)主題相關(guān)的情境，體現(xiàn)人文氣息，為學(xué)生自主建構(gòu)知識提供一種良好學(xué)習(xí)環(huán)境。為了取得更好的網(wǎng)絡(luò)學(xué)習(xí)效果，根據(jù)當前學(xué)習(xí)者特征以及高校網(wǎng)絡(luò)課程界面設(shè)計存在的問題，采用不同工具與技術(shù)之間的優(yōu)化組合、功能滲透。以下提出具體界面元素設(shè)計策略。

1 導(dǎo)航設(shè)計

導(dǎo)航設(shè)計的原則應(yīng)清晰、合理，符合人的心理視覺運動規(guī)律。設(shè)計文字導(dǎo)航，告知學(xué)習(xí)者目前所處位置以及下一步學(xué)習(xí)的方向，避免迷航。設(shè)計關(guān)鍵字導(dǎo)航，針對一些專業(yè)術(shù)語、關(guān)鍵詞、圖片、網(wǎng)站資源等以超鏈接形式提供解釋、提示或說明[3]。提供具體的標簽和查詢功能，標簽可以幫助學(xué)習(xí)者自己定位，學(xué)習(xí)者可做學(xué)習(xí)進程的標記，注明自己的學(xué)習(xí)狀態(tài)；提供查詢搜索功能可以幫助學(xué)習(xí)者盡快檢索所需的學(xué)習(xí)資源[4]。

2 菜單、窗口設(shè)計

設(shè)計原則應(yīng)盡量簡化、符合用戶操作習(xí)慣。設(shè)計通過使用鼠標、選擇下拉菜單、超鏈接跳轉(zhuǎn)等簡單操作，利用新打開窗口可以進入課程新內(nèi)容的學(xué)習(xí)，利用加入收藏夾、書簽等方式方便學(xué)習(xí)者管理個人學(xué)習(xí)單元。幫助、導(dǎo)航菜單方便學(xué)習(xí)者了解某一具體模塊的功能。

3 超文本的設(shè)計

設(shè)計原則應(yīng)符合個性化需要定制，做到生動、靈活、富有感染力?？紤]到網(wǎng)絡(luò)課程資源龐雜及不同學(xué)習(xí)者不同的學(xué)習(xí)特性，采用超文本、超媒體來組織教學(xué)信息，以滿足學(xué)習(xí)者鏈接方式進行知識學(xué)習(xí)的需要。將難點、難題等設(shè)為熱字，點擊它即出現(xiàn)相應(yīng)的解讀或參考答案，熱字的內(nèi)容可以做成純文本或是聲音、圖像、動畫、視頻等，同時可將這些圖像、動畫、視頻等作為交互的對象和學(xué)習(xí)者發(fā)生交互，讓學(xué)習(xí)者參與到學(xué)習(xí)活動中。采用醒目顏色，如紅色、綠色、藍色可以將熱字和其他文本進行區(qū)分。

4 文字的設(shè)計

文字設(shè)計原則應(yīng)和諧統(tǒng)一、簡潔數(shù)字化。在對文字編排與設(shè)計時，不僅要考慮到字體、字號、行距、文字數(shù)量以及文字排版的方式，而且在文字的色彩設(shè)計上需要注意與頁面的背景色搭配和諧，文字呈現(xiàn)的效果帶給人的感受應(yīng)是易讀、易看、易理解，簡潔明了，還能觸發(fā)人的情感。學(xué)習(xí)文本總體上應(yīng)有統(tǒng)一的風(fēng)格，以方便學(xué)習(xí)者定位相關(guān)的學(xué)習(xí)，對于重要文本則使用下畫線、斜體字或彩色字、加大字號、適量的閃爍等功能來吸引學(xué)習(xí)者的注意力。在網(wǎng)絡(luò)飛速發(fā)展的今天，文字作為信息的重要外在形式，必然要順應(yīng)時代潮流，滿足大學(xué)生的個性化需求，數(shù)字媒體區(qū)別于傳統(tǒng)媒體的一個重要特點就是展現(xiàn)了一種全新的、濃縮的高科技空間，代表著一個新的美學(xué)領(lǐng)域。文字的設(shè)計可適當采用3D字體元素，增強多維空間的立體感，讓學(xué)習(xí)者體會到文字的真實感，給人一種在虛擬網(wǎng)絡(luò)學(xué)習(xí)空間中觸覺上的體驗。

5 圖形和圖像的設(shè)計

圖形和圖像的設(shè)計原則應(yīng)符合清晰性、真實性、簡潔性、情感藝術(shù)性。界面中使用的圖像要保證清晰度，不對圖像進行涂抹、剪貼等毀壞圖像本來面目的操作，去除與主體無關(guān)部分，突出主體，盡量減少圖像文件的大小。選擇圖片的格式方面應(yīng)主要使用Gif圖像、JPG圖像；但是對圖像質(zhì)量要求較高時，應(yīng)采用沒有損失或損失較小的圖像文件格式，如TIF、BMP等；而要求頁面背景保留時，應(yīng)采用透明的Gif、png格式的圖像。為了表現(xiàn)情感藝術(shù)性，可以對圖像的色調(diào)、對比度、飽和度進行調(diào)整，通?？衫肞hotoshop、CorelDRAW、光影魔術(shù)手、美圖秀秀等工具美化圖片，增強藝術(shù)美感。

6 視頻動畫的設(shè)計

視頻動畫設(shè)計原則應(yīng)微型簡潔、流暢化、賦予教育性。通常使用的視頻文件有AVI和MOV兩種類型，視頻窗口開設(shè)的大小要合適，過大不僅影響其他媒體所占據(jù)的空間，還會使畫面不清晰，最好能夠智能化地自由縮放控制。為了讓視頻播放更流暢，網(wǎng)絡(luò)課程中的視頻時間不要過長，若視頻時間較長，可將視頻分割成多個短時間視頻片斷連續(xù)播放。如今流行的微課程、微視頻、MOOC（大規(guī)模開放在線課程）一般采用5～15分鐘的視頻，可以借鑒其制作方式和技巧進行設(shè)計。Flash動畫具有體積小、可邊下載邊播放等特點，讓抽象的內(nèi)容形象化，許多難以理解的內(nèi)容變得生動有趣、有聲有色，合理使用動畫便可以達到更好的學(xué)習(xí)效果[5]。

7 聲音的選配

聲音選配原則應(yīng)符合科學(xué)教育性、播放可控、流暢性。一般選擇與學(xué)習(xí)內(nèi)容表現(xiàn)的主題相符、輕快的輕音樂，背景音樂旋律和節(jié)奏一定要服從于內(nèi)容，不可干擾學(xué)習(xí)者學(xué)習(xí)。一般采用MP3、MIDI、WAV音頻文件格式方便傳播。配音的添加要合理，不合理的配音往往會分散學(xué)生的注意力，畫蛇添足[6]。另外，有的學(xué)習(xí)者不喜歡有背景音樂，因此，界面應(yīng)有聲音控制開關(guān)，遵循可控性原則，這樣學(xué)習(xí)者可根據(jù)情緒需要控制音量的大小及聲音更換、播放、停止等播放模式。

8 色彩的設(shè)計

色彩設(shè)計遵循總體協(xié)調(diào)、局部對比的原則。不同的色彩有不同的喻義，因此要謹慎選擇。選擇色彩時要符合人的視覺規(guī)律，選擇清晰、簡潔的顏色，前景與背景的色彩要搭配和諧，從而減少視覺疲勞。恰當運用色彩，構(gòu)成新穎的色彩搭配，可以起到視覺傳達導(dǎo)向性的作用，引導(dǎo)學(xué)習(xí)者的視覺方向，減弱其他干擾元素，這是交互設(shè)計的精髓。色彩的合理運用可以給人輕松自在的學(xué)習(xí)感受，營造一種激發(fā)學(xué)習(xí)動機和興趣的學(xué)習(xí)氛圍。

9 版式的布局設(shè)計

界面版式布局原則應(yīng)符合主次分明、合理性、均衡性、直觀性。1:1.618的黃金比長寬比是最具有視覺美感的版式。對稱布局的設(shè)計具有穩(wěn)定、莊嚴、整齊、秩序、安寧、沉靜的特點，垂直均勻的布局若處理不恰當，容易造成視覺心理的不平衡，那么可采用分隔線作部分或全部的弱化處理，或加入其他元素，使左右部分的過渡自然而和諧。版式布局的各個組成元素要根據(jù)人的視覺審美習(xí)慣和心理感知，分清主次，合理編排組合界面的每個元素，體現(xiàn)整體感的一致性和連貫性，運用媒體技術(shù)處理，形成變化豐富的畫面，達到多視點、多層次、立體感的空間形態(tài)，使得教學(xué)內(nèi)容能形象地展示在學(xué)習(xí)者的面前，形成較好的學(xué)習(xí)交互。

總之，高校網(wǎng)絡(luò)課程的內(nèi)容不是以線性方式組織的教科書文本，而是以超文本方式組織的多媒體學(xué)習(xí)單元，即多媒體元素組成的微學(xué)習(xí)單元[7]。任何設(shè)計策略、原則應(yīng)合理地解決使用者多方面需求，將各個界面元素恰當合理地置于頁面板塊中，達到人性化的友好界面。Web2.0的新技術(shù)、新理念在網(wǎng)絡(luò)課程界面元素的設(shè)計中體現(xiàn)出巨大的優(yōu)勢，能夠改善網(wǎng)絡(luò)課程學(xué)習(xí)資源的呈現(xiàn)方式，加速網(wǎng)絡(luò)學(xué)習(xí)資源的更新頻率，促進網(wǎng)絡(luò)學(xué)習(xí)資源的開放、共享，提升網(wǎng)絡(luò)課程的人際交互和人機交互，便于網(wǎng)上學(xué)習(xí)活動開展，有利于構(gòu)建面向過程的、多元化的評價體系，實現(xiàn)學(xué)習(xí)評價的客觀、全面、公正。在設(shè)計界面元素的過程中，必須充分考慮人的學(xué)習(xí)心理特征，注重界面設(shè)計的科學(xué)性、藝術(shù)性、教育性，合理運用各種技術(shù)手段，遵循易學(xué)易用又不失美感的原則。只有這樣，才能夠提高學(xué)習(xí)積極性，達到理想的學(xué)習(xí)效果。

當今是數(shù)字化社會，界面的設(shè)計賦予數(shù)字化是不可改變的主流?；赪eb2.0的網(wǎng)絡(luò)課程界面元素設(shè)計雖然有很大的優(yōu)勢，但也存在不足，在利用優(yōu)勢的同時應(yīng)盡量減少不利因素。在這個視覺刺激泛濫的年代，創(chuàng)新是設(shè)計的靈魂，沒有固定的設(shè)計模式，也沒有完美的設(shè)計模式，只有更優(yōu)化、更友好的界面設(shè)計?！八街?，可以攻玉”，需要借鑒更優(yōu)秀的作品來達到更智能化、更人性化的界面，達到創(chuàng)意美、視覺美、人性美、秩序美、和諧美、變化美的一種不可替代的藝術(shù)美感。

[1]馬凌.Web革命與教育創(chuàng)新[J].哈爾濱市委黨校學(xué)報,2008(5):81-82.

[2]賴德剛.基于Web2.0的中小學(xué)教師遠程培訓(xùn)平臺的設(shè)計[J].中國科教創(chuàng)新導(dǎo)刊,2011(12):190.

[3]張筱蘭,歐陽汝梅.高校自主學(xué)習(xí)型網(wǎng)絡(luò)課程的設(shè)計策略[J].電化教育研究,2008(12):38-41.

[4]王琪.網(wǎng)絡(luò)課程設(shè)計之點滴思考[J].中國遠程教育,2002(5):38-40.

[5]束梅霞.視覺文化支持下的初中信息技術(shù)學(xué)案設(shè)計研究[D].南京:南京師范大學(xué),2011.

[6]黃慶華.多媒體軟件界面藝術(shù)設(shè)計研究[D].上海:華東師范大學(xué),2007.

[7]張振亭.基于系統(tǒng)觀的網(wǎng)絡(luò)課程設(shè)計與實現(xiàn)[D].武漢:華中師范大學(xué),2002.