線上線下混合式教學(xué)模式在網(wǎng)站設(shè)計(jì)專業(yè)課程中的探索與實(shí)踐

麥小霞

摘 要：現(xiàn)代信息技術(shù)的發(fā)展豐富了教師的教學(xué)方式，很多學(xué)校線上教學(xué)也發(fā)展得不錯(cuò)，如何充分發(fā)揮線上教學(xué)的優(yōu)勢(shì)，將疫情防控期間的線上教學(xué)經(jīng)驗(yàn)運(yùn)用到傳統(tǒng)線下教學(xué)中，成為教學(xué)改革的研究熱點(diǎn)。本文基于對(duì)網(wǎng)站設(shè)計(jì)專業(yè)課程教學(xué)現(xiàn)狀的分析，探索了線上線下混合式教學(xué)模式，以Web UI設(shè)計(jì)課程為例進(jìn)行了教學(xué)設(shè)計(jì)與實(shí)踐，并進(jìn)行了總結(jié)和反思。

關(guān)鍵詞：線上線下 混合式教學(xué) 網(wǎng)站設(shè)計(jì)專業(yè)

得益于信息技術(shù)的飛速發(fā)展，信息技術(shù)將進(jìn)一步融入常規(guī)教學(xué)活動(dòng)，對(duì)基于“互聯(lián)網(wǎng)+”的線上線下混合式教學(xué)模式進(jìn)行理論和實(shí)踐研究是深化網(wǎng)站設(shè)計(jì)專業(yè)課程改革的必然要求，對(duì)實(shí)現(xiàn)專業(yè)教學(xué)的發(fā)展和創(chuàng)新有著重要的意義。

一、網(wǎng)站設(shè)計(jì)專業(yè)課程教學(xué)現(xiàn)狀分析

（一）傳統(tǒng)線下課堂教學(xué)模式現(xiàn)狀分析

1.教學(xué)的形式不夠多樣化

網(wǎng)站設(shè)計(jì)專業(yè)課程屬于實(shí)踐類課程，在教學(xué)過(guò)程中，多是以面授為主，教師講解知識(shí)點(diǎn)、示范技能操作方法，學(xué)生使用教師提供的素材，運(yùn)用所學(xué)到的方法把界面臨摹出來(lái)，從而學(xué)習(xí)相關(guān)的知識(shí)和技能。

2.學(xué)生的學(xué)習(xí)方式以被動(dòng)接受為主

在網(wǎng)站設(shè)計(jì)專業(yè)課程的教學(xué)中，教師講解知識(shí)點(diǎn)與操作演示需要占用大量的時(shí)間。在教學(xué)過(guò)程中，教師處于主體地位，學(xué)生處于被動(dòng)參與地位。教學(xué)輸出占用了大部分課堂時(shí)間，學(xué)生沒(méi)有獨(dú)立思考和獨(dú)立探索的時(shí)間，這樣容易導(dǎo)致學(xué)生對(duì)知識(shí)技能理解不到位，如若換成其他同類型的項(xiàng)目讓學(xué)生嘗試獨(dú)立完成，他們往往都是沒(méi)法完成的。

3.學(xué)生的水平參差不齊

在前面兩年的學(xué)習(xí)中，學(xué)生的網(wǎng)站設(shè)計(jì)水平有著顯著的差異，學(xué)生的軟件操作熟練程度不同，設(shè)計(jì)理論知識(shí)的掌握程度也不同，完成同樣的項(xiàng)目所需花費(fèi)的時(shí)間有比較大的差異。在傳統(tǒng)課堂教學(xué)模式中，教師只能考慮大部分學(xué)生的學(xué)習(xí)進(jìn)度，不可能分配大量的時(shí)間給進(jìn)度慢的學(xué)生，進(jìn)度慢的學(xué)生在課后如果沒(méi)有教師的輔導(dǎo)，不知道如何學(xué)習(xí)完剩下的內(nèi)容。

（二）網(wǎng)站設(shè)計(jì)專業(yè)課程線上線下混合式教學(xué)模式可行性分析

1.相關(guān)部門建立了線上課程資源平臺(tái)，提供了優(yōu)質(zhì)教育資源

