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）。