余景，屈文濤，徐劍波

淺析精品課程網(wǎng)站的“包裝”

余景，屈文濤，徐劍波

同一般的商業(yè)性網(wǎng)站側(cè)重的宣傳性不同，精品課程網(wǎng)站更側(cè)重于內(nèi)容和使用功能。在對(duì)網(wǎng)站的建設(shè)中，需要對(duì)其進(jìn)行技術(shù)“包裝”、形式“包裝”、體驗(yàn)“包裝”，以更好的發(fā)揮精品課程網(wǎng)站的作用，西安石油大學(xué)《產(chǎn)品開(kāi)發(fā)設(shè)計(jì)》精品課程網(wǎng)站在建設(shè)過(guò)程中注重對(duì)其各方面的“包裝”，起到了良好的效果。

精品課程；網(wǎng)站；包裝；易用性；簡(jiǎn)潔風(fēng)格；用戶體驗(yàn)

精品課程建設(shè)是高校教學(xué)建設(shè)和教學(xué)改革工程的重要組成部分，是提高教學(xué)質(zhì)量的關(guān)鍵環(huán)節(jié)和重要舉措。精品課程網(wǎng)站則是精品課程建設(shè)和評(píng)價(jià)的窗口，是精品課程資源發(fā)布與共享的主要途徑，在精品課程建設(shè)過(guò)程中起著至關(guān)重要的作用。西安石油大學(xué)《產(chǎn)品開(kāi)發(fā)設(shè)計(jì)》是校級(jí)精品課程，在申報(bào)省級(jí)精品課程中對(duì)已有的精品課程網(wǎng)站進(jìn)行了升級(jí)和完善，對(duì)整個(gè)網(wǎng)站進(jìn)行了技術(shù)“包裝”、形式“包裝”和體驗(yàn)“包裝”。

一、技術(shù)“包裝”，形成技術(shù)美

所謂技術(shù)“包裝”，這里的技術(shù)是指網(wǎng)站的的使用效能，即易用性；易用性是對(duì)《產(chǎn)品開(kāi)發(fā)設(shè)計(jì)》精品課程網(wǎng)站在用戶操作即技術(shù)上的定位，而不是簡(jiǎn)單的形式追求。

同一般的商業(yè)性網(wǎng)站不同，精品課程網(wǎng)站主要面對(duì)的用戶對(duì)象是主要有評(píng)審專家、同行、任課教師以及教學(xué)的主體—學(xué)生。精品課程網(wǎng)站作為一個(gè)教學(xué)平臺(tái)，起著課程信息發(fā)布、成果展示、教學(xué)資源下載、對(duì)外交流的重要作用。通過(guò)此平臺(tái)，教師和網(wǎng)站維護(hù)人員在本站上發(fā)布與教學(xué)相關(guān)的信息，上傳教學(xué)資源。學(xué)生可以輕松地在本站上瀏覽信息，了解該課程教學(xué)體系及教學(xué)狀況；掌握整門課程的學(xué)習(xí)內(nèi)容、目的、要求和學(xué)時(shí)安排等情況；從教師隊(duì)伍介紹中了解每位教師的資歷、教學(xué)和科研情況；查看教學(xué)成果，下載PPT課件或在線觀看教學(xué)錄像；獲取豐富的參考資源以便拓展自身知識(shí)面、熟悉最新的理論研究和實(shí)用技能以及作業(yè)提交等等。

精品課程網(wǎng)站實(shí)際運(yùn)行中，對(duì)易用性提出了很高的要求，網(wǎng)站內(nèi)容要求詳實(shí)準(zhǔn)確，歸類明確；整體框架清晰明和導(dǎo)航指向準(zhǔn)確。同時(shí)在瀏覽過(guò)程中網(wǎng)頁(yè)內(nèi)容分布符合人的視覺(jué)流程習(xí)慣。人們?cè)陂喿x某種信息時(shí)，視覺(jué)總有一種自然的流動(dòng)習(xí)慣，在心理學(xué)的研究表明，一般的瀏覽習(xí)慣是從上到下、從左到右，左松右穩(wěn)。平面的視覺(jué)影響力上方強(qiáng)于下方，左側(cè)強(qiáng)于右側(cè)。這樣平面中的上部和上部被稱為“最佳視域”。

圖1 《產(chǎn)品開(kāi)發(fā)設(shè)計(jì)》精品課程網(wǎng)站首頁(yè)

圖2 《產(chǎn)品開(kāi)發(fā)設(shè)計(jì)》精品課程網(wǎng)站內(nèi)頁(yè)

在對(duì)《產(chǎn)品開(kāi)發(fā)設(shè)計(jì)》精品課程網(wǎng)站的升級(jí)改造過(guò)程中，始終把易用性貫穿始終。網(wǎng)站的整體架構(gòu)也都緊緊圍繞易用性這一主題核心去展開(kāi)設(shè)計(jì)。在易用的基礎(chǔ)上賦予其清新簡(jiǎn)約的形式，網(wǎng)站輕松易閱，首頁(yè)設(shè)計(jì)不僅是歡迎畫面(如圖1所示)，也是整個(gè)網(wǎng)站的核心，在布局上呈左右分布，圖標(biāo)鏈接上有清晰的目錄指向，輕松在首頁(yè)中直接進(jìn)入二級(jí)菜單。

