陆培培 牟炼

【摘 要】本文针对UI界面设计课程传统教学中存在的教学方式落后、教学时间有限、授课知识不够全面、教材缺乏实用性、相关教学资源缺乏等问题，分析线上线下混合教学模式的优势，并从课前学生自主学习、课中项目实训、课后教学考核评价等环节论述UI界面交互设计课程线上线下混合教学模式的实施过程。

【关键词】互联网+ 线上线下 混合教学模式UI界面交互设计

【中图分类号】G  【文献标识码】A

【文章编号】0450-9889（2021）07-0053-03

在“互联网+”背景下，各种教育平台如雨后春笋般涌现出来，在国内教育界掀起了一场在线学习的热潮。各大高校纷纷推出在线开放课程，从而催生了基于慕课、微课、超星学习通等平台的各种混合教学模式。混合教学模式并不是简单的技术混合，而是为学生创造一种真正高度参与的、个性化的学习体验，其关键是通过对课程的再设计为学生创设积极的、协作学习体验，从而帮助学生通过主动地参与学习积极构建自身知识体系。本文拟以笔者所任教的数字媒体艺术专业的UI界面交互设计课程为例，探讨依托超星学习通平台的线上线下混合教学模式，为构建互联网云课堂与线下课程相结合的混合教学模式提供借鉴。

一、UI界面交互设计课程教学现状

许多高校开设了UI界面设计课程，但该课程传统教学中存在较多的问题。

第一，教学方式落后，不利于促进学生主动学习。如许多高校该课程的教学还是以传统的灌输式授课方式进行，教师与学生缺乏交流，难以促进学生主动学习。《淮南子·说林训》有言：“授人以鱼不如授人以渔。”其教育理念即是传授给人既有知识，不如传授给人学习知识的方法。学生若要提高专业能力，单凭课堂上学习的知识是远远不够的，还要掌握自主学习的方法，传统的教学方式无疑不能满足学生的自主学习需求。

第二，教学时间有限，授课知识不够全面。由于学生需要学习的课程种类较多，如学生每周需要上两门或者两门以上的专业课程，因此该课程教学时间有限。由于教学时间有限，一方面学生难以完全理解和吸收所学知识;另一方面教师难以传授较为全面的知识，只能侧重于传授某些方面的知识，如某些教师授课内容注重界面图标设计、视觉设计，而忽视了界面交互设计。

第三，教材缺乏实用性，相关教学资源缺乏。一方面，当前国内UI界面交互设计课程的教材并不像平面设计类教材那么丰富，现有的教材内容设置多流于表层的编写，仅适用于初级阶段的学习，缺乏一套实用的“理论+实际项目制作”的教材。另一方面，许多授课教师因为本身对相关行业不够熟悉，缺少实践经历和经验，其授课内容往往较为单一，更无法提供丰富的相关教学资源以供学生进一步学习。

二、UI界面交互设计课程线上线下混合教学模式的实施过程

相比传统教学方式，线上线下混合教学模式具有如下优势：一是不受时间、空间限制，能让学生自由利用空闲时间进行学习，培养学生自主学习的能力;二是注重教学资源的开发，而优质的教学资源有助于提高学生的专业能力;三是有助于增强师生互动，提高学生对学习的兴趣;四是有助于提升教师的教学能力，培养教师掌握多种授课方法。

笔者以数字媒体艺术专业的学生为研究对象，结合超星学习通、中国慕课平台开展UI界面交互设计课程线上线下混合教学模式实践。该课程共64个课时，其中线上教学30个课时，线下教学34个课时（见图1）。线上教学又分为基础理论与案例操作两大部分，主要是让学生全面掌握UI界面交互设计课程的基础知识、视觉设计及Axure RP技能;线下教学以项目实战操作为主，主要是让学生通过探讨设计一套完整的产品界面并进行汇报。教学过程包括课前、课中、课后三个环节。

（一）课前：学生自主学习

课前，教师根据教学内容安排，预先录制线上教学视频，并将教学视频、课件、参考资料、课后讨论等内容上传到超星学习通平台上。在开课时，通过QQ群提醒学生在规定的时间内线上观看教学视频及完成相关作业任务。在观看视频时，学生可自主选择和规划学习的时间，只要在规定時间内完成任务都属于达标，对不按要求完成任务者，将进行相应的扣分。教师则通过超星学习通的后台，时刻关注学生的学习进度，掌握学生的学习情况，方便在线下教学中因材施教，提高每一名学生的专业能力。

线上教学内容以理论基础知识为主，共安排5个章节的内容，录制了14个视频，主要讲解界面设计概述、用户需求、交互设计、视觉设计、优秀界面鉴赏等方面内容，其中交互设计与视觉设计分别是理论知识的重点与难点部分。

线上教学的第二部分为实例操作练习内容，共分为7个模块，其中实训4为实例操作的重点部分，主要讲解Axure RP的动态面板的作用，并结合交互属性为界面添加交互效果，如鼠标单击时、拖动时、载入时等的交互样式。实训5和实训6为难点部分，这两个部分主要通过案例讲解Axure RP的中继器与全局变量的使用，比如利用中继器制作分类商品、运用变量制作为商品点赞等内容，以方便学生在线下课程中能够熟练运用Axure RP进行App产品的高保真原型交互设计。

