湘美版電腦美術(shù)《閃客一族》教學(xué)設(shè)計(jì)

湘美版電腦美術(shù)《閃客一族》教學(xué)設(shè)計(jì)一、教學(xué)目標(biāo)本教學(xué)旨在通過湘美版電腦美術(shù)課程中的一則案例——《閃客一族》的教學(xué)，使學(xué)生掌握網(wǎng)頁(yè)制作基礎(chǔ)技能，培養(yǎng)學(xué)生的創(chuàng)新意識(shí)和視覺表現(xiàn)能力，并能夠運(yùn)用所學(xué)知識(shí)進(jìn)行設(shè)計(jì)制作。二、教學(xué)內(nèi)容1.教學(xué)背景《閃客一族》是中國(guó)影史上第一部以中國(guó)黑社會(huì)為主題的電影，是一部以黑幫為背景的電影。電影中的人物形象和場(chǎng)景設(shè)置較為獨(dú)特，很適合用于網(wǎng)頁(yè)制作的教學(xué)。2.教學(xué)內(nèi)容本教學(xué)內(nèi)容主要包括：網(wǎng)頁(yè)制作基礎(chǔ)知識(shí)介紹網(wǎng)站結(jié)構(gòu)和版面設(shè)計(jì)CSS樣式設(shè)計(jì)媒體元素插入網(wǎng)頁(yè)交互設(shè)計(jì)3.教學(xué)步驟第一步：網(wǎng)頁(yè)制作基礎(chǔ)知識(shí)介紹網(wǎng)頁(yè)基本結(jié)構(gòu)：HTML、CSS、JavaScript網(wǎng)頁(yè)制作工具：Dreamweaver、SublimeText、VScode等網(wǎng)頁(yè)設(shè)計(jì)流程：需求分析、產(chǎn)品策劃、界面設(shè)計(jì)、UI設(shè)計(jì)、前端開發(fā)、測(cè)試上線第二步：網(wǎng)站結(jié)構(gòu)和版面設(shè)計(jì)網(wǎng)站結(jié)構(gòu)設(shè)計(jì)：主頁(yè)、導(dǎo)航、內(nèi)容頁(yè)、搜索頁(yè)等版面設(shè)計(jì)原則：簡(jiǎn)潔明了、美觀大方、突出重點(diǎn)設(shè)計(jì)工具：Photoshop、AdobeXD等第三步：CSS樣式設(shè)計(jì)樣式表：內(nèi)部樣式表、外部樣式表、行內(nèi)樣式表樣式表語(yǔ)法：選擇器、屬性、屬性值常用樣式：文本樣式、背景樣式、邊框樣式、定位樣式第四步：媒體元素插入圖片，音頻，視頻等媒體元素的插入常用的圖片文件格式：JPEG、GIF、PNG等常用的音視頻文件格式：MP3、MP4、AVI等第五步：網(wǎng)頁(yè)交互設(shè)計(jì)網(wǎng)頁(yè)動(dòng)畫：CSS動(dòng)畫、JavaScript動(dòng)畫網(wǎng)頁(yè)事件：鼠標(biāo)事件、鍵盤事件、表單事件等常用插件：jQuery、Bootstrap等三、教學(xué)方法本教學(xué)采用“講述+演示+練手”的教學(xué)方法，旨在讓學(xué)生更好地掌握網(wǎng)頁(yè)制作基礎(chǔ)技能。四、教學(xué)資源本教學(xué)所需的教學(xué)資源如下：電腦美術(shù)教材：《湘美版電腦美術(shù)》電影：《閃客一族》網(wǎng)站制作工具：Dreamweaver、SublimeText、VScode等設(shè)計(jì)工具：Photoshop、AdobeXD等五、教學(xué)評(píng)估本教學(xué)采用考試與考查相結(jié)合的方式進(jìn)行評(píng)估，分別包括：作品考評(píng)：考查學(xué)生原創(chuàng)網(wǎng)站的制作技能及創(chuàng)新思維能力。課程實(shí)踐報(bào)告：考查學(xué)生對(duì)網(wǎng)站制作技能和工具的理解及應(yīng)用能力。六、總結(jié)本教學(xué)以《閃客一族》為案例，旨在通過網(wǎng)頁(yè)制作的教學(xué)讓學(xué)生在實(shí)踐中掌握網(wǎng)頁(yè)制作基礎(chǔ)技能，培養(yǎng)學(xué)生的創(chuàng)新意識(shí)和視覺表現(xiàn)能力。同時(shí)，本教學(xué)也為學(xué)生系統(tǒng)地介紹了網(wǎng)站