網(wǎng)頁設(shè)計(jì)課程知識(shí)體系構(gòu)建

前言：想要寫出一篇引人入勝的文章？我們特意為您整理了網(wǎng)頁設(shè)計(jì)課程知識(shí)體系構(gòu)建范文，希望能給你帶來靈感和參考，敬請閱讀。

摘要：網(wǎng)頁設(shè)計(jì)的本質(zhì)是為用戶的體驗(yàn)服務(wù)，網(wǎng)頁設(shè)計(jì)的具體設(shè)計(jì)實(shí)踐活動(dòng)主要包括交互和視覺兩個(gè)部分，交互的重要程度決定了匹配對(duì)應(yīng)的視覺效果。網(wǎng)頁設(shè)計(jì)課程應(yīng)立足用戶視角，引導(dǎo)學(xué)生在課程設(shè)計(jì)實(shí)踐活動(dòng)中思考、研究并提出滿足用戶需要的解決問題的設(shè)計(jì)方案。網(wǎng)頁設(shè)計(jì)課程的知識(shí)體系在遵循設(shè)計(jì)流程的前提下主要由設(shè)計(jì)方法與理論、設(shè)計(jì)工具、設(shè)計(jì)實(shí)踐經(jīng)驗(yàn)三個(gè)部分構(gòu)成。

關(guān)鍵詞：網(wǎng)頁設(shè)計(jì);課程知識(shí)體系;體驗(yàn)設(shè)計(jì);交互設(shè)計(jì);信息設(shè)計(jì)

網(wǎng)頁設(shè)計(jì)作為高校設(shè)計(jì)學(xué)專業(yè)的專業(yè)課程，在教學(xué)課程知識(shí)體系的不斷探索和完善中，形成了以藝術(shù)和技術(shù)分別主導(dǎo)的側(cè)重不同而又緊密關(guān)聯(lián)的兩種課程知識(shí)體系。隨著網(wǎng)頁設(shè)計(jì)理論與方法研究的不斷深入和發(fā)展，人們對(duì)網(wǎng)頁的產(chǎn)品設(shè)計(jì)的屬性認(rèn)知越來越明確，對(duì)網(wǎng)頁設(shè)計(jì)的工作分工更細(xì)致也更專業(yè)，這種認(rèn)知進(jìn)步也應(yīng)該體現(xiàn)于當(dāng)前的高校網(wǎng)頁設(shè)計(jì)課程的知識(shí)構(gòu)建體系中。

一、網(wǎng)頁設(shè)計(jì)課程知識(shí)體系的構(gòu)建變遷

1.從代碼知識(shí)到網(wǎng)頁制作工具知識(shí)的轉(zhuǎn)變

