《網(wǎng)頁(yè)設(shè)計(jì)與制作》課程教學(xué)案例

1、成功不是偶然而是必然成功不是偶然而是必然閱讀使人快樂，成長(zhǎng)需要時(shí)間網(wǎng)頁(yè)設(shè)計(jì)與制作課程教學(xué)案例項(xiàng)目名稱淮陰師范學(xué)院本科教學(xué)評(píng)建網(wǎng)建設(shè)項(xiàng)目目標(biāo)：1知識(shí)目標(biāo)：運(yùn)用所學(xué)的網(wǎng)頁(yè)設(shè)計(jì)與制作知識(shí)解決實(shí)際問題。2能力目標(biāo)：通過教師、同學(xué)及網(wǎng)絡(luò)的幫助，感受實(shí)際工作中網(wǎng)站設(shè)計(jì)的一般工作流程，學(xué)會(huì)表達(dá)解決問題的過程和方法，培養(yǎng)學(xué)生綜合運(yùn)用知識(shí)分析、處理實(shí)際問題的能力；鍛煉學(xué)生發(fā)現(xiàn)問題的能力，提高學(xué)生組織能力、交往與合作能力、學(xué)習(xí)技能。3教育目標(biāo)：培養(yǎng)學(xué)生的情感、態(tài)度、價(jià)值觀：培養(yǎng)學(xué)生實(shí)際操作能力，以及與同伴合作交流意識(shí)和能力，加強(qiáng)團(tuán)隊(duì)合作。項(xiàng)目重點(diǎn)：1使學(xué)生了解實(shí)施一個(gè)項(xiàng)目的全流程。2綜合運(yùn)用知識(shí)解決實(shí)際問題。3熟

2、練所學(xué)的網(wǎng)頁(yè)設(shè)計(jì)與制作知識(shí)解決實(shí)際實(shí)際項(xiàng)目。項(xiàng)目難點(diǎn)：1學(xué)生綜合運(yùn)用知識(shí)來解決實(shí)際問題的能力。2分工合作完成整個(gè)項(xiàng)目。3.網(wǎng)頁(yè)界面創(chuàng)新能力。教學(xué)方法：項(xiàng)目教學(xué)法教學(xué)過程：一、項(xiàng)目要求：為迎接國(guó)家教育部本科教學(xué)工作水平評(píng)估，要體現(xiàn)“以評(píng)促建，以評(píng)促改，以評(píng)促管，評(píng)建結(jié)合，重在建設(shè)”的方針，實(shí)現(xiàn)評(píng)估倒計(jì)時(shí)，包括“組織機(jī)構(gòu)、”“評(píng)估文件”、“評(píng)建動(dòng)態(tài)”、“迎評(píng)簡(jiǎn)報(bào)”、“評(píng)建知識(shí)”、“他山之石”等模塊，網(wǎng)站中應(yīng)包含“學(xué)院主頁(yè)”與“教務(wù)在線”鏈接，網(wǎng)站風(fēng)格要簡(jiǎn)介、清爽。確定任務(wù)：建設(shè)淮陰師范學(xué)院本科教學(xué)評(píng)建網(wǎng)項(xiàng)目。二、項(xiàng)目分析（導(dǎo)入課程）我們的學(xué)校有這種需求嗎?有哪些學(xué)校有類似的需求？教師根據(jù)回答進(jìn)行總

3、結(jié)，展示類似項(xiàng)目較廣。引出今天的課程，展示一張由教師最終設(shè)計(jì)的效果圖為例子。將Photoshop、Dreamweaver軟件與具體的網(wǎng)站設(shè)計(jì)工作結(jié)合起來，設(shè)計(jì)一張實(shí)際工作中的網(wǎng)站效果圖，讓學(xué)生從親身的感受中說、做、學(xué)，優(yōu)化教學(xué)過程，改進(jìn)學(xué)習(xí)方式，并倡導(dǎo)學(xué)生主動(dòng)參與學(xué)習(xí)和同學(xué)交流合作，用不同的方式來學(xué)習(xí)知識(shí)。通過自己的討論交流進(jìn)行探索和實(shí)現(xiàn)問題的解決，形成一定的知識(shí)解決模型，最終解決實(shí)際生活問題。示范項(xiàng)目：以一張網(wǎng)站效果圖為例，細(xì)致演示項(xiàng)目的整個(gè)流程。（整個(gè)演示過程制作成多媒體課件（視頻錄像）放在局域網(wǎng)上，可供學(xué)生在實(shí)戰(zhàn)項(xiàng)目時(shí)，遇到問題可隨時(shí)下載再觀看。）項(xiàng)目分析得到問題解決的思路與方法。分析：

4、根據(jù)客戶提供的需求，利用Word（visio）、Photoshop、Dreamweaver等軟件制作項(xiàng)目策劃或草圖設(shè)計(jì)、效果圖、網(wǎng)站前臺(tái)方案。整個(gè)設(shè)計(jì)過程分為以下四個(gè)子項(xiàng)目：項(xiàng)目需求的整理。項(xiàng)目策劃（詳細(xì)）或草圖設(shè)計(jì)（粗略）。效果圖設(shè)計(jì)。后期制作與前后臺(tái)代碼整合。三、教學(xué)策略分析1學(xué)習(xí)者分析學(xué)生學(xué)習(xí)該項(xiàng)目之前已經(jīng)掌握了Photoshop、Dreamweaver的基本命令，能夠熟練使用這些網(wǎng)頁(yè)設(shè)計(jì)與制作軟件。教學(xué)理念和教學(xué)方式教學(xué)是師生之間、學(xué)生之間交往互動(dòng)與共同發(fā)展的過程。計(jì)算機(jī)教學(xué)，要緊密聯(lián)系學(xué)生的生活實(shí)際。采用項(xiàng)目教學(xué)法學(xué)習(xí)，教師可以利用網(wǎng)絡(luò)的優(yōu)勢(shì)，成為知識(shí)傳播者、問題情境的創(chuàng)設(shè)者、嘗試點(diǎn)

