ADDPS教學模型在“UI交互設計”課程中的應用研究

李莉 陳樹菁

摘要：為達到人才培養目標，采取合適的教學方法和選取適合的教學內容非常重要。本文分析了ADDPS教學模型在“UI交互設計”課程中的應用，在設計課程時，將知識點與學生的興趣相結合，采用線上、線下、翻轉課堂等多種教學方法和多維度、多層次的考評方式，按照互聯網公司架構的角色分配任務，學生根據角色定位完成項目和課程的學習。經過幾輪教學實施，該方法不僅調動了學生的學習創造力，也驅動了教師的自我進步，教學相長，師生共進。

關鍵詞：ADDPS教學模型；UI交互設計；混合式教學

引言

教育部提出的開展一流本科教育，實施“新工科、新醫科、新農科和新文科”建設，是加快推進教育現代化、實現高等教育內涵式發展的重要舉措，對高校學科建設而言，在于面向科技創新、產業升級需求的學科融合發展理念。“四新”建設與學科專業優化、創新能力提高、產學研用融合、時代新人培養有著緊密的聯系[1]。

教有法而無定法，最有效的方法是因材施法。面對競爭日趨激烈的互聯網市場和全棧型開發人員的大量涌現，前端設計師在整個IT設計行業中迎來了新的挑戰[2]。因此，在當前教學和市場互為依存的環境下，針對創新型、實踐型課程，探索適合此課程的教學方法，應是每一位教師不懈的追求和堅持。

“UI交互設計”是一門實用性強的交叉性綜合課程，交叉學科的合作以及教育創新性的重要性不言而喻[3]。目前，在計算機專業相關課程的教學過程中，一般只注重理論和內容的講解，忽略了學習者對于學習內容的興趣和動機，也就是說，在教學方式上只注重技能的培養，而忽略了對學生創造力與創新的培養。運用適合課程的教學模式的意義在于注重學生的差異化與個性化，教學內容與環境相依相存，既驅動了教師的自我進步，也觸發學生的學習力，契合專業人才培養的目標[4-5]。

1. ADDPS教學模型構建與教學設計

通過教學過程實踐與摸索，采用“教學相長，知識點融入學生興趣中，多層次多維度考評，邊教邊學，邊學邊教，師生共進”的教學理念。例如，通過實戰項目“繪制QQ完整交互原型圖”和“XX招聘”網站實例，將知識點與學生關注點相結合。另外，通過小組合作完成帶有思政元素的課程作業設計，將知識點與社會情感元素相融，構建“思政+文化+藝術+科技”融合創新的設計教學理念。采用學生自評、互評、競評以及師評結合的多維度考評方式，采用線上、線下等多種教學方法，實現基于ADDPS模型的混合式教學模式，如圖1所示。

本文以ADDPS模型在“UI交互設計”課程中的應用為例，圍繞教學大綱，確定知識點，通過分析（analysis）知識點，設計（design）課程內容，開發（development）學生思維，在參與式學習環節（participatory learning）挖掘課程社會性元素，調動學生興趣，使之融入。通過驅動式案例教學和對應知識點的講解，完成參與式學習環節。通過總結（summary）反思課程內容，檢驗課程學習的效果。最終，課程總評通過多層次多維度的考評方式，鍛煉學生對自我的客觀認知、自主學習、設計創新、溝通協調能力。通過混合式教學設計和教學內容相結合，進行教學模式的新探索，發展出的“ADDPS混合式”教學模型，既提高了學生的學習興趣，也驅動了教師的自我進步。

2. ADDPS模型的教學改革應用

2.1 分析（analysis）知識點，提煉學習內容

教師簡述網站項目全流程，也就是項目整體工作，在此基礎上，介紹設計師工作全流程，幫助學生了解學什么、怎么學，學完后會達到什么樣的效果，使學生清晰教學的每一步規劃。

每一個知識點通過設計分析，使學生明白該知識點的作用或目標，通過何種方式，如何實現。例如，在“Axure RP設計規范”這一章中，教師需要介紹Axure基本操作——元件交互編輯這一功能，可以通過常用的程序如QQ或微信，向學生展示小程序的交互行為如何用元件交互編輯這一功能來實現。在此過程中，引導學生客觀看待和正確理解“交互”概念，通過介紹交互設計思維及工具，明白交互的實用功能和存在意義，以此激發學生的學習動機。