2020年9月16日，教育部等九部門印發(fā)的《職業(yè)教育提質(zhì)培優(yōu)行動(dòng)計(jì)劃（2020—2023年）》通知中，提出要推動(dòng)信息技術(shù)與教育教學(xué)深度融合，分級(jí)遴選5 000門左右職業(yè)教育在線精品課程，進(jìn)一步擴(kuò)大了優(yōu)質(zhì)教學(xué)資源庫(kù)的建設(shè)、應(yīng)用及資源共享。

截至目前，超星學(xué)習(xí)通平臺(tái)和中國(guó)大學(xué)MOOC（慕課）上都有網(wǎng)站設(shè)計(jì)專業(yè)相關(guān)在線開放課程，如UI設(shè)計(jì)與制作、移動(dòng)UI設(shè)計(jì)、UI設(shè)計(jì)等，為網(wǎng)站設(shè)計(jì)專業(yè)課程的線上線下混合式教學(xué)的開展提供了優(yōu)質(zhì)課程資源支持。

2.網(wǎng)站設(shè)計(jì)專業(yè)以實(shí)踐性課程為主，課程性質(zhì)決定了本專業(yè)課程適合采用混合式教學(xué)模式

在網(wǎng)站設(shè)計(jì)專業(yè)課程教學(xué)中，學(xué)生首先需要掌握設(shè)計(jì)的相關(guān)理論知識(shí)，然后通過(guò)大量的網(wǎng)頁(yè)元素設(shè)計(jì)、各種類型的網(wǎng)頁(yè)界面設(shè)計(jì)等實(shí)踐練習(xí)，掌握網(wǎng)頁(yè)設(shè)計(jì)的知識(shí)與技能。

實(shí)踐練習(xí)是網(wǎng)站設(shè)計(jì)專業(yè)知識(shí)的有效獲取途徑，進(jìn)行線下教學(xué)時(shí)教師可進(jìn)行面對(duì)面輔導(dǎo)，隨時(shí)答疑反饋，這是線上教學(xué)所不具備的。雖然線上教學(xué)拓展了課堂的空間，學(xué)習(xí)不受時(shí)間的限制，學(xué)生可以隨時(shí)隨地、多次學(xué)習(xí)課程內(nèi)容，但也存在自主學(xué)習(xí)能力弱的學(xué)生無(wú)法獨(dú)自通過(guò)線上學(xué)習(xí)掌握課程的知識(shí)技能等缺點(diǎn)。

因此，只有將線下的實(shí)踐指導(dǎo)與線上的學(xué)習(xí)相結(jié)合，才能真正實(shí)現(xiàn)網(wǎng)站設(shè)計(jì)專業(yè)課程的混合式教學(xué)，提升教學(xué)質(zhì)量。

二、網(wǎng)站設(shè)計(jì)專業(yè)線上線下混合式教學(xué)模式的探索

網(wǎng)站設(shè)計(jì)專業(yè)對(duì)接互聯(lián)網(wǎng)企業(yè)，以前端開發(fā)工程師、UI設(shè)計(jì)師等職業(yè)需求為導(dǎo)向，以網(wǎng)站設(shè)計(jì)實(shí)踐能力培養(yǎng)為主，更加側(cè)重學(xué)生的技能培養(yǎng)。本專業(yè)招生面向的是初中畢業(yè)生，部分學(xué)生自律性差、學(xué)習(xí)的積極性和主動(dòng)性不強(qiáng)。

結(jié)合網(wǎng)站設(shè)計(jì)專業(yè)的課程特點(diǎn)及對(duì)學(xué)生的學(xué)情分析和教師自身的實(shí)踐教學(xué)經(jīng)驗(yàn)，本專業(yè)課程線上線下混合式教學(xué)模式主要采用線下主導(dǎo)、線上為輔的模式，分為課前、課中、課后和評(píng)價(jià)四個(gè)部分。

課前，教師精心設(shè)計(jì)教學(xué)，尋找線上資源，線上推送資源給學(xué)生；學(xué)生自主學(xué)習(xí)，提交作業(yè)；教師在線給予學(xué)生學(xué)習(xí)反饋，開展答疑、組織學(xué)生進(jìn)行線上互評(píng)互動(dòng)等活動(dòng)，實(shí)現(xiàn)課程的知識(shí)學(xué)習(xí)目標(biāo)。