早期，高校網(wǎng)頁類課程的知識(shí)體系構(gòu)建得益于院校的科研優(yōu)勢，互聯(lián)網(wǎng)的發(fā)展直接促成了計(jì)算機(jī)專業(yè)的開設(shè)和網(wǎng)頁設(shè)計(jì)課程的設(shè)立。20世紀(jì)90年代末，網(wǎng)頁設(shè)計(jì)課程陸陸續(xù)續(xù)被列入部分高校設(shè)計(jì)類專業(yè)課程目錄。面向高校學(xué)生的網(wǎng)頁設(shè)計(jì)課程內(nèi)容是一種全新的事物，即使面向藝術(shù)類專業(yè)，也由計(jì)算機(jī)專業(yè)相關(guān)教師承擔(dān)教學(xué)任務(wù)。各高校、科研院所對(duì)網(wǎng)頁制作方法不斷探索，并將成果于各種學(xué)術(shù)研究出版物，教學(xué)方面則直接引用案例教學(xué)，教學(xué)內(nèi)容以HTML知識(shí)為主。由于面向?qū)ο蟮脑O(shè)計(jì)思想在軟件開發(fā)中普及，各種不需要用戶直接面對(duì)代碼的網(wǎng)頁制作工具相繼誕生，于是，這方面的知識(shí)成為課堂的新內(nèi)容，大大減輕了學(xué)生的記憶負(fù)擔(dān)。2.網(wǎng)頁制作向網(wǎng)頁美工的轉(zhuǎn)變網(wǎng)站制作的快速發(fā)展、網(wǎng)頁制作技術(shù)的傳播，使網(wǎng)站在技術(shù)層面進(jìn)入了同質(zhì)化階段，市場需求開始轉(zhuǎn)向頁面視覺效果方面的提升。在網(wǎng)頁設(shè)計(jì)課程中，由于對(duì)網(wǎng)頁設(shè)計(jì)分工認(rèn)知不足，早期的網(wǎng)頁設(shè)計(jì)課程時(shí)常將設(shè)計(jì)和制作的名稱與授課內(nèi)容混用，沒有嚴(yán)格區(qū)分，也沒有明確的網(wǎng)頁前端設(shè)計(jì)與視覺設(shè)計(jì)分工。高校網(wǎng)頁設(shè)計(jì)課程的授課內(nèi)容以網(wǎng)頁制作技術(shù)為主，以美化頁面效果為輔。此時(shí)，高校對(duì)于網(wǎng)頁設(shè)計(jì)課程的視覺設(shè)計(jì)方面的專業(yè)教學(xué)研究處于摸索階段。之后，隨著時(shí)代的發(fā)展，網(wǎng)頁設(shè)計(jì)課程教學(xué)核心開始轉(zhuǎn)變?yōu)橹谱骶哂懈岩曈X效果的網(wǎng)頁。3.網(wǎng)頁視覺設(shè)計(jì)與網(wǎng)頁前端設(shè)計(jì)的內(nèi)容分離側(cè)重于設(shè)計(jì)的網(wǎng)頁設(shè)計(jì)課程知識(shí)體系重構(gòu)從探索、發(fā)展到成熟，經(jīng)歷了較長的準(zhǔn)備階段。隨著界面設(shè)計(jì)方法和流程理論體系的日益完善，分工協(xié)作機(jī)制日趨成熟，前端設(shè)計(jì)分離后，網(wǎng)頁設(shè)計(jì)課程的重心確定為符合網(wǎng)頁制作技術(shù)規(guī)范和條件的頁面創(chuàng)意表達(dá)、視覺效果設(shè)計(jì)與優(yōu)化。網(wǎng)頁視覺設(shè)計(jì)的探索從傳統(tǒng)的平面設(shè)計(jì)方法尋找切入點(diǎn)，通過對(duì)網(wǎng)頁設(shè)計(jì)中的審美需求和各種視覺構(gòu)成要素（如文字、圖片、顏色等）進(jìn)行分析，結(jié)合人們在瀏覽信息時(shí)的視覺習(xí)慣，探索網(wǎng)頁視覺信息如何被更有效、更合理地表達(dá)。網(wǎng)頁設(shè)計(jì)教學(xué)重心內(nèi)容在轉(zhuǎn)移到視覺設(shè)計(jì)之后，該階段還未意識(shí)到網(wǎng)頁交互設(shè)計(jì)的核心地位。

二、用戶模式的網(wǎng)頁之設(shè)計(jì)認(rèn)知構(gòu)建

