基于OBE教育理念的“Web前端開發”課程項目貫穿式教學設計

錢欣麗 王瑜琳 宋濤 劉學虎 徐曉靈

摘?要：針對當下Web前端開發課程教學滯后于行業發展的問題，提出了基于OBE教育理念指導，以職業活動為導向重構教學內容，以“逆向設計、正向實施”推進教學改革，以“學生中心，任務驅動”組織教學實施，以達到“專業對接職業崗位、課程內容與對接職業標準”的目的。

關鍵詞：Web前端開發；OBE教育理念；教學設計

Abstract：Aiming?at?the?problem?that?the?teaching?of?Web?frontend?development?courses?lags?behind?the?development?of?the?industry，this?paper?proposes?to?reconstruct?the?teaching?content?based?on?the?OBE?education?philosophy?guidance，reconstruct?the?teaching?content?guided?by?vocational?activities，promote?the?teaching?reform?with?"reverse?design?and?positive?implementation"，and?organize?the?teaching?implementation?with?"studentcentered，taskdriven"?to?achieve?the?purpose?of?"professional?docking?of?professional?positions，course?content?and?docking?professional?standards".

Keywords：Web?frontend?development；OBE?education?philosophy；Instructional?design

一、概述

隨著互聯互通的快速發展，Web應用不斷推陳出新，Web前端技術發揮著舉足輕重的作用。Web前端技術成為計算機、人工智能專業學生走上社會、專業對口就業不可或缺的一門知識和技術。目前，國內許多高職院校將Web前端技術等相關課程作為計算機、人工智能專業學生的專業必修課。

如今，智能化設備全面普及使Web前端頁面越來越復雜，從視覺體驗到對用戶的友好交互、技術特效等的要求越來越高，系統的維護要求不斷提升。一方面，前端技術的不斷演進帶來了前端開發模式的不斷改進，在基于前端開發逐漸趨于復雜性的背景下，如何對Web前端開發課程進行內部的教學改革探索使其適應企業的外部需求也成了我們關注的焦點。另一方面，高職教育作為該類人才培養的重要基地，現階段其畢業生在市場上較難找到滿意的專業對口工作，出現學校人才供給滯后于企業需求的現狀。究其原因，高職學生在校期間學習的內容與市場存在脫節，學生“學非所用”較為普遍，因此導致高職畢業生在企業招聘中無法體現自身應有優勢。唯有改良高職學校課程內容設置，促進其與企業職業標準、生產過程對接，達到與時俱進的效果，才能有效解決新一代信息技術領域的人力資源市場中技術技能型人才急缺的現狀。

傳統教育教學中，該課程通常采取教學設計為課程導向的正向設計，即學生學完本課程后，被動地適應社會及企業等的外部需求，無法實現職業崗位零距離對接?，F流行于高等工程教育的OBE教育理念，因其聚焦學生通過學習最終可以達到的學習成果，并據此對教學進行反向設計，對于只注重“教育投入”而不注重“教育產出”的傳統教學而言，是一種教學的根本性變革，為高職課程教學改革帶來了靈感與啟發。

介于此，本課題試將OBE教育理念應用于Web前端開發課程教學中，結合社會市場職業需求，將職業能力要求融入課程體系中，培養適合當下行業發展的技術技能人才。

二、教學現狀分析

目前，許多院校設置的Web開發相關課程，教學過程中教師大部分的教學重點放在前端開發技術（html、Css、JavaScript）的教學，忽略了對于前端技術的框架應用，學生雖然能實現一定的功能，但大部分課程體系與教學資源都比較陳舊，沒有跟上前端技術發展與企業用人需求的變化。Web前端開發已經作為一門獨立的課程，從成果導向教育角度來看，該課程目前存在以下的問題。

（一）教學理念

當下該課程對成果導向教育的教學理念應用缺乏，制約其學生觀、教師觀、課程觀、課堂觀的發展；教學模式缺乏創新，教學內容更新不及時；學生創新與時間能力及分析、解決問題能力無法滿足現代企業對人才的需求。

（二）教學內容

課程內容上，主要還是傳統的html、css和JavaScript技術，缺乏對新功能、新版本以及目前主流框架、工具的引入。講授課程內容陳舊老化，不能及時適應社會需求的變化。

（三）教學模式

課程往往采用傳統的以教師為中心、書本為中心、課堂為中心的教學模式，授課方式以平鋪直敘式、集中注入式為主，形成了教師單向灌輸、學生被動接受的局面，教師忽視學生學習成果。

（四）考核機制

在考核評價方面，仍然采用“課堂授課—考前復習—試卷筆試”為主的自上而下的對學生“定性”評價的傳統考核模式，評價內容統一，評價標準統一，只注重學生最終對知識的掌握程度，缺乏了對學生的多元、動態評價，往往忽視了對學生各方面能力的培養，導致學生高分低能，未能適應企業職業需要。

三、解決思路和方法

在OBE教育理念的指導下，對高職Web前端開發教學進行改革與實踐。研究的具體思路如下：

（1）針對課程教學存在的問題，根據前期調研的結果，以OBE教育理念為指導，遵循其四個基本實施原則，圍繞預期學習成果對Web前端開發課程教學進行設計。該設計具體過程為：①從知識、能力、素質三方面入手，確定Web前端開發課程的教學目標。②以知識點相互銜接且具有實際功能意義為宗旨，構建與教學目標相匹配的教學內容。③為實現學生個性化學習，充分鍛煉學生實踐動手能力，選擇有利于教學目標實現的任務驅動式教學模式。④從關注學生的學習成長、尊重學生的學情差異、注重多方參與出發，開展過程性與終結性相結合的多元教學評價，對教學的達成度進行監測與評估。

