图形用户界面设计课程教学探讨

摘要：近几年高校纷纷开设的图形用户界面设计课程仍处于摸索阶段，本文将试图理清该课程的设计思路，并对教学过程和考核形式进行探讨。

关键词：图形用户界面设计;课程设计

随着用户对移动设备界面使用体验需求的日益增强，人们不再仅仅关注设备或APP产品的功能性。如今清晰美观易操作的可交互界面已成为设备界面或APP界面的最基本要求，故而近几年越来越多高校开设了相关课程。

但这类课程仍处于摸索阶段，国家对于该课程缺少统一规范和完整体系。教师若用平面构成、版式设计理论去支撑教学，学生很难做出符合市场审美的界面。因设计载体较传统纸媒发生了变化，除了考虑艺术性，更要注重艺术性如何为功能性服务，这就牵扯到界面设计规范、控件位置、字号等细节。下面对该课程设计思路、教学过程和考核形式进行探讨。

一、 课程设计思路

据毕业生工作情况了解，从事相关岗位的毕业生普遍存在设计与实际应用的割裂。针对“年轻设计师美工化”、设计“重皮肤轻骨骼”问题①，课程的设计就必须使学生把设计知识应用到虚拟的实际项目中，从而更多去思考设计在项目中的实际应用和用户体验问题，加深对功能性、易用性的理解，而不仅仅把界面当作独立的设计作品去追求美观性、艺术性。

例如让学生去构思某类APP，思考这类APP的实际应用场景和目标用户及需求，再确定整体架构;架构有了，认清了需求和功能如何在界面体现，再去设计界面。按此思路，就能更好地避免做出好看而不中用的绣花枕头。相比让学生直接去设计美观的界面，此方式可根本解决重皮肤轻骨骼问题。

假设课程共60课时，课程设计可分五阶段，各12课时，前两阶段侧重基本概念，后三阶段侧重应用练习，逐步加深难度。

二、教学过程

阶段一：扁平化设计

首先让学生了解最流行的扁平化设计特征，拟物化扁平化的对比和各自优缺点，并掌握扁平化设计技巧，例如去掉多余高光纹理修饰效果，选择简洁清爽的字体，注重背景整体感等。了解风格掌握技巧后，可以带学生设计几个图标，包括APP图标和APP内的功能性图标，让学生先以小见大，理解扁平化用户界面视觉思维，理清扁平化图标设计思路。

阶段二：手机系统界面设计

此阶段学生须了解iOS系统和部分Android系统手机界面尺寸和设计规范的概念，了解用户界面并不是根据设计师喜好天马行空地设计，而是一切要根据规范。如状态栏高度、各图标尺寸、导航栏和菜单栏高度。根据规范，再讲授扁平化界面设计原则，可通过保证界面清晰、展现深度层次、布局、字体与色彩等方面讲授。最后根据这些理论让学生实操，内容可选用手机系统界面中最简单、内容少的锁屏待机界面，学生只需展现顶端状态栏、时间日期、底部小功能图标，再配以美观简洁的背景图片即可。通过设计最基本的系统界面，让学生对整个图形用户界面，包括规范和设计原则，有更具专业性的理解。

阶段三：天气APP界面设计

设定具体类别，是为了让学生考虑实际应用场景从而更重视界面易用性。天气界面属于信息量较少、较简单、易上手的。教师首先讲解天气类界面设计思维，包括该类界面有哪些必要元素、确定元素后如何安排它们在界面上的位置、天气的色彩象征对易用性的影响等。之后可进行案例分析，选用市面上已存在的多个天气类APP，逐一分析它们的优缺点。此阶段要求学生完成3-5个主要界面的设计制作。

阶段四：音乐APP界面设计

授课思路借鉴上一阶段，重点关注不同应用场景，如运动模式、深夜模式。案例可参考虾米、网易云音乐APP。

阶段五：平板点餐界面设计

与前几阶段不同，重点为在新形式平板布局下设计美观易用的餐厅点餐界面。案例可参考海底捞点餐界面。

三、考核形式

该课程参与学校统考并不适用，因为注重制作的成果，无法在考试的短时间完成，建议分阶段考核。除了每阶段完成相应成果，也不能忽略最后作品的展示，因学生今后从事的岗位特点决定了需具备团队合作能力和展示沟通作品能力。可在全班展示自己的界面，清晰说明设计思路、产品功能亮点，以及如何通过视觉手段去实现。展示环节也建议纳入考核的一部分。

四、 结语和反思

当然，实际教学成果如何，除了学的一方认真学习实践，作为教的一方也需反思诸多问题。学校实践教学资源有限，一些学校虽已开始校企合作协同育人，但“在校企合作中更多是流于形式，并没有形成完善的育人体系”;另外教师虽有理论基础但普遍缺乏企业实践。作为新时代新课程，学校和教师如何向社会输送应用型人才，需继续探索。

参考文献：

[1]向桦. 以项目设计流程为导向的APP界面视觉设计教学改

革初探. 艺术与设计，2019（9）：135-137.

[2]郑璇. “UI设计”课程教学内容和课程体系改革研究.科教

文汇，2019（10）：96-97.

作者简介：王婧然，硕士，任职北京信息职业技术学院，教学方向为数字媒体艺术设计。