課中，教師線下檢驗(yàn)學(xué)生課前學(xué)習(xí)成果，通過(guò)講解或演示幫助學(xué)生掌握學(xué)習(xí)的重難點(diǎn)；學(xué)生進(jìn)行實(shí)訓(xùn)項(xiàng)目實(shí)踐，轉(zhuǎn)化知識(shí)內(nèi)容，完成課程的能力目標(biāo)。

課后，教師線上推送拓展資源、答疑并進(jìn)行下一次任務(wù)的推送，學(xué)生自主完成拓展內(nèi)容，進(jìn)行知識(shí)技能的鞏固內(nèi)化，完成課程的職業(yè)素養(yǎng)目標(biāo)。

學(xué)習(xí)評(píng)價(jià)貫穿整個(gè)教學(xué)過(guò)程，課前、課中、課后都有學(xué)習(xí)評(píng)價(jià)反饋，通過(guò)實(shí)踐，探索“線上資源學(xué)習(xí)、線下活動(dòng)鞏固、過(guò)程評(píng)價(jià)反饋”的線上線下混合式教學(xué)模式。

三、線上線下混合式教學(xué)設(shè)計(jì)與實(shí)施——以Web? UI設(shè)計(jì)課程為例

（一）課程目標(biāo)

在網(wǎng)站設(shè)計(jì)專業(yè)課程中，Web UI設(shè)計(jì)是一門專業(yè)核心課程，教師根據(jù)企業(yè)典型工作任務(wù)所需的職業(yè)能力要求進(jìn)行教學(xué)，遵循比較學(xué)習(xí)原則，設(shè)計(jì)了四個(gè)學(xué)習(xí)任務(wù)，按照目標(biāo)遞進(jìn)原則、比較學(xué)習(xí)原則確定了本課程的學(xué)習(xí)目標(biāo)，幫助學(xué)生提升學(xué)習(xí)能力。Web UI設(shè)計(jì)課程學(xué)習(xí)任務(wù)和學(xué)習(xí)目標(biāo)具體如下。

任務(wù)一：和茶企業(yè)官網(wǎng)UI設(shè)計(jì)。學(xué)習(xí)目標(biāo)是達(dá)到基礎(chǔ)層次需求，闡述UI設(shè)計(jì)的基本概念、特征、設(shè)計(jì)規(guī)范、設(shè)計(jì)原則、設(shè)計(jì)流程，按照教師的演示一步步完成UI設(shè)計(jì)。學(xué)生能識(shí)記并理解UI設(shè)計(jì)基礎(chǔ)知識(shí)。

任務(wù)二：和茶企業(yè)官網(wǎng)響應(yīng)式UI設(shè)計(jì)。學(xué)習(xí)目標(biāo)是達(dá)到應(yīng)用層次需求，運(yùn)用UI設(shè)計(jì)規(guī)范、設(shè)計(jì)原則、設(shè)計(jì)流程，在教師的指導(dǎo)下，學(xué)著去完成UI設(shè)計(jì)。學(xué)生能理解并運(yùn)用UI設(shè)計(jì)知識(shí)與技能。

任務(wù)三：和茶企業(yè)App UI設(shè)計(jì)。學(xué)習(xí)目標(biāo)是達(dá)到綜合層次需求，根據(jù)客戶要求，獨(dú)立完成UI設(shè)計(jì)。學(xué)生能運(yùn)用UI設(shè)計(jì)知識(shí)獨(dú)立完成界面設(shè)計(jì)，能分析并評(píng)價(jià)UI設(shè)計(jì)界面。

任務(wù)四：和茶企業(yè)小程序UI設(shè)計(jì)。學(xué)習(xí)目標(biāo)是達(dá)到創(chuàng)新層次需求，運(yùn)用UI設(shè)計(jì)的方法技能，根據(jù)客戶要求，制定設(shè)計(jì)方案，創(chuàng)新并獨(dú)立完成UI設(shè)計(jì)。學(xué)生能運(yùn)用UI設(shè)計(jì)知識(shí)創(chuàng)造性地完成不同UI產(chǎn)品界面設(shè)計(jì)，達(dá)到高階能力標(biāo)準(zhǔn)要求。

（二）課程教學(xué)設(shè)計(jì)與實(shí)施