5、撥的引導(dǎo)者、知識(shí)反饋的調(diào)整者。學(xué)生是學(xué)習(xí)的主人，在教師的幫助下，小組合作交流中，利用動(dòng)手操作探索，發(fā)現(xiàn)新知識(shí)，自主學(xué)習(xí)。教學(xué)評(píng)價(jià)方式多樣化，包括師生評(píng)價(jià)、學(xué)生評(píng)價(jià)、小組評(píng)價(jià)等多種方式。在課堂上利用明確無誤的工作表結(jié)果對(duì)學(xué)生的學(xué)習(xí)和練習(xí)作出評(píng)價(jià)，讓每個(gè)學(xué)生都能體驗(yàn)到成功的樂趣。采用項(xiàng)目教學(xué)法，讓學(xué)生把分散知識(shí)的各知識(shí)點(diǎn)綜合起來，應(yīng)用于實(shí)際的行業(yè)工作中。四、教學(xué)準(zhǔn)備50臺(tái)計(jì)算機(jī)聯(lián)網(wǎng)，有電子教室軟件或投影機(jī)。五、時(shí)間安排（總課時(shí)：30課時(shí)）任務(wù)1項(xiàng)目需求的整理。（4課時(shí)）任務(wù)2項(xiàng)目策劃（詳細(xì)）或草圖設(shè)計(jì)（粗略）（4課時(shí)）任務(wù)3效果圖設(shè)計(jì)。（14課時(shí)）任務(wù)4后期制作與代碼的整合。（4課時(shí)）項(xiàng)目?jī)?nèi)部驗(yàn)收

6、（4課時(shí)）六、項(xiàng)目實(shí)施1.實(shí)訓(xùn)項(xiàng)目：淮陰師范學(xué)院本科教學(xué)評(píng)建網(wǎng)建設(shè)（老師提供相關(guān)圖片文件與資源，可供學(xué)生下載）2.學(xué)生分組實(shí)戰(zhàn)將學(xué)生分成10到12個(gè)組，每組三、四名同學(xué)，每個(gè)組模擬一家設(shè)計(jì)公司角色扮演：小組：網(wǎng)站設(shè)計(jì)公司小組成員：設(shè)計(jì)人員小組組長(zhǎng)：項(xiàng)目經(jīng)理教師：客戶組名項(xiàng)目經(jīng)理成員公司名稱1組（由教師指派）公司名稱由各小組在項(xiàng)目經(jīng)理的組織下自己命名2組12組客戶交流：由教師扮演客戶，每組在實(shí)施項(xiàng)目之前，派出各組的項(xiàng)目經(jīng)理和客戶交流，聽取客戶的意見，并適當(dāng)提出自己的各種想法。各小組分組設(shè)計(jì)：首先由各組的項(xiàng)目經(jīng)理向小組成員講述客戶需求，組員開始分子項(xiàng)目進(jìn)行設(shè)計(jì)，一個(gè)子項(xiàng)目應(yīng)當(dāng)按期完成，然后項(xiàng)目經(jīng)理

7、在組內(nèi)分階段評(píng)選最佳的設(shè)計(jì)，交客戶（教師）審閱，由客戶（教師）提出修改意見，再實(shí)施下一個(gè)子項(xiàng)目存盤交付作品：每組選出一個(gè)優(yōu)秀設(shè)計(jì)作品，存盤保存后交客戶（教師）競(jìng)標(biāo)評(píng)選。七、項(xiàng)目驗(yàn)收（內(nèi)部驗(yàn)收）各組項(xiàng)目經(jīng)理向全班匯報(bào)、展示、交流本組設(shè)計(jì)的最終作品，在介紹過程中要求說明各組平面布置圖的設(shè)計(jì)思路以及制作過程中遇到過什么問題，這些問題是如何解決的，同時(shí)，其他組的同學(xué)也可提出問題，讓設(shè)計(jì)者解釋設(shè)計(jì)所用的相關(guān)技術(shù)及特點(diǎn)。最后各組之間進(jìn)行互評(píng)，互相學(xué)習(xí)，通過相互評(píng)價(jià)進(jìn)一步修改各自的設(shè)計(jì)，評(píng)選出客戶最滿意的作品，教師點(diǎn)評(píng)。自評(píng)/互評(píng)表如下：淮陰師范學(xué)院本科教學(xué)評(píng)建網(wǎng)建設(shè)項(xiàng)目活動(dòng)評(píng)價(jià)表項(xiàng)目?jī)?nèi)容要求評(píng)定（3,2，1,0）自評(píng)組評(píng)師評(píng)與客戶交流是否充分聽取客戶的意見口是口否網(wǎng)站布局是否合理網(wǎng)站布局是否運(yùn)用合理：口合理口需改進(jìn)色彩搭配是否合理色彩搭配是否合理：口合理口需改進(jìn)是否符合人體工程學(xué)是否符合人體工程學(xué)口非常好口一般口需改進(jìn)應(yīng)用價(jià)值設(shè)計(jì)應(yīng)用價(jià)值口好口較好口一般意見與反饋優(yōu)秀作品展示優(yōu)秀作品展示，讓學(xué)生看到在小組內(nèi)評(píng)選出的“網(wǎng)頁(yè)設(shè)計(jì)師”的作品，給學(xué)生以美的欣賞和智慧的碰撞，這樣的活動(dòng)很好地激發(fā)了