OBE 理念下混合式教学模式在UI 交互设计课程中的应用探索

李莉 卢静

摘要：混合式教学已逐渐成为主流教学模式，多种新型教学模型在高等教育中被应用实践。课题组结合UI交互设计课程特点，重点研究BOPPPS和ADDIE教学模型，结合OBE成果导向教育理念，将两种教学模型分别融入UI交互设计课程的理论教学的课前、课中和课后及实践教学的渐入、展开和深化三个阶段的混合式教学环节。既拓宽了学生面对复杂工程问题时的交互逻辑思维能力，促进学生个性化学习的同时，又满足新工科应用型人才的培养目标。

关键词：OBE；三段式混合教学模式；BOPPPS教学模型；ADDIE教学模型；成果导向

中图分类号： TP391 文献标识码：A

文章编号：1009-3044（2024）05-0144-04

0 引言

2013年6月，我国被接纳为“华盛顿协议”签约成员，用成果导向教育理念引导工程教育改革，成果导向教育（Outcome-based Education，OBE） 是指教学设计和教学实施的目标是学生通过教育过程最后取得的学习成果（Learning Outcomes） [1]，OBE理念坚持以学生为中心，产出为导向并持续改进，强调师生的预期学习成果及达成度评价[2]。在“互联网+”背景下，多媒体技术及移动互联设备的普及，传统单一线下教学过程受时间和空间的诸多限制，多平台、多方位、立体化的线上线下结合的混合式教学模式已逐渐取代传统教学模式。同时，“新工科”和OBE理念下，对高等教育提出了新的更高要求，多种新型混合教学模式在高等教育中被应用实践。

UI交互设计是近年发展兴起的与多领域交叉的一门新兴学科[3]，以培养学生交互设计的思维逻辑、交互设计技巧、为学生进行开发设计提供创意思维、提升学生视觉审美为基本目标。目前国内高校UI交互设计课程开设院校数量不多，教学经验、资料等相对缺乏[4]。为适应“新工科”对高校人才培养的要求和以成果为导向的OBE理念，UI交互设计课程在2022年教学大纲修订中由原来的48学时，修订为32学时的UI交互设计和20学时的UI交互设计实践，在教学过程中，以“新工科”和OBE理念为导向，不断探索适合该课程的教学方法，将BOPPPS模型融入理论课程的课前、课中和课后混合式教学环节[5]，将ADDIE模型的分析、设计、开发、实施和评价五个步骤融入UI交互设计实践课程的渐入、展开和深化三个阶段的混合式教学过程，充分挖掘思政元素，融入课程，不断拓宽学生交互逻辑思维和计算思维，提升学生分析问题、解决问题的能力，更好地为各行业赋能。

1 课程目标与毕业要求的支撑关系

UI交互设计课程的专业毕业要求对应工程知识（指标点1-4） 和设计/开发解决方案（3-1） ，课程目标细分为德育目标和3个课程目标。课程目标与毕业要求的支撑关系如图1所示，其中德育目标以培养大国工匠精神、树立职业理想和职业道德，培养规范思维意识、创新思维、不畏险阻和坚韧意志等。课程目标1，了解UI交互设计的基本概念和UI交互设计常用规范，了解页面常用图标、组件的特点和应用场景，在原型页面设计中选取并应用合适的图标和组件；课程目标2，明确交互设计流程，应用交互思维模式，分析产品定位与背景；课程目标3，掌握主流原型交互工具软件的应用，应用交互设计的思路和常用交互的实现方法和技巧。课程目标1支撑指标点1-4，课程目标2和课程目标3支撑指标点3-1。

2 理论教学中的三段式混合教学设计

2.1 BOPPPS 模型

BOPPPS是近几年混合式教学中常见的以教学目标为导向、以学生为中心的教学模式，包含导言（Bridge-in） 、目标（Outcome） 、前测（Pre-test） 、参与式学习（Participation） 、后测（Post-test） 和总结（Summary） 六个环节的教学设计方法[6]。BOPPPS目标是激发学生的学习兴趣，提高学生自主学习、独立思考、分析解决问题的能力，培养学生创新意识和灵活应用知识解决专业领域问题的能力，提高学生综合素质。