Web UI設(shè)計(jì)是一門實(shí)踐性很強(qiáng)的課程，為了達(dá)到課程學(xué)習(xí)目標(biāo)，學(xué)生從第一個(gè)學(xué)習(xí)任務(wù)，即UI設(shè)計(jì)基本知識(shí)的識(shí)記、理解的學(xué)習(xí)目標(biāo)開始學(xué)習(xí)，到最后一個(gè)學(xué)習(xí)任務(wù)，即創(chuàng)造性運(yùn)用UI設(shè)計(jì)知識(shí)的學(xué)習(xí)目標(biāo)結(jié)束，教學(xué)包括課前、課中、課后、評(píng)價(jià)四個(gè)環(huán)節(jié)。

1.課前線上自主學(xué)習(xí)

教師根據(jù)學(xué)習(xí)目標(biāo)、學(xué)情分析，錄制UI設(shè)計(jì)規(guī)范、UI設(shè)計(jì)流程等案例視頻，并根據(jù)課程需要選用中國(guó)大學(xué)MOOC（慕課）在線開放課程移動(dòng)UI設(shè)計(jì)里的部分視頻資源。在教學(xué)過(guò)程中，把課程相關(guān)資源上傳至超星學(xué)習(xí)通平臺(tái)，并向?qū)W生發(fā)送學(xué)習(xí)任務(wù)通知，即自主學(xué)習(xí)理論知識(shí)，完成線上測(cè)試，并收集UI界面設(shè)計(jì)案例。學(xué)生接到課程學(xué)習(xí)任務(wù)后，線上進(jìn)行自主學(xué)習(xí)，為后續(xù)課堂教學(xué)奠定理論基礎(chǔ)。同時(shí)，教師在線指導(dǎo)并鼓勵(lì)學(xué)生參與討論、積極思考。

將學(xué)生的討論過(guò)程及視頻學(xué)習(xí)進(jìn)度、線上測(cè)試成績(jī)等作為學(xué)生過(guò)程考核評(píng)價(jià)的內(nèi)容，同時(shí)評(píng)價(jià)考核學(xué)生的自主學(xué)習(xí)能力、表達(dá)能力等職業(yè)素養(yǎng)。

2.課中線下集中面授學(xué)習(xí)

課堂集中學(xué)習(xí)以培養(yǎng)學(xué)生Web UI設(shè)計(jì)的專業(yè)技能為主。

首先，教師針對(duì)學(xué)生課前自主學(xué)習(xí)情況進(jìn)行點(diǎn)評(píng)，再針對(duì)學(xué)生學(xué)習(xí)薄弱的環(huán)節(jié)或者本次課的關(guān)鍵知識(shí)點(diǎn)進(jìn)行重點(diǎn)講解。

其次，對(duì)學(xué)生課前搜索到的優(yōu)秀UI設(shè)計(jì)界面進(jìn)行賞析，鼓勵(lì)學(xué)生討論、分析UI界面設(shè)計(jì)的優(yōu)點(diǎn)和設(shè)計(jì)的邏輯，明確不同類型UI界面設(shè)計(jì)的關(guān)鍵點(diǎn)，為如何設(shè)計(jì)UI界面做鋪墊。教師以茶企業(yè)為主體演示如何通過(guò)頭腦風(fēng)暴整理出頁(yè)面所需的元素，再運(yùn)用線上微視頻學(xué)習(xí)到的設(shè)計(jì)規(guī)范、設(shè)計(jì)規(guī)則等知識(shí)，設(shè)計(jì)出和茶企業(yè)官網(wǎng)、App和小程序界面，引導(dǎo)學(xué)生思考，內(nèi)化課堂知識(shí)。

最后，學(xué)生在教師指導(dǎo)下完成UI界面設(shè)計(jì)，并進(jìn)行展示互評(píng)。

將學(xué)生在課堂中的學(xué)習(xí)過(guò)程表現(xiàn)，如課堂參與度、課堂知識(shí)掌握程度作為學(xué)習(xí)過(guò)程評(píng)價(jià)的一部分內(nèi)容。學(xué)生設(shè)計(jì)作品的質(zhì)量，包括界面設(shè)計(jì)的完成度、界面主題的表現(xiàn)、界面設(shè)計(jì)的規(guī)范、界面設(shè)計(jì)的視覺效果、界面設(shè)計(jì)的創(chuàng)新和界面設(shè)計(jì)是否符合企業(yè)要求等作為學(xué)生成果考核評(píng)價(jià)的一部分，側(cè)重職業(yè)能力的評(píng)價(jià)，同時(shí)評(píng)價(jià)學(xué)生的表達(dá)能力、分析歸納能力等職業(yè)素養(yǎng)。