網(wǎng)頁設(shè)計(jì)的本質(zhì)是用戶的體驗(yàn)設(shè)計(jì)。網(wǎng)站作為互聯(lián)網(wǎng)非可觸形態(tài)的產(chǎn)品，對(duì)其認(rèn)知的構(gòu)建包含產(chǎn)品屬性認(rèn)知與服務(wù)屬性認(rèn)知兩個(gè)層面的內(nèi)容。1.網(wǎng)頁設(shè)計(jì)是一種產(chǎn)品設(shè)計(jì)設(shè)計(jì)是一門交叉學(xué)科，網(wǎng)頁本身也是一種產(chǎn)品。網(wǎng)頁設(shè)計(jì)最初被視作平面領(lǐng)域的設(shè)計(jì)，而鏈接交互是網(wǎng)頁設(shè)計(jì)有別于平面設(shè)計(jì)的基本特征。網(wǎng)頁設(shè)計(jì)存在交互性，使其具有交互設(shè)計(jì)可用性與易用性體驗(yàn)的內(nèi)在要求，適用于工業(yè)產(chǎn)品的基本設(shè)計(jì)流程。2.網(wǎng)頁設(shè)計(jì)是一種服務(wù)設(shè)計(jì)服務(wù)設(shè)計(jì)層面，各種網(wǎng)頁交互體驗(yàn)、視聽信息、線上內(nèi)容服務(wù)與線下互動(dòng)等，是網(wǎng)站向用戶提供服務(wù)的設(shè)計(jì)組成部分。作為一種廣義的產(chǎn)品形態(tài)，網(wǎng)頁設(shè)計(jì)與傳統(tǒng)的實(shí)物形態(tài)的工業(yè)產(chǎn)品設(shè)計(jì)有一定區(qū)別，更傾向于體驗(yàn)的系統(tǒng)化設(shè)計(jì)。隨著互聯(lián)網(wǎng)向物聯(lián)網(wǎng)的可用技術(shù)研究與拓展，基于智能化網(wǎng)絡(luò)的服務(wù)設(shè)計(jì)將成為跨越線上線下的主流設(shè)計(jì)形態(tài)。3.網(wǎng)頁頁面信息設(shè)計(jì)是關(guān)系網(wǎng)頁設(shè)計(jì)品質(zhì)的深度設(shè)計(jì)網(wǎng)頁設(shè)計(jì)作為一種信息量龐大的互聯(lián)網(wǎng)單元，從工效學(xué)角度來看，網(wǎng)站信息本身也擔(dān)負(fù)著面對(duì)用戶、有效傳遞信息的功能和任務(wù)，在具體的設(shè)計(jì)活動(dòng)中，表現(xiàn)為對(duì)信息的設(shè)計(jì)。信息設(shè)計(jì)具有多學(xué)科交叉性、空間多維性、時(shí)間流動(dòng)性等基本特征，信息設(shè)計(jì)的目的是為了提高信息的可理解度和可閱讀性。優(yōu)質(zhì)的網(wǎng)頁信息設(shè)計(jì)可以降低用戶獲取信息的時(shí)間和精力成本，提升頁面信息獲取體驗(yàn)。

三、基于用戶模型的網(wǎng)頁設(shè)計(jì)課程的知識(shí)體系構(gòu)建