在二級(jí)頁(yè)面上 (如圖2所示)，T字形的布局簡(jiǎn)潔明了，左右分類，一目了然。瀏覽者可以通過(guò)導(dǎo)航鏈接快速準(zhǔn)確的找到自己想要的信息。《產(chǎn)品開(kāi)發(fā)設(shè)計(jì)》精品課程網(wǎng)站的學(xué)生作業(yè)提交系統(tǒng)采用BBS的形式，可以做到7×24小時(shí)隨時(shí)提交草圖方案、完成作品，以供教師隨時(shí)指導(dǎo)，加強(qiáng)了用戶管理。這種形式更加靈活，也便于教師與學(xué)生、學(xué)生與學(xué)生之間的交流。

二、形式“包裝”，形成形式美

包裝還起著傳遞信息和無(wú)聲推銷員的作用，形式多樣、設(shè)計(jì)精美的包裝是用戶購(gòu)物的一個(gè)重要影響要素。

在網(wǎng)站設(shè)計(jì)中對(duì)構(gòu)成網(wǎng)站各類形式如圖形、文字、色彩之間的組合關(guān)系進(jìn)行設(shè)計(jì)“包裝”，能夠使網(wǎng)站形成形式美。形式美是指構(gòu)成事物的物質(zhì)材料的自然屬性(色彩、形狀、線條、聲音等)及其組合規(guī)律(如整齊一律、節(jié)奏與韻律等)所呈現(xiàn)出來(lái)的審美特性。精品課程網(wǎng)站作為課程的主要對(duì)外展示形式，是該課程的外在形象，也是申報(bào)更高一級(jí)成果時(shí)的重要組成部分。形式普通沒(méi)有特色的網(wǎng)站設(shè)計(jì)是一種視覺(jué)污染，僅能起到最基本的功能作用，讓用戶能不使用就不使用，失去了建立網(wǎng)站的意義。而進(jìn)行設(shè)計(jì)包裝之后的網(wǎng)站，頁(yè)面美觀，色彩宜人，是一種視覺(jué)享受，能夠增加用戶數(shù)量，提高網(wǎng)站的使用率，對(duì)課程教學(xué)有良好的促進(jìn)作用。要對(duì)網(wǎng)站進(jìn)行形式“包裝”，確定網(wǎng)站的整體風(fēng)格，需要在網(wǎng)頁(yè)的構(gòu)成元素即文字、圖形、色彩以及它們的組合上進(jìn)行精心設(shè)計(jì)。

風(fēng)格是指網(wǎng)站的整體形象給瀏覽者的綜合感受，是抽象的感覺(jué)。整體形象包括網(wǎng)站的版面布局，色彩，字體，瀏覽方式等。確定網(wǎng)站的風(fēng)格與網(wǎng)站內(nèi)容和用戶有關(guān)，需要根據(jù)網(wǎng)站的定位做出網(wǎng)站特有的風(fēng)格。風(fēng)格貫穿著網(wǎng)頁(yè)上所有的圖像、文字，包括像背景顏色、區(qū)分線、字體、標(biāo)題、注腳等，同時(shí)圖形、文字、色彩、等也是構(gòu)成風(fēng)格的元素。風(fēng)格統(tǒng)一網(wǎng)站會(huì)給用戶一個(gè)“很專業(yè)”的印象。

《產(chǎn)品開(kāi)發(fā)設(shè)計(jì)》精品課程網(wǎng)站的風(fēng)格追求的是少等于多，是簡(jiǎn)潔風(fēng)格。網(wǎng)頁(yè)空間的合理運(yùn)用，并非要把整個(gè)頁(yè)面塞滿了才不覺(jué)得空，也并非讓整個(gè)頁(yè)面空曠才不覺(jué)得滿，只要合理的安排、有機(jī)的組合，使頁(yè)面達(dá)到平衡，即使在一邊的部分大面積留空，同樣不會(huì)讓人感到空，相反這樣會(huì)給人留下廣闊的思考空間，給人回味又達(dá)到了視覺(jué)效果。首頁(yè)中以大圖和簡(jiǎn)潔性的鏈接圖標(biāo)為主，大與小形成對(duì)比，大圖為flash動(dòng)畫，主要展示了該課程的應(yīng)用對(duì)象、實(shí)習(xí)情況、學(xué)生作品等，整體網(wǎng)站色彩以冷灰色為主，同時(shí)為增加視覺(jué)效果，點(diǎn)綴了高飽和度的暖色，理性中不失活潑，與課程性質(zhì)相呼應(yīng)。文字以常見(jiàn)的宋體和黑體為主，以保證顯示效果，部分文字圖形化，美化了頁(yè)面。對(duì)網(wǎng)站元素組成形式的“包裝”，使整個(gè)網(wǎng)站統(tǒng)一中有對(duì)比，理性中有變化，構(gòu)成了形式美。

