基于OBE理念的UI设计课程教学创新设计

何惠倩 孙炜 何媛 董业子

［摘 要］为推动基于OBE理念的课堂教学实践，适应新艺科建设对设计艺术学本科生提出的能力培养新要求，项目组以教学成果为导向，探讨了联合线上资源和线下授课的混合式教学模式改革，从教学对象、教学目标、教学策略等方面探究UI设计课程知识体系的整合与构建，设计了教赛融合、产教融合的项目式课堂教学内容，构建了动态评价考核体系。该教学模式使学生能独立完成UI整体项目设计，有效提高了学生的设计能力、逻辑思维能力及课程目标的达成度。

［关键词］成果导向教育；混合式教学；UI设计；动态评价考核；新艺科

［中图分类号］ G642.0 ［文献标识码］ A ［文章编号］ 2095-3437（2023）09-0062-05

基于成果导向的OBE（Outcome?based Education）教育理念是由斯派狄等人提出的，强调制订可观测、可达成、可教、可学的课程目标，依据教学目标反向牵引教学力量、课程内容和教学设计，聚焦学生能力的培养，并坚信学生通过弹性化、个性化、多元化学习可以取得成功[1-2]。OBE理念应用领域很广泛，例如工程教育、包装设计、程序设计、“精益”教学、课程考核与评价等。杨慧等[3]将OBE理念运用于空间分析与建模课程中，提出教学创新设计过程中需秉承“成果驱动、实践取向、情感融合、知行合一”的教育理念。周威等[4]将OBE理念应用于包装设计课程教学改革中，提出解构课程教学内容、强化设计实践训练、改进课程考核方法的教学实施方案。刘巍巍等[5]基于成果导向从教学模式的精简、教学资源的利用率、课程体系的系统性及学习的达成度4个方面研究了“精益”教学模式。张绍芳[6]将OBE理念应用于创新高校教育管理模式，以完善其评价体系，提质增效。

好的UI设计不仅可以提升产品的美感和个性，还能让用户操作更为便捷，贴合用户的使用习惯[7]。考虑到课程时间的有限性、App应用的广泛性和市场需求的迫切性，项目组以App设计项目为例，结合OBE理念对UI设计课程进行详细剖析。UI设计课程较难掌握和理解的部分包括用户研究、市场研究、用户体验旅程图及功能架构的输出，这些正是对学生的系统思维和逻辑思维的全方位考验。

UI设计课程是设计艺术学专业的核心课程，课程体系复杂，综合性和实践性强，知识涵盖范围广，包括市场调研、竞品分析、用户画像、用户体验旅程图、设计构思、信息架构、交互原型、视觉设计等。课程目标在于使学生掌握UI设计课程专业理论知识，能熟练运用人机工程学原理、认知心理学、交互性原理和设计艺术学原理等理论知识对UI设计进行分析、创新和评估[8]。传统的UI设计课程教学在培养学生设计能力和逻辑思维能力上存在不足。

一、OBE理念在UI设计课程中的应用

（一）教学目标反向设计

传统教学中课程目标的设定通常以教材规定的目标和教学设计大纲为主[3]，重知识轻能力，与当前设计类专业中重实践的理念相悖。OBE理念强调从学生的学习成果和能力达成出发，反向设计教学目标。

UI设计能力分为初级、中级、高级。初级能力是UI设计的基础。首先，学生需要具备信息检索能力，能检索相关文献、探寻优秀UI设计案例及分析市场现状，并对特定的App进行市场调研，洞察市场需求和用户需求，通过数据分析产出设计机会点，这属于初级能力。其次，提出设计概念并进行设计构思和设计实践，具备良好的逻辑分析能力和审美能力以判断设计实践作品的可行性、美观性、可用性等，这属于中级能力。最后，具备设计创意思维能力，这属于高级能力，需要经过长期的积累和实践才能实现能力的达成。

根据能力目标及UI设计课程的特点，项目组将课程的总体目标设定为“能够独立完成App设计”，采用成果导向理念反向设计相应的教学目标，细化课程内容，使学生通过对UI设计课程的学习获取相应的能力，具体如表1所示。

（二）教学方案设计

传统教学过程中，教学方案一般根据学周来规划学生每周需要学习的内容，而基于OBE理念的UI设计课程教学根据内容模块的难易程度合理调整了学习时长。

1.传统UI设计课程存在的问题