3.課后線上拓展提升

課后的學(xué)習(xí)側(cè)重課堂的學(xué)習(xí)反饋和拓展提升。學(xué)生可以在超星學(xué)習(xí)通平臺(tái)提出對(duì)課堂學(xué)習(xí)內(nèi)容有疑問(wèn)的知識(shí)技能點(diǎn)，教師組織學(xué)生一起討論回答。另外，操作技能較弱、操作速度慢的學(xué)生，可以在線觀看操作視頻，完成作業(yè)。教師在線提供拓展項(xiàng)目案例的相關(guān)資源，讓學(xué)生鞏固拓展本次所學(xué)內(nèi)容。將學(xué)生課后完成的拓展練習(xí)作為學(xué)生職業(yè)素養(yǎng)評(píng)價(jià)的一部分內(nèi)容，評(píng)價(jià)學(xué)生的知識(shí)遷移能力、自主學(xué)習(xí)能力等。

4.評(píng)價(jià)貫穿始終

課程評(píng)價(jià)以學(xué)習(xí)目標(biāo)為導(dǎo)向，重點(diǎn)對(duì)學(xué)生的職業(yè)素養(yǎng)和職業(yè)能力進(jìn)行評(píng)價(jià)，包括學(xué)生的自主學(xué)習(xí)能力、溝通表達(dá)能力等職業(yè)素養(yǎng)通用性指標(biāo)，也包括學(xué)生的知識(shí)理解、技能掌握等專業(yè)性指標(biāo)，從不同角度關(guān)注學(xué)生綜合職業(yè)能力和職業(yè)素養(yǎng)的培養(yǎng)，把職業(yè)能力目標(biāo)與職業(yè)素養(yǎng)目標(biāo)的評(píng)價(jià)分散在課前、課中、課后的學(xué)習(xí)中完成，貫穿課程教學(xué)始終。

四、網(wǎng)站設(shè)計(jì)專業(yè)課程線上線下混合式教學(xué)的總結(jié)與反思

目前，Web UI設(shè)計(jì)課程采用了線上線下混合式教學(xué)模式，整體而言，學(xué)生還是喜歡這種新的教學(xué)模式，肯定了這種教學(xué)模式的優(yōu)勢(shì)。例如，線上學(xué)習(xí)的時(shí)間靈活，可以反復(fù)學(xué)習(xí)，大大提高了學(xué)習(xí)的主動(dòng)性；線下課堂集中學(xué)習(xí)有助于消化重難點(diǎn)知識(shí)，提高知識(shí)的運(yùn)用能力，提升技能水平等。

同時(shí)，在教學(xué)過(guò)程中，混合式教學(xué)也存在一些問(wèn)題，如視頻資源制作質(zhì)量有待提升，視頻時(shí)間長(zhǎng)度還需斟酌，教師教學(xué)任務(wù)加重、影響教學(xué)情緒等。

為了在網(wǎng)站設(shè)計(jì)專業(yè)課程中更好地采用線上線下混合式教學(xué)模式，取得更好的教學(xué)效果，筆者在現(xiàn)有課程實(shí)踐經(jīng)驗(yàn)基礎(chǔ)上進(jìn)行反思，認(rèn)為需要在以下三個(gè)方面繼續(xù)改進(jìn)。

（一）師生需要充分利用現(xiàn)有線上課程資源平臺(tái)

高質(zhì)量的課程資源是線上線下混合式教學(xué)開展的基礎(chǔ)，一方面教師要充分利用超星學(xué)習(xí)通平臺(tái)、中國(guó)大學(xué)MOOC（慕課）等開放平臺(tái)上的資源，也需要繼續(xù)挖掘收費(fèi)培訓(xùn)類平臺(tái)，整合不同平臺(tái)的資源，豐富線上教學(xué)資源，另一方面要允許學(xué)生根據(jù)自己的學(xué)習(xí)進(jìn)度或者興趣愛好自主選擇對(duì)應(yīng)的知識(shí)點(diǎn)進(jìn)行學(xué)習(xí)，這樣可以大大提高學(xué)生學(xué)習(xí)的主觀能動(dòng)性和學(xué)習(xí)自由度。