2.2 融合BOPPPS 的三段式混合教学设计

UI交互设计理论课程的课前、课中和课后三段式混合教学设计中融入BOPPPS模型，如圖2所示。

课前阶段，通过线上发布学习任务，导入（Bridgein）课程内容，明确培养目标（Learning Objective） ，设计好课前测验（Pre-Test） 或讨论，掌握学生预习情况和学生兴趣点；课中（Participatory Learning） 阶段，挖掘学生的兴趣和课程思政元素，将其融入课堂案例或者作业中，通过兴趣App小组对应任务点实操和案例驱动式教学，实现课堂主体环节（Participatory Learning） ；课后阶段，通过课后测验（Post-Assessment） 和总结（Sum?mary） 反思课程内容，促进课程学习效果的提升[5]。

2.3 目标考核方法

课程成绩由平时考核和期末考核构成，根据“新工科”对高校人才培养的要求和OBE理念的产出导向需求，22版大纲修订了两项的成绩占比，由原来的平时考核30%和期末考核70%修订为平时考核40%和期末考核60%，并且平时考核由原来的3项改为作业、实验、测试和课堂活动。其中，各考核方式与课程目标中的支撑权重关系如表1所示。同时在评价环节采用自评、互评与师评相结合的多维度考评方式，锻炼学生认知自我、评价自我、相互学习的能力。

2.4 目标考核方法

课程成绩由平时考核和期末考核构成，根据“新工科”对高校人才培养的要求和OBE理念的产出导向需求，22版大纲修订了两项的成绩占比，由原来的平时考核30%和期末考核70%修订为平时考核40%和期末考核60%，并且平时考核由原来的3项改为作业、实操、测试和课堂活动。其中，各考核方式与课程目标中的支撑权重关系如表1所示。同时在评价环节加入自评和互评方式，锻炼学生认知自我、评价自我、相互学习的能力。

2.5 目标达成度分析

根据图3课程目标达成情况分析，课程目标1达成度偏低，课程目标3达成度最高，分析原因为课程目标1考察UI交互设计的基本概念常用规范以及在应用中选择合适的组件等能力，在授课过程中偏重理论和规范，学生不够重视，在面对考核中需要从实际应用角度解决问题以及进行综合类题目设计时，就显得力不从心，容易丢分的原因，也是考核结果反馈中该目标达成度不够理想的主要原因。

3 实践教学中的三段式混合教学设计

3.1 ADDIE 模型

美国的Walter Dick和Lou Carey两位学者提出的ADDIE模型由5个部分组成，即分析（Analysis） 、 设 计（Design） 、 开 发（Development） 、 实 施（Implementation） 与评价（Evaluation） ，这五个阶段之间联系紧密且可以随时互通的特性[7]。

3.2 融合ADDIE 的三段式混合教学设计

UI交互设计实践是以完成某个App原型项目为总体要求，结合ADDIE模型，尝试采用渐入、展开和深化三个阶段的混合式教学设计，如图4所示。

渐入阶段，通过课前发布线上问卷，课题组分析学生感兴趣App类型和学生交互知识储备情况，结合课程目标，分析实践课程任务与要求；课题组根据分析结果，设计实践项目题目范围，设计实践项目任务、要求、指导书和评价标准；展开阶段，教师发布任务并引导学生，学生进行项目选择，组建项目小组并小组分工，进行项目可行性及需求分析，确定用户定位及用户具体需求，完成场景分析，确定产品架构；深化阶段，小组成员根据分工，完成项目原型布局与设计，进行交互逻辑分析，完成交互效果实现，书写项目报告，教师须根据学生完成情况进行适时反馈，挑选优秀作业分享，调动学生积极性，挖掘学生潜力，激发创造性。每个阶段都有指导老师通过现场辅导、调研、线上问卷等方式进行过程性评价。

3.3 目标考核方法

实践课程考核由过程表现、过程材料考核、实践能力考核3部分构成，占比分别为20%、30%和50%，各考核方式与课程目标中的支撑权重关系如表2所示。其中，过程表现主要考核出勤、参与情况和回答问题三方面，过程材料主要考核实践项目报告的格式、架构和内容三个方面，实践能力主要考核架构布局、交互逻辑、交互效果设计及实现三个方面。教师根据课程目标及要求，制定评价标准，其中自评和互评借助学习通平台完成。