传统UI设计课程存在教学内容无法展现最新的交互设计流行趋势，课程教学重视觉、轻逻辑，教师在讲授过程中以软件技能和界面视觉为主，对前期调研、需求挖掘和产品定位等知识不够重视等情况，导致部分学生设计的作品虽美观但不符合用户的使用习惯，出现界面烦琐、交互不顺畅、界面跳转与用户预期不符等问题。此外，部分高校在培养UI设计人才时存在教学模式创新性不足，課程内容简单、挑战度不高，考核方式单一、重结果轻过程等问题[9]。

2.新艺科背景下教学模式的重构

新艺科是指艺术学科与其他学科交叉融合而产生的新的艺科专业[10]。在新艺科背景下，设计艺术学专业要有中国特色、国际视野、新突破。项目组在课堂中融入“四新”教育理念，强化开放思维与复合思维，提高服务意识和美学价值[11]。在课程安排方面，以成果为导向，将学科知识体系进行模块化划分，采取问题驱动式教学设计，提高学生学习目标的达成度[5]。具体措施如下：

（1）教学思路创新设计。UI设计课程中，教师不仅要教授学生手机界面设计知识，还要拓展讲授网页设计、智能终端界面、智能产品等内容，指导学生从图形、色彩、布局和字体等方面展开创意构思，设计出精美且实用的界面。

（2）课程内容模块化设置。UI设计在教学内容模块划分时遵循形式追随功能的原则，在保证界面的可用性、可行性和易用性的基础上，美化界面。在课程中，指导学生进行用户研究，并结合人机工程学和用户的行为习惯，找出设计痛点和设计机会点，再进行功能结构的布局和界面设计。教师布置的作业应环环相扣，瞄准最终设计目标，建立UI设计课程体系。教学内容模块划分如表2所示。

（3）教学模式人性化设计。UI设计课程教学时长与培养方案要求的学时保持一致，共48学时，12周，每周4学时。教师借助线上平台完成对基础知识的讲解和设计工具的教学，根据教学任务筛选与教学内容相关的线上平台资源，并将其发送给学生，线上学习时长通常在30分钟左右。线下采用研讨式和任务驱动式教学，教师根据教学计划梳理课程知识，讲评学生作业和相关案例。

（4）教学评价采用双向考核机制。教学评价采用教师和学生为主的双向考核机制。从知识、能力、素质三个维度进行考核。评价方式与考核内容、课程目标相对应[2]。

（三）具体实施方法

1.确定课程目标

围绕新艺科对设计艺术学专业提出的新要求，项目组将UI设计课程目标分为“知识、能力、素质”，具体设定如下：

（1）知识目标。掌握UI设计原则和设计方法，熟悉常见的界面设计尺寸、大小、颜色等规范。

（2）能力目标。灵活运用用户研究和市场研究专业知识科学挖掘用户需求，善于发现问题，洞察市场趋势。启发学生的设计思维，提升学生解决实际问题的能力。

（3）素质目标。独立思考问题，辩证看待事物。培养学生的创新意识和工匠精神，使学生能独立完成界面设计并不断更迭完善设计作品。

UI设计课程授课形式、实施方式及内容如表3所示。

2.结合任务驱动法，开展教学工作

在课程正式开始前，教师将UI设计基础知识及设计案例发布给学生，启发学生思考，让学生查阅资料，研究案例，参考设计流程，自主确定设计主题，提出设计需要解决的问题及产品需求。结合任务驱动法，将整个项目拆解成多个模块，随着教学的推进，使学生能掌握所有模块的基础知识并运用于设计实践中。根据学生的兴趣、能力不同，采用动态化、弹性化培养模式，每个模块均设定目标完成度和加分项，给予学生更大的发展空间。同时，将辩证思维和创新知识融入课程模块中，培养学生的综合素质，突出课程的高阶性。

3.明确考核层级

传统考核方式是期末成绩和平时成绩分别占70%和30%，学生的每次作业和出勤率都会影响其最终成绩。而OBE理念重点关注学生的最终学习成果，根据学生的整体项目设计所呈现的视觉效果对平时成绩进行了动态调整。学生期末作业评分维度、计分标准及比例分配如表4所示。

二、实践效果及课程评价

通过对两个班106名学生进行教学改革实践，这些学生期末成绩基本达到良好以上，教学效果显著。课程评价结果显示，学生更喜欢新的教学模式。

在OBE的教学模式中，教师给予了基础较为薄弱的学生充分的时间查阅资料，开展查漏补缺，提高了学生的设计思维能力。而基础较好的学生可以根据自己的学习能力和设计水平加快学习进度。这种弹性学习方式有利于因材施教，使不同层次的学生能够在规定的时间内完成学习任务。在学习反思过程中，大部分学生认为需要提高汇报表达能力和逻辑思维能力。