（二）教師的引導(dǎo)、監(jiān)控教學(xué)過(guò)程的作用需要進(jìn)一步發(fā)揮

線上線下混合式教學(xué)模式是以學(xué)生為主體、教師為主導(dǎo)的教學(xué)方式，這對(duì)教師、學(xué)生的能力有更高的要求，需要教師全程監(jiān)控學(xué)生的學(xué)習(xí)，準(zhǔn)確掌握學(xué)生的學(xué)習(xí)情況。教師要充分發(fā)揮學(xué)習(xí)平臺(tái)的數(shù)據(jù)監(jiān)控功能，或者引入人工智能學(xué)情分析系統(tǒng)，通過(guò)采集學(xué)生的學(xué)習(xí)數(shù)據(jù)，了解學(xué)生的學(xué)習(xí)情況或?qū)W習(xí)偏好，為學(xué)生精準(zhǔn)推送相應(yīng)的線上資源包，促進(jìn)學(xué)生學(xué)習(xí)能力的提升。

（三）需要構(gòu)建多層次、多主體的評(píng)價(jià)體系

線上線下混合式教學(xué)模式要求學(xué)生有更強(qiáng)的自主學(xué)習(xí)能力，但部分學(xué)生學(xué)習(xí)自覺性比較欠缺。

因此，應(yīng)當(dāng)多設(shè)置不同類型的線上過(guò)程化考核評(píng)價(jià)方式，如線上觀看課程視頻、線上投票答題、線上討論、線上作業(yè)互批和線上理論測(cè)試等，提高學(xué)生的興趣，增強(qiáng)學(xué)生的參與感，完善學(xué)生自主學(xué)習(xí)的激勵(lì)機(jī)制。

線下課堂的評(píng)價(jià)，一方面以課堂學(xué)習(xí)過(guò)程中的觀察為主，學(xué)生和教師共同評(píng)價(jià)學(xué)生的團(tuán)隊(duì)合作能力、溝通協(xié)調(diào)能力和解決問(wèn)題能力等職業(yè)素養(yǎng)，另一方面通過(guò)學(xué)生完成項(xiàng)目的質(zhì)量來(lái)評(píng)價(jià)專業(yè)能力，并且可以引入企業(yè)專家共同參與評(píng)價(jià)，讓學(xué)生設(shè)計(jì)的作品更加符合企業(yè)需求。

參考文獻(xiàn)：

[1]王文豪，仇冬，陳曉兵，等.線上線下混合教學(xué)模式構(gòu)建：以Java程序設(shè)計(jì)為例[J].湖北師范大學(xué)學(xué)報(bào)（哲學(xué)社會(huì)科學(xué)版），2021（4）.

[2]袁貝貝.線上線下融合教學(xué)模式平臺(tái)構(gòu)建研究：以三維動(dòng)畫制作課程為例[J].信息與電腦（理論版），2020（22）.

[3]侯征.線上線下混合式教學(xué)在景觀規(guī)劃設(shè)計(jì)課程中探索與實(shí)踐[J].現(xiàn)代園藝，2021（19）.

[4]過(guò)夢(mèng)旦.Python課程線上線下混合式教學(xué)研究與實(shí)踐[J].中國(guó)新通信，2021（17）.

[5]吳燕.線上線下混合式教學(xué)模式在“計(jì)算機(jī)輔助設(shè)計(jì)”課程中的探索[J].安徽建筑，2021（11）.

[6]從悅.網(wǎng)絡(luò)營(yíng)銷視域下混合式教學(xué)在網(wǎng)頁(yè)美工課程改革中的實(shí)踐與研究[J].營(yíng)銷界，2020（47）.

[7]孫可，趙楷夫.線上教學(xué)到線上線下混合式教學(xué)實(shí)踐[J].沈陽(yáng)師范大學(xué)學(xué)報(bào)（自然科學(xué)版），2021（4）.

（作者單位：廣州市工貿(mào)技師學(xué)院）