通常来说，人的注意力时间有限，因此，用于线上教学的视频内容最好控制在20分钟以内，这就需要教师在授课之前规划好每一个教学视频内容，不仅要精简而且要有实际意义。

（二）课中：项目实训

课堂教学主要分两个阶段进行：第一阶段，以探讨与实例操作为主;第二阶段，以项目实战训练为主。

在第一阶段的教学中，首先，教师抽取小部分时间让学生汇报、探讨、总结课前线上的学习情况，并对学生汇报情况给予点评。这样，教师不仅可以深入地了解学生对基础知识点的掌握程度，而且方便与学生进行即时沟通，解决学生的疑问。其次，让学生完成课堂实例操作练习，通过课堂实例的训练让每一名学生熟练掌握专业技能。由于学生在上课前已观看视频教学并做课前预习，在课堂中进行实例操作训练时如有不清楚的地方，可在课堂中进行深入的探讨。

在第二阶段教学中，主要采用小组合作的形式完成项目实战训练。小组合作不仅可以发挥团队合作精神，而且可以激发学生的创意灵感。学生首先根据一些设计竞赛或者企业的设计项目进行选题;其次以小组的形式进行市场考察，并对竞品及用户进行分析，制作出App的故事板;最后进行分享、阐述、讨论。小组合作人数控制在3～4人，并设立一位负责人来督促整个项目的分工等情况。在此项目中，小组成员根据各自所擅长的方面分别扮演不同的角色，如组长负责竞品分析、信息架构、产品展示及讲解等，成员一负责市场调研、界面交互设计，成员二负责界面视觉设计。每个小组都要在规定的时间内完成相应的任务。在项目制作过程中，教师要进行定时的检查，了解小组成员所完成的情况，并对学生提出的相关问题及疑问进行有针对性的回答和指导，在提高学生问题分析能力的同时，增强师生之间的沟通与交流，活跃课堂教学氛围。

（三）课后：教学考核评价

课后，即课程的最后阶段，主要进行教学考核评价。学生首先要完善项目细节的制作，并将制作的作品上传到网上，进行小组互评、测试;其次汇报项目，并由教师对本课程教学进行考核、总结。学生通过完善项目作品，对本课程所设计的内容进行整理，在展板上展示所设计的内容编排，并上传到学习通平台上，然后按学校要求将作业刻入光盘上交学校留底存放，方便给下一届学生学习借鉴。教师从所收集的作业中遴选出一些优秀的设计作品参加设计竞赛，在检验学生专业水平与教师教学水平的同时，帮助学生积累实践经验。

对本课程教学的考核评价采取线上与线下考核评价相结合的形式。线上考核评价由平时成绩、实践成绩、期末成绩三大部分组成。其中，平时成绩包括观看线上教学视频情况、考勤情况、课堂表现等方面，而实践成绩为课堂实例项目练习的作业情况，此两项成绩各占总评的25%;线上提交的期末实战项目设计作品与线下对项目的汇报情况，此两项成绩共占总评的50%。小组成员在陈述所设计的作品时，需就如下内容进行汇报：一是该项目的分工情况、产品的概述及调研的情况;二是该产品的创意构思;三是该项目的优点以及不足之处;四是是否有解决不足之处的预案;五是团队的自我评价及学习效果情况。同时，授课教师对该课程教学进行总结，并收集学生对本课程教学的匿名评价及意见，以完善下一次教学内容，提升教学质量。

为了提高UI界面交互设计课程的教学质量，笔者已经在超星学习通平台上初步搭建线上教学模块，并结合线下课堂进行教学尝试。从这次教学经验来看，线上线下混合教学模式得到了学生的良好反响，但真正要上好这门课，还需要不断总结经验、继续完善。互联网平台只是一种信息化教学手段，教师要真正提高教学能力，还须利用互联网构建优质的教学内容，且线上与线下的教学不能相脱节;无论是线上还是线下的教学，都要结合市场需求进行精心的设计，并规划好该教学内容的安排，调动学生学习的积极性，让学生从被动学习转为主动学习，提高学生的专业实践能力与创新思维能力，培养符合社会需要的应用型人才。

【参考文献】

[1]孙佳佳，高立伟，马博文，等.“互联网+”背景下基于雨课堂的混合式教学模式改革[J].计算机时代，2020（9）.

[2]陈晓刚，王苏宇.“互联网+”背景下景观设计课程TMCS混合教学实践探析[J]. 裝饰，2019（8）.

[3]魏丹，刘蓟南.基于雨课堂智慧工具的混合式教学模式构建[A].第十六届沈阳科学学术年会论文集（经管社科）[C].沈阳：沈阳市科学技术协会，2019.

[4]陈希赟.《移动终端界面设计》课程线上线下混合式教学的探索与实践[J].科技视界，2019（29）.

注：2020年度广西高等教育本科教学改革工程立项项目“应用型本科设计类课程SPOC+任务驱动教学模式建设与改革”（2020JGA374）;广西民族大学相思湖学院2020年度思想政治理论与实践研究课题“互联网视阈下桂北红色文化融入界面交互设计教学的路径研究”（2020SZKY07）

【作者简介】陆培培（1984— ），女，汉族，广西桂林人，硕士，广西民族大学相思湖学院讲师，研究方向为数字媒体设计、视觉传达设计;牟 炼（1987— ），女，汉族，广西宾阳人，硕士，广西大学行健文理学院副教授，研究方向为视觉传达设计。

（责编 苏 洋）