（一）课程产出形式

在UI设计课程中，要求学生每人提交一份App或小程序设计报告书，报告书以学生能力目标和教学模块为导向，包含问卷调查、用户体验旅程图、用户画像、竞品分析、信息架构设计、原型设计、视觉设计、设计规范和可用性测试，展示App或小程序从无到有的设计过程。

（二）课程评价和实践效果

课程评价是一项全面性工程，评价指标体系的建立直接影响到评价结果的科学性。根据课程内容，本文将UI设计课程评价体系分为用户研究、市场研究、交互原型、视觉设计、测试迭代和汇报评价共6个模块，分别设置问题并计算评价结果。

项目组对两个班共90名学生开展了自我检测调查，调查结果如表5所示。

根据问卷结果可知，在用户研究模块，大部分学生能熟练设置调研问卷，精准找到调研对象，挖掘用户需求，进而输出用户画像。在市场研究模块，学生运用用户体验五要素和SWOT分析竞品的能力还需要进一步加强。在交互原型模块，多数学生能较好掌握信息架构图设计和原型图设计，但是可行性测试能力还需要进一步加强。在视觉设计阶段，学生的综合能力，包括色彩、图标、按钮、布局等，还需要进一步提高，视觉设计规范还需要繼续完善。在测试迭代阶段，部分学生对李克特量表和SUS量表的理解不够深刻，并且数据运算存在一定的困难，教师需对这一模块知识进行补充和深入讲解。在汇报评价方面，模拟学生毕业答辩场景，大部分学生能在教师规定的4分钟内完成App或者小程序项目设计汇报，但在汇报过程中存在拟声词过多、紧张、缺少互动和眼神交流等现象，后期需对学生的设计汇报表达技巧进行培训。

总体而言，UI设计课程是一门培养学生综合能力的课程，经过48学时的学习，学生能够输出完整的设计作品，了解UI设计项目流程，掌握用户研究、市场调研、数据分析、项目评估等方法，设计实践能力得到了提高。同时，近一半学生的设计主题属于原创设计，从无到有的设计培养了学生全面发展的能力。UI设计课程的学习和完整作品的输出为学生未来的求职或升学奠定了坚实基础。

三、结语

UI设计课程应以应用实践和社会需求为导向，紧跟设计潮流趋势，鼓励学生自主创新设计主题或改良现有的交互界面，尝试不同的设计风格，提高设计实践能力。基于OBE教育理念，项目组结合艺术设计学专业毕业要求和课程目标，开展了多维度考核，并根据学生的不同层次，给予学生更多的成长和发展空间。通过课程体系的构建，使学生最终获得的能力结构与课程体系相对应。开展成果反向设计，构建科学培养体系，使学生能及时了解市场需求和行业需求。有针对性地培养学生的职业能力，提高教学质量。

［ 参 考 文 献 ］

[1] 肖鹏，葛渊峥，郝雪. OBE+CIPP课堂评估模式探究[J].高等工程教育研究，2021（6）：176-182.

[2] 田腾飞，刘任露.OBE认证理念下师范类专业的课程建设[J].华南师范大学学报（社会科学版），2022（1）：41-52.

[3] 杨慧，闫兆进，慈慧，等.OBE驱动的工程教育课程教学创新设计[J].高等工程教育研究，2022（2）：150-154.

[4] 周威，周颐.包装设计课程教学改革与创新实践[J].包装工程，2021，42（S1）：261-266.

[5] 刘巍巍，丁子健，王海军.成果导向下“精益”教学模式的构建与实践[J].高等工程教育研究，2022（1）：169-174.

[6] 张绍芳.基于OBE理念的高校学生教育管理工作改进研究[J].教育理论与实践，2022，42（9）：19-21.

[7] 吕君可.基于学习通的UI设计课程BOPPPS教学模式应用[J].计算机教育，2021（5）：105-108.

[8] 刘文洁.基于OBE和翻转课堂的人机界面设计课程教学改革[J].计算机教育，2021（6）：171-174.

[9] 《全国普通高校本科教育教学质量报告（2018 年度）》编委会.全国普通高校本科教育教学质量报告：2018 年度[M].北京：高等教育出版社，2019.

[10]陈东生.论新艺科建设背景下艺术技术应用型人才培养[J].东华大学学报（社会科学版），2019，19（3）：287-292.

[11]潘鲁生.关于“新艺科”建设的思考[J].大学与学科，2022，3（1）：48-54.

［责任编辑：苏祎颖］