三、體驗(yàn)“包裝”，形成體驗(yàn)美

網(wǎng)站是提供給用戶使用的，用戶在使用過(guò)程中，有不同的心理體驗(yàn)，其中以UI和UE為代表。所謂UI，就是用戶界面的體驗(yàn)。從心理學(xué)意義來(lái)分，界面分為感覺(jué)(視覺(jué)、觸覺(jué)、聽(tīng)覺(jué)等)和情感兩個(gè)層次。用戶界面設(shè)計(jì)是屏幕產(chǎn)品的重要組成部分，任何一個(gè)瀏覽者打開(kāi)網(wǎng)站，首先接觸的一定是視覺(jué)，這就顯得UI很關(guān)鍵。如果出現(xiàn)打開(kāi)網(wǎng)站首頁(yè)flash緩存時(shí)間過(guò)長(zhǎng)，網(wǎng)站色彩和色調(diào)不協(xié)調(diào)，頁(yè)面或者圖片出現(xiàn)嚴(yán)重變形等；以及內(nèi)頁(yè)圖文結(jié)構(gòu)不清，內(nèi)容雜亂，標(biāo)題不明顯等問(wèn)題，那么該網(wǎng)站就會(huì)給瀏覽者留下負(fù)面的UI印象，從而不再對(duì)該網(wǎng)站感興趣，減少瀏覽時(shí)間或數(shù)量。而所謂UE，含義是用戶體驗(yàn)，它所包含的內(nèi)容很廣，對(duì)于一個(gè)網(wǎng)站來(lái)說(shuō)主要是功能和閱讀方面的體驗(yàn)。具體表述，是用戶在使用網(wǎng)站時(shí)是否方便，互動(dòng)性是否強(qiáng)，以及網(wǎng)站的內(nèi)容編輯是否具有可閱讀性。UE中追求一個(gè)重要的原則——人文關(guān)懷的原則。網(wǎng)站應(yīng)該以用戶和目標(biāo)訪問(wèn)者的角度去思考和設(shè)計(jì)自己的網(wǎng)站中的人文元素。

UI和UE的體驗(yàn)是用戶在對(duì)網(wǎng)站瀏覽使用中對(duì)網(wǎng)站的內(nèi)容、功能、布局、色彩、圖形等的一種綜合性的心理體驗(yàn)，對(duì)體驗(yàn)進(jìn)行“包裝”，就需要站在瀏覽者的角度反復(fù)推敲網(wǎng)站的細(xì)節(jié)。人機(jī)工程學(xué)是產(chǎn)品開(kāi)發(fā)過(guò)程中的重要組成部分，人機(jī)的要求同樣注重用戶的體驗(yàn)過(guò)程?！懂a(chǎn)品開(kāi)發(fā)設(shè)計(jì)》精品課程網(wǎng)站在設(shè)計(jì)之初就把用戶體驗(yàn)放到較高的高度，在網(wǎng)站的方方面面都對(duì)其進(jìn)行了細(xì)致的推敲，在整體布局、框架結(jié)構(gòu)、網(wǎng)頁(yè)構(gòu)成元素等等用戶體驗(yàn)方面力求以人為本。

隨著網(wǎng)絡(luò)的進(jìn)一步發(fā)展，各類高校對(duì)課程質(zhì)量的更高要求，對(duì)精品課程的建設(shè)會(huì)越來(lái)越普及，而作為精品課程建設(shè)的重要組成部分——精品課程網(wǎng)站的建立就愈加重要。為建設(shè)一個(gè)成功精品課程網(wǎng)站，需要對(duì)其進(jìn)行全方位的“包裝”，以發(fā)揮網(wǎng)絡(luò)的優(yōu)勢(shì)，增加教學(xué)的互動(dòng)性和趣味性，提高教學(xué)質(zhì)量，促進(jìn)課程建設(shè)。

[1]荊雷.設(shè)計(jì)藝術(shù)原理[M].濟(jì)南：山東教育出版社,2002.

[2]李在萬(wàn).設(shè)計(jì)師談商業(yè)配色密碼[M].孫羽譯.北京：電子工業(yè)出版社,2007.

[3]馬月.網(wǎng)站界面設(shè)計(jì)[M].北京理工大學(xué)出版社.2006.

[4]屈文濤,宋紅,徐劍波,冀婷.產(chǎn)品開(kāi)發(fā)設(shè)計(jì)課程群教學(xué)方法與手段的改革與研究[J].中國(guó)電力教育,2010.35:92～93.

[5]屈文濤,徐劍波,岳治.產(chǎn)品開(kāi)發(fā)設(shè)計(jì)課程群實(shí)踐教學(xué)體系構(gòu)建[J].重慶科技學(xué)院學(xué)報(bào)(社會(huì)科學(xué)版),2010（23）.

G423

A

1673-1999（2011）08-0172-02

余景(1975-)，男，湖北荊門人，西安石油大學(xué)(陜西西安710065)機(jī)械工程學(xué)院講師，研究方向?yàn)楝F(xiàn)代設(shè)計(jì)藝術(shù)。

2011-02-13