此階段嵌套“ADDPS專題式”案例訓練，根據要求找出研究對象及需求（分析）、設計方案（設計）、重塑問題（發展）、完成課堂主體環節（參與式學習）、評估結果（總結），在此過程中，教師可以參與學生在小專題實例階段的自測。

隨著每堂課知識點的開啟，教師明確專題范圍，學生分組成隊，由小組自行擬定專題方向；進行目標人群分析和功能需求分析，形成項目方案和項目設計風格定位；根據任務分配文檔，劃定責任人，確定時間節點；進入實施階段；最后進行評估和總結。

2.2 設計（design）課程內容，研究怎么學

項目驅動式教學為專題學習小組提供相應的設計流程訓練。依托專題項目，以設計思維和設計流程訓練為主要目的，依據UI設計的流程，引導學生完成相關任務。學生通過角色定位，完成和配合角色間的連接，逐步累積設計項目的實戰經驗，培養設計思維和設計實踐能力以及團隊合作能力。以專題訓練設計求職網站為例，在教學設計上，教師首先要讓學生明白項目的整體工作內容，明確有哪些是需要設計師參與或者完成的部分。明確了設計師工作流程后，學生開始具體實施工作。學生可以使用任何方式來完成各項任務，如負責前期調研的學生可以采用線上或線下調研的方式，教師可以對調研策略、研究方法和工具使用等情況給予指導；對于負責架構設計和原型設計的學生，他們需要明白自己的任務，通過自己的定位角色去完成相應的任務，再與前一個流程的同學進行工作配合，使項目能夠完整有序地進行。在這個過程中，教師可以講授學生所需要的一些技能，也可以通過學生匯報總結的方式帶領學生進入情境。

2.3 開發（development）學生思維

在此階段，需要學生具備宏觀掌控能力和思維能力，將前期的工作成果轉化為實體。“學而不思則罔，思而不學則殆”，只有處理好正確的學思關系，才有利于培養學生的創造性思維。教師一方面講解該階段的理論知識點，另一方面也需要從其他角度來激發學生的思維活力[6]。

在具體的專題訓練中，可以以問題引導學生來檢驗他們的設計思想和內容，也可以從不同角度或扮演不同的角色來拓展學生的認知和思維，如用戶、甲方、開發者、程序員的角色等。教師引導學生從多角度、多層面思考問題，鼓勵他們主動提問、探索和發現問題，運用工具梳理問題、展開思維，結合跨學科知識，以此培養學生的綜合思維能力，拓展思維的廣度和深度。

各學習小組自擬主題，在一些具體細節和處理方式上會有所不同，針對不同的項目情境，需要延伸不同方向和拓展內容，通過教師的引導和方法介紹、角色代入等方式，尋求問題解決方案，進而確保項目研究的方向按專題計劃執行[7]。

2.4 參與式學習（participatory learning），結合需求的交叉學科及工具運用

對于實施制作階段，UI設計師應該緊緊圍繞“功能”進行原型設計和界面制作，再精致的界面如果脫離了“功能”，就是華而不實，既違背了教學目標，也會使項目處于“難產”狀態，更談不上給予用戶使用時的愉悅感。

該階段需要學生通過角色定位滲入互聯網的工作崗位職能。在此過程中，既要體現學生的技能水平，又需要學生具備足夠的交叉學科的綜合知識能力。只有技術和創新的相互結合才能使設計回歸到真實功能需求，從視覺角度、交互角度和用戶滿意三個角度給予學生相應的訓練，讓學生明白作為前端設計師能夠獨立地完成項目的構思導圖，實現線框圖，設計出視覺稿，寫出前端代碼，完成動效（JS/jQuery等），獨立完成設計和設計相關的部分。因此懂交互、懂產品、懂點代碼是一個UI設計師必備的知識技能，也是確保課題順利進行的基本保障[8-9]。

2.5 總結（summary）課程過程，促進課程學習效果的提升