網(wǎng)頁設(shè)計(jì)的本質(zhì)是對(duì)體驗(yàn)的設(shè)計(jì)，即以用戶為核心思考設(shè)計(jì)方案，研究用戶在訪問網(wǎng)站時(shí)的需求是網(wǎng)頁課程設(shè)計(jì)任務(wù)的基本出發(fā)點(diǎn)。課程內(nèi)容模塊應(yīng)該以回答網(wǎng)頁設(shè)計(jì)是什么、怎么設(shè)計(jì)、為什么這樣設(shè)計(jì)三個(gè)問題為主線，構(gòu)建網(wǎng)頁設(shè)計(jì)課程的知識(shí)體系。1.課程的基本目標(biāo)掌握網(wǎng)站項(xiàng)目與網(wǎng)頁制作的基本設(shè)計(jì)流程，培養(yǎng)設(shè)計(jì)項(xiàng)目管理和組織能力；掌握用戶需求研究分析的基本方法，對(duì)用戶體驗(yàn)和需求研究有較為敏銳的洞察力；掌握網(wǎng)站交互原型相關(guān)的設(shè)計(jì)方法與工具；掌握網(wǎng)頁視覺設(shè)計(jì)方法和設(shè)計(jì)規(guī)范；了解目前網(wǎng)頁前端設(shè)計(jì)的相關(guān)技術(shù)和工具。2.知識(shí)體系與模塊組成（1）設(shè)計(jì)方法教學(xué)內(nèi)容模塊設(shè)計(jì)方法教學(xué)內(nèi)容模塊主要為了解決面對(duì)具體問題時(shí)設(shè)計(jì)師怎樣展開分析研究工作并確定設(shè)計(jì)執(zhí)行方案。網(wǎng)頁設(shè)計(jì)方法主要分為項(xiàng)目流程設(shè)計(jì)與管理、網(wǎng)站策劃方法與規(guī)范、用戶體驗(yàn)研究、交互原型設(shè)計(jì)方法等，讓學(xué)生通過貫穿整個(gè)課堂教學(xué)的項(xiàng)目流程設(shè)計(jì)和每個(gè)流程的具體設(shè)計(jì)方法的實(shí)踐，掌握基本的設(shè)計(jì)理論。（2）軟件工具教學(xué)內(nèi)容模塊軟件工具教學(xué)內(nèi)容在形式方面包括課堂內(nèi)的指導(dǎo)和課堂外的自學(xué)兩個(gè)部分。鑒于設(shè)計(jì)軟件的頻繁更新和新的設(shè)計(jì)軟件不斷涌現(xiàn)，教師必須培養(yǎng)學(xué)生自學(xué)工具的主動(dòng)意識(shí)以適應(yīng)社會(huì)需求。在工具種類方面，包括圖形處理工具、交互原型工具和代碼工具三類。第一類是圖形處理工具，其中常見的Photoshop、Illustrator等圖形設(shè)計(jì)軟件，已經(jīng)在前置課程中基本完成學(xué)習(xí)。第二類是交互原型制作工具，常見的工具有墨刀、Axure等。第三類是代碼編輯工具，選擇較多，作為對(duì)網(wǎng)頁前端知識(shí)的入門介紹部分，在本課程中以介紹為主。（3）設(shè)計(jì)經(jīng)驗(yàn)教學(xué)內(nèi)容模塊設(shè)計(jì)經(jīng)驗(yàn)教學(xué)以啟發(fā)式案例實(shí)踐為主，按照網(wǎng)站項(xiàng)目設(shè)計(jì)的流程需要，設(shè)定不同層次、不同要求的設(shè)計(jì)實(shí)踐任務(wù)作為課程結(jié)課的考核內(nèi)容。學(xué)生通過案例的練習(xí)能從優(yōu)秀作品中學(xué)到設(shè)計(jì)經(jīng)驗(yàn)，從具體的案例模仿中獲得設(shè)計(jì)的成就感。網(wǎng)頁設(shè)計(jì)課程案例教學(xué)同時(shí)也是對(duì)網(wǎng)頁設(shè)計(jì)方法的實(shí)踐驗(yàn)證，有助于學(xué)生對(duì)網(wǎng)頁設(shè)計(jì)方法的理解和體會(huì)。結(jié)語任何一種技術(shù)變革，都可能讓網(wǎng)頁設(shè)計(jì)出現(xiàn)新的藝術(shù)形態(tài)，前端依然是課程必須了解的知識(shí)。目前，就設(shè)計(jì)藝術(shù)角度而言，網(wǎng)頁設(shè)計(jì)課程的內(nèi)容以交互和視覺設(shè)計(jì)為基礎(chǔ)，在信息設(shè)計(jì)層面也有較大的提升空間，設(shè)計(jì)途徑也已經(jīng)拓展到用戶的視覺、行為、聲音和邏輯等方面。網(wǎng)頁設(shè)計(jì)課程的知識(shí)體系構(gòu)建必須以產(chǎn)品的視角，讓學(xué)生更深刻、更完整地理解用戶模式下的網(wǎng)頁設(shè)計(jì)藝術(shù)。

參考文獻(xiàn)：

[1]韓旭.新概念網(wǎng)頁設(shè)計(jì).包裝世界，2000（5）.

[2]鬲波飛.網(wǎng)頁設(shè)計(jì)之視覺信息傳達(dá)分析.湖南大學(xué)學(xué)報(bào)（社會(huì)科學(xué)版），2001（S2）.

[3]劉真.《Don’tmakemethink》，從網(wǎng)頁設(shè)計(jì)到產(chǎn)品設(shè)計(jì).科技與創(chuàng)新，2015（8）.

[4]封紅蓮.Web界面中的信息設(shè)計(jì)研究.上海交通大學(xué)碩士學(xué)位論文，2008.

作者:熊科軍 單位:湖南文理學(xué)院美術(shù)學(xué)院