3.4 目标达成度分析

UI交互设计实践课程是在理论课程之后进行的专周实践，通过理论课程对交互理论、交互原则、交互逻辑及常用项目分析等的进一步学习领会，在实践课中的表现有明显提高，如图5所示，课程目标达成度均有提高，同时，各课程目标达成度收敛情况明显，说明学生整体情况都不错，虽然达成度和均值都有明显提高，但特别优秀率的作品不多，说明学生对知识外延拓展及创新性还有待进一步提高。

4 思政元素融入

“新工科”和OBE理念要求课程思政建设应立足新时代，充分挖掘课程所蕴含的思政教育元素，以培养德智体美劳全面发展的人为价值旨归，以构建知识体系教育与思想政治教育有机融合的发展路径为实践归宿[8]。“学习强国”App提供的海量丰富知识信息内容为高校思想政治理论课教学创新优化提供了新平台、新契机[9]，常老师从5个角度，探究“学习强国”App在高校思政教育领域的创新[10]。

UI交互设计课程在教学设计环节中充分挖掘思政元素，将思政元素融入知识点的案例教学中，鼓励学生下载“学习强国”App，引导并带领学生分析其板块划分、页面布局、功能设置、交互逻辑设计等，将课堂知识点和交互逻辑融入强国App分析中，将常用交互设计方法融入强国App学习应用中。比如在设计动态面板知识点讲授的课程环节时，通过“学习强国”的学习推荐页面，实现Banner区轮播交互效果的讲授，在设计常用函数实现页面左右滑动的交互讲授课程环节时，通过“学习强国”的浏览新闻详情页面，实现页面上下滑动和左右滑动交互效果的讲授。将课程思政融入UI交互设计课程教与学环节中，学生既能完成交互知识的学习，又可以了解“ 学习强国”App中的新闻或知识，完成高校思政课程育人“润物无声”的效果。

5 结束语

文章分析了在“新工科”以产出为导向的OBE理念下，根据专业培养目标，修改课程目标，结合混合式课程的特点，课程组在理论课程中结合BOPPPS模型，实施课前、课中和课后三段式的教学过程，在实践课程中结合ADDIE模型，实施渐入、展开和深化三个阶段的混合式教学设计过程。同时，分析了UI交互设计的理論和实践课程的考核方式与课程目标中的支撑关系，通过学生成绩分析了目标达成度情况，研究并探索了完整的三段式混合教学模式在以产出为导向的UI交互设计课程中的应用情况，取得了不错的达成效果，为以后的教学研究提供了依据与支撑。

参考文献：

[1] 常志英，崔维淼.国内成果导向教育研究主题及脉络演进[J].河北大学学报（哲学社会科学版），2019，44（5）：59-67.

[2] 王金旭，朱正伟，李茂国.成果导向：从认证理念到教学模式[J].中国大学教学，2017（6）：77-82.

[3] 董尚昊.步步为赢：交互设计全流程解析[M].北京：人民邮电出版社，2020.

[4] 刘莹，林蕙玟.基于CBE教学模式的“交互设计原理” 课程模块化改革与实践[J].教育观察，2020，9（9）：45-48，101.

[5] 李莉，李华.BOPPPS教学模型在UI交互设计中的应用研究[J].福建电脑，2022，38（1）：36-39.

[6] 刘新燕，王璐，姜璇，等.BOPPPS教学模式在混合式一流课程建设中的应用探究[J].财经高教研究，2022，8（2）：97-111.

[7] 杨秋玲，黄高雨.基于ADDIE模型下高校专创融合课程教学及考评方法的改革探究[J].四川旅游学院学报，2020（5）：1-5.

[8] 黄泽文“. 新工科” 课程思政的时代蕴涵与发展路径[J].西南大学学报（社会科学版），2021，47（3）：162-168.

[9] 叶婷.基于“学习强国” App的高校思政课教学创新[J].学校党建与思想教育，2019（14）：43-45.

[10] 常彦传.以5W理论探究学习强国App在高校思政教育中的应用[J].新闻研究导刊，2020，11（18）：51-52.

【通联编辑：王 力】