（2）選取開設該門課程的兩個平行班級，任選其中一個班作為實驗班，將基于OBE教育理念設計的教學新模式應用于該班。另一個班作為對照班，仍沿用現行傳統模式進行教學。經過一段時間的教育實踐，從兩個班的教學效果對比，實驗班學生就教學方法、教學過程、學習效果、課堂氛圍設計問卷調查四個指標來探究基于OBE教育理念設計的教學新模式的教學效果。

四、教學實施過程

（一）教學過程對接崗位流程

依據人培規格達成要求、完善后的課程標準、學生學情和崗位能力要求，確定三維教學目標。依據企業Web前端開發工作流程組織教學，在教學上采用具體的、真實的企業項目，任務要求和項目工作過程緊密聯系實際。

（二）課程內容與對接職業標準

課程內容對接Web前端開發職業技能等級標準，將職業技能等級證書中與課程內容相關的考核內容納入課程教學內容中，按照具體的職業標準來進行課程的教學設計，優化課程教學內容。

圍繞“內化于心，外化于行”進行思政教學設計，將思政元素浸潤四個教學任務的教學過程，創建情感共鳴和價值融通，潛移默化中幫助學生培養職業能力。

（三）教學模式采用任務驅動式

任務驅動式教學本質上就是完成任務的過程，在認識、分析、解決問題過程中使學生實現探究式、體驗式學習，學生學習由接受式向自主建構轉變，教師教學由灌輸式向引導轉變。因此，采用任務驅動式教學模式貫穿課前、課中、課后教學，其基本流程為如下圖。

教學流程圖

課前教師發布該節課教學內容，學生自主學習。課中教師發布任務案例，對任務進行分解分析，學生依據課前預習內容執行相應任務，采用師生互評、生生互評方式檢驗任務。課后學生根據教師要求進行教學內容規律總結并反饋。

（四）教學評價實施多維評價

Web前端開發是一門實踐性較強的課程，單純的閉卷考試方式不能客觀地評價學生的知識掌握情況及學生的知識運用能力。引入職業鑒定，根據相關概念和實施要點，采用形成性評價模式和持續改進模式，創建多元評價。通過診斷和評估檢查學生的先驗知識，分析學情；采用過程化階段性考核方式，從考核學生對知識的記憶轉為考核學生的應用能力，著重考查學生的表達設計能力；通過總結性評價，確認每個學生已獲得的內容掌握程度。評價活動貫穿課前、課中、課后三個階段，將評價重點放在學生的能力指標上，通過多方面評價確保學生達成預期學習目標。

五、教學效果

采用教育對照實驗的方式，選取開設該門課程的兩個平行班級，各班抽取24名專業能力、學習能力相當的學生，隨機將其中一個班級設置為實驗班，另一個班級設置為對照班。實驗班采用OBE教育理念設計的教學模式進行教學，對照班仍采用現行的教學傳統模式，但兩個班教學內容所含的知識點一致。經過一段時間的教育實踐，對比兩個班學生的學習成果，實驗班的學生對本課程的對知識構建能力及掌握程度均高于對照班。對教學方法、教學過程、學習效果、課堂氛圍四個指標制定相應的問卷內容，使用SPSS2.0對數據進行差異性分析如表3。

表3數據顯示，實驗班與對照班教學效果評價數據存在較為明顯的差異，從四個指標差異性結果顯示，P值均小于0.05，表明基于OBE教育理念的教學設計教學效果更好。

結語

針對當前高職Web前端開發教學中存在的問題，根據調研所得的企業、師生等教育利益相關者的實際需求，基于OBE教育理念，根據其反向設計、正向實施原則，在教學組織、教學內容、教學模式、教學評價方面設計了Web前端開發課程的教學改革方案，構建一種有著持續改進功能的教學反思閉環系統，進而改變該課程教學的現狀并提升教學的質量。后續將推進建設線上課程資源，構建出與時俱進的優質教學資源。

參考文獻：

［1］羅劍，邢翠，聶鑫.混合式教學模式下Web前端技術教學資源建設研究［J］.軟件導刊，2021，20（07）：198201.

［2］任倩，姚光順，胡曉靜，等.基于OBE理念的“Web前端開發”課程教學改革與實踐［J］.滁州學院學報，2021，23（05）：126130.

［3］劉鑫，杜宇恒，李曰陽.基于OBE理念的“機器人操作與編程”課程項目貫穿式教學設計［J］.南方農機，2023，54（08）：183185+198.

［4］黃院芳，寧善平，龍慶文，等.基于OBE理念的專業教育和思政教育協同育人實施路徑研究［J］.廣東交通職業技術學院學報，2023，22（01）：7276.

［5］嚴筱永，孫涵，胡夏蕓，等.OBE理念下任務驅動式網站原理與設計課程教學研究［J］.軟件導刊，2023，22（04）：198202.

項目基金：重慶公共運輸職業學院科研項目，基于OBE理念的Web前端開發課程教學探索與實踐（YSKY202212）；重慶市教育科學規劃課題：基于“1+X”證書制度的高職交通智能化專業群課證融通課程體系研究（K22YG?331369）；重慶公共運輸職業學院教育教學改革研究項目：“1+X證書”制度下人工智能技術服務專業課證融通課程體系研究（YSJG202101）

作者簡介：錢欣麗（1996—?），女，漢族，云南曲靖人，本科，助教，研究方向：交通數據、圖像處理。