總結每一個知識點及作業練習，通過學生自評、互評、反思及教師講評等方式及時關注學生的學習動態，一方面可以提高學生的思維能力，另一方面教師也能實時檢測和反饋教學狀態，做到邊教邊學、邊學邊教。通過多種教學方式，定向特定的教學內容，多層次多角度評估學習效果，提升學生的思維能力，適應復雜多變的社會環境，實現學生的差異化成長需求，既提高了學生的學習能力和自我肯定，也鞭策了教師的內驅力。

3. 教學效果分析

ADDPS教學模型在經過四輪的教學實施中逐步走向完善。在參與式學習中采用線上線下相結合的方式，學生以興趣和個人目標為依據組建專題小組，通過平時練習、小組專題作業，在每個崗位職能環節通過學生自評總結、競評互評模式，提高學生的參與度和合作能力。

從2019年到2023年每個學年的第2學期開設此課，這四個學期的學生成績統計情況如表1所示，各分數段成績比例分析如圖2所示，從中可以看出學生成績呈正態分布，學生平均分呈逐漸向上趨勢，良好成績比率增長較為明顯，教學效果有較明顯反映。

在實際的教學探索過程中，ADDPS模型充分結合課程自身特點以及實際工作崗位角色的定位，對標前端課程，充分挖掘學生的興趣與特點，將課程思維元素融入課堂案例、作業項目中。一方面，多維度的考核方式，在實現學生個人成長和目標的同時，激發了學生思維的廣度和深度，培養學生的創造力；另一方面，也能及時了解學生的反饋，提高學生滿意度。通過線上發布問卷調查、組織學生進行自評和互評的方式，從不同角度收集對課程設計的反饋，包括對課程內容的設計、授課的方式方法、多層次性的考核評價方式等方面，在開展課程的同時，充分收集學生的意見，適時調整，拓展學生創造性思維，提高學生對課程設計的滿意度。

結語

“UI交互設計”課程以培養學生設計思想、交互思維、創新思想，使學生具備UI設計方案的能力，掌握設計方案質量分析和控制能力為教學目標。該課程是一門實用性強的交叉性綜合學科，與“新工科”建設理念相一致。在應用型高校教學改革的當下，在教學過程中使用ADDPS教學模型，與時俱進的教學內容和跨學科的綜合知識體系將支持課程建設和專業培養，建成教師、學生、市場為一體、可共享的課程教案。針對“新工科”建設要求，以提高網頁設計人才的設計能力、創新能力和專業能力為原則，企業導師參與人才培養實施環節，實戰項目融合到教學過程，學生參與項目開發實訓，產教融合，加快培養綜合型科技人才，實現從學科導向轉向產業需求導向、從專業分割轉向跨界交叉融合，理論學習與實踐應用互為一體的學習模式。

參考文獻：

[1]馬陸亭.新工科、新醫科、新農科、新文科——從教育理念到范式變革[J].中國高等教育，2022（12）：9-11.

[2]黃啟駿.UI設計的交互性與界面視覺設計研究[J].數字通信世界，2022（9）：56-58.

[3]李莉，李華.BOPPPS教學模型在UI交互設計中的應用研究[J].福建電腦，2022，38（1）：36-39.

[4]羊力超.“UI設計”課程中交互思維的分析與探究[J].無線互聯科技，2021，18（7）： 146-147.

[5]朱世敏，盛娟，王巖，等.基于移動學習的BOPPPS對分課堂教學研究與實踐——以“C語言程序設計”課程為例[J].工業和信息化教育，2021（1）：67-71.

[6]林婷婷.建構“ADDIE專題式”教學模型的實踐應用——以交互設計方法教學改革為例[J].中國現代教育報，2020（23）：101-104.

[7]陳心雨.UI設計課程中交互思維的分析與探究[J].設計，2020，33（3）：76-77.

[8]梁丹丹.視覺傳達設計在移動UI界面中的運用[J].計算機產品與流通，2020（8）：248，255.

[9]賈爾斯·科爾伯恩（英）.簡約至上：交互式設計四策略[M].北京：人民郵電出版社，2011.

作者簡介：李莉，碩士研究生，高級工程師，研究方向：數字媒體技術、圖像處理；陳樹菁，本科在讀，研究方向：數字媒體技術。

課題項目：教育部產學合作協同育人項目——新工科背景下“UI設計”課程體系建設和教學內容改革研究（編號：230802279031815）。