《用户界面设计》教学大纲

1、用户界面设计（User Interface Design）课程代码：4261043学分：3学时：48（其中：课程教学学时：24，实验学时：24）先修课程：程序设计基础、面向对象程序设计适用专业：计算机科学与技术教材：陈启安，软件人机界面设计，高等教育出版社，2005年4月王赛兰，计算机图形用户界面设计与应用，北京大学出版社，2014年开课学院：计算机与软件学院一、课程性质与课程目标（一）课程性质用户界面设计是高等工科院校计算机类相关专业的一门重要的限制性选修课程，本课程是计算机科学中最年轻的分支学科之一，它是计算机科学和认知心理学两个学科相结合的产物，涉及当前许多热门的计算机技术如人工智能、自

2、然语言处理、多媒体系统等等，该课程讲授用户界面的基本概念、基本原理及其设计原则，通过设计ICON、FLASH动画、色彩运用等实验，培养学生的软件开发能力和团队合作能力。（二）课程目标课程目标包括知识目标和能力目标，具体如下：课程目标1：讲授软件人机界面的设计技术、方法和过程，主要任务是使学生掌握人机界面的基本概念、基本原理、及其设计原则，具备设计图标、FLASH动画、熟练运用色彩的能力。课程目标2：了解人机界面设计的发展方向，如何用规范的方法进行软件界面设计，以及在设计过程中应遵循的流程、准则、标准和规范，具备设计网页界面、WINDOWS软件用户界面、手机软件用户界面的能力，并能具备终身学习的

3、能力。（三）课程目标与专业毕业要求指标点的对应关系本课程支撑专业培养计划中的毕业要求指标点11.3和12.3。毕业要求指标点11.3：能够在多学科环境中应用工程管理原理与经济决策方法，具备初步的计算机工程项目管理经验与能力。毕业要求指标点12.3：能根据个人或职业发展的需求，具备不断学习和适应计算机技术快速发展的能力。课程目标毕业要求指标点课程目标1课程目标2毕业要求11.3毕业要求12.3二、课程内容及教学要求通过本课程学习，学生需要掌握如下基本内容：简单软件界面的基本概念和内容；介绍界面设计的基本概念、特性与分析方法，以及软件界面的应用领域及软件开发过程；讨论如何建立软件界面的快速原型，并

4、介绍原型开发工具MS.NET；介绍常用的软件界面交互形式；通过实际训练，让学生掌握客户端与WEB软件、手机界面设计技术；介绍如何对软件界面进行测试与评估。本课程采用实例教学法：学习用户界面设计需要将理论和实践结合起来，通过课堂学习了解理论知识，通过实验课程巩固和实践理论知识。用户界面设计是一门实践性很强的课程，因此在学完所要求的内容后安排了案例实践，根据所给的案例要求，完成实际应用的开发。为能够顺利完成课程的学习，建议学生认真做每章的实验内容。第1章用户界面概念（2学时）（一）教学内容1.用户界面的基本概念；2.用户界面对软件产品的重要性；3.用户界面的研究内容和应用领域；4.人机交互与用户界

5、面设计；5.用户界面设计的发展趋势。（二）教学要求1.掌握用户界面的基本概念；2.了解用户界面的特性；3.了解用户界面的应用领域；4.了解人机交互与用户界面设计的含义。（三）重点与难点1. 重点用户界面对软件产品的重要性2. 难点人机交互与用户界面设计的含义第2章用户界面的设计规则和方法（2学时）（一）教学内容1.用户界面的设计规则；2.用户界面的设计流程；3.界面需求分析；4.UI设计师的工作。（二）教学要求1.了解如何制订设计原则；2.掌握交互设计的内容和流程；3.熟悉如何建立用户界面原型。（三）重点与难点1.重点用户界面的设计流程2.难点交互设计的内容和流程第3章界面设计的部分编码实现技

6、术（4学时）教学内容1.HTML、DHTML、XHTML；2.XML、SGML；3.JAVASCRIPT；4.CSS；5.VRML。（二）教学要求1.了解HTML的主要特性、掌握HTML语言的使用；2.了解JAVASCRIPT的基本特性，掌握JAVASCRIPT编程开发技术；3.掌握CSS样式、XML、SGML、VRML在网页界面设计中的应用。（三）重点与难点1.重点HTML语言的使用、JAVASCRIPT编程开发技术、CSS样式2.难点CSS样式、XML、SGML、VRML在网页界面设计中的应用第4章多媒体制作和处理方法（4学时）（一）教学内容1.图标制作设计；2.图像处理设计；3.动画制作

7、设计。（二）教学要求1.了解图象处理的基本原理；2.掌握使用FLASH、FIREWORKS、PS等工具进行基本的图片、图标制作处理和设计。（三）重点与难点1.重点图标制作、图像处理、动画制作2.难点使用FLASH、FIREWORKS、PS等工具进行基本的图片、图标制作处理和设计第5章 WEB软件用户界面设计（4学时）（一）教学内容1.网页设计与传统WINDOWS软件的区别；2.网页颜色设计；3.导航栏设计；4.网页的布局和网站总体设计；5.网页设计开发软件dreamweaver的使用。（二）教学要求1.了解网页设计与传统WINDOWS软件的区别；2.掌握网页颜色设计原则、导航栏设计方法；3.掌

8、握网页设计开发软件dreamweaver的使用。（三）重点与难点1.重点网页颜色设计原则、导航栏设计方法2.难点网页的布局和网站总体设计第6章 WINDOWS软件用户界面设计（4学时）（一）教学内容1.WINDOWS图形用户界面的特点；2.图形用户界面设计的艺术原则；3.在图形用户界面中使用图标；4.利用VS.NET开发图形用户界面。（二）教学要求1.了解图形用户界面的特点；2.掌握图形用户界面设计的艺术原则；3.熟悉如何在图形用户界面中使用图标；4.掌握利用VS.NET进行WINDOWS图形用户界面软件开发技术。（三）重点与难点1.重点图形用户界面设计的艺术原则、在图形用户界面中使用图标2.

9、难点利用VS.NET进行WINDOWS图形用户界面软件开发第7章手机软件用户界面设计（2学时）（一）教学内容1.手机的用户界面特点；2.手机的用户界面设计开发方法；3.未来手机的用户界面设计发展。（二）教学要求1.了解手机的用户界面特点；2.掌握手机的用户界面设计开发方法；3.熟悉未来手机的用户界面设计发展趋势。（三）重点与难点1.重点手机的用户界面特点、手机的用户界面设计开发方法2.难点手机的用户界面设计开发方法第8章软件界面测试与评估（2学时）（一）教学内容1.人机界面测试与评估的内容与要求；2.进行反复的可用性测试；3.验收测试；4.经验评估方法。（二）教学要求1.掌握人机界面测试与评估

10、的内容与要求2.了解如何进行反复的可用性测试；3.了解验收测试的内容；4.掌握经验评估方法。（三）重点与难点1.重点人机界面测试与评估的内容与要求、验收测试的内容、经验评估方法2.难点经验评估方法三、本课程开设的实验项目编号实验项目名称学时类型要求支撑的课程目标1人机界面认知实验2验证性必做课程目标12人机系统显示界面设计实验2设计性必做课程目标13用户界面的编码实现实验2验证性必做课程目标14ICON设计实验2设计性必做课程目标15FLASH动画设计实验2设计性必做课程目标16色彩设计实验2验证性必做课程目标17网页界面设计实验-= 1 * ROMANI2综合性必做课程目标1，28网页界面设

11、计实验-= 2 * ROMANII2综合性必做课程目标1，29WINDOWS软件用户界面设计实验-= 1 * ROMANI2综合性必做课程目标1，210WINDOWS软件用户界面设计实验-= 2 * ROMANII2综合性必做课程目标1，211手机软件用户界面设计实验-= 1 * ROMANI2综合性必做课程目标1，212手机软件用户界面设计实验-= 2 * ROMANII2综合性必做课程目标1，2实验1：人机界面认知实验1. 实验目的及要求1）掌握用户界面的基本概念；2）了解用户界面对软件产品的重要性；3）理解用户界面的研究内容和应用领域；4）了解用户界面设计的发展趋势。2. 实验主要内容1

12、）通过收集各种类型的界面，并对其进行分析，从感性上理解人机界面的概念，指导学生从网上或者生活中收集不同类型的界面，并带入到课堂中讨论，应用到以后的界面设计中去；2）收集一些有价值的设计经验，供以后设计界面使用。3. 重难点理解人机界面的概念，收集一些有价值的设计经验。实验2：人机系统显示界面设计实验1. 实验目的及要求1）掌握用户界面的设计规则；2）了解用户界面的设计流程；3）熟悉如何建立用户界面原型；4）学会界面需求分析。2. 实验主要内容1）给学生一些已有界面，并提供这些界面所处的应用环境资料，在原有界面基础上按设计规则进行修改和改进设计，提高运用界面设计的知识能力和分析已有界面特点的能力

13、，将理论和实践相结合；2）掌握交互设计的内容和流程，收集一些有价值的设计经验，供以后设计界面使用。3. 重难点熟悉如何建立用户界面原型，掌握交互设计的内容和流程。实验3：用户界面的编码实现实验1. 实验目的及要求1）了解HTML的主要特性、掌握HTML语言的使用；2）了解JAVASCRIPT的基本特性，掌握JAVASCRIPT编程开发技术；3）掌握CSS样式、XML、SGML、VRML在网页界面设计中的应用。2. 实验主要内容1）利用JAVASCRIPT、CSS等语言来实现各类网页界面风格如：动画、导航栏、特效、界面布局等。2）使用FLASH、FIREWORKS、PS等工具进行基本的图片、图标

14、制作处理和设计。3. 重难点图标制作、图像处理、动画制作实验4：ICON设计实验1. 实验目的及要求1）了解HTML的主要特性、掌握HTML语言的使用；2）了解JAVASCRIPT的基本特性，掌握JAVASCRIPT编程开发技术；3）掌握CSS样式、XML、SGML、VRML在网页界面设计中的应用。2. 实验主要内容1）利用JAVASCRIPT、CSS等语言来实现各类网页界面风格如：动画、导航栏、特效、界面布局等。2）使用FLASH、FIREWORKS、PS等工具进行图标制作处理和设计，提供源代码作为实验报告结果。3. 重难点使用FLASH、FIREWORKS、PS等工具进行图标制作实验5：F

15、LASH动画设计实验1. 实验目的及要求1）通过设计FLASH动画，对界面设计的知识进行融会贯通，通过上机实践对理论进行更深入的了解；2）利用JAVASCRIPT、CSS等语言来实现各类网页界面风格如：动画、导航栏、特效、界面布局等。2. 实验主要内容1）利用JAVASCRIPT、CSS等语言来实现网页动画等。2）使用FLASH、FIREWORKS、PS等工具进行动画设计，提供源代码作为实验报告结果。3. 重难点使用FLASH、FIREWORKS、PS等工具进行动画制作实验6：色彩设计实验1. 实验目的及要求1）了解色彩的设计原则；2）了解各种颜色主题；3）掌握使用不同颜色搭配。2. 实验主要

16、内容1）学会使用不同颜色搭配以及通过不同颜色来表现主题；2）将色彩的设计原则熟练应用到实际设计中，提供设计作品作为实验报告结果。3. 重难点颜色主题、色彩的设计原则实验7：网页界面设计实验-I1. 实验目的及要求1）了解网页设计与传统WINDOWS软件的区别；2）掌握网页颜色设计原则、导航栏设计方法；3）掌握网页设计开发软件dreamweaver的使用。2. 实验主要内容1）根据给定的设计主题或者目标，在网络和生活中搜集素材，做好网站的规划；2）根据界面设计的原则，设计出符合主题思想、有创意、实用的网页界面。3. 重难点网页的布局和网站总体设计实验8：网页界面设计实验-II1. 实验目的及要求

17、1）了解网页设计与传统WINDOWS软件的区别；2）掌握网页颜色设计原则、导航栏设计方法；3）掌握网页设计开发软件dreamweaver的使用。2. 实验主要内容1）根据给定的设计主题或者目标，在网络和生活中搜集素材，做好网站的规划；2）根据界面设计的原则，设计出符合主题思想、有创意、实用的网页界面；3）提供设计的网站代码作为实验报告结果。3. 重难点网页的布局和网站总体设计实验9：WINDOWS软件用户界面设计实验-I1. 实验目的及要求1）了解图形用户界面的特点；2）掌握图形用户界面设计的艺术原则；3）熟悉如何在图形用户界面中使用图标；4）掌握利用VS.NET进行WINDOWS图形用户界面

18、软件开发技术2. 实验主要内容1）掌握在图形用户界面中使用图标的方法；2）利用VS.NET开发图形用户界面。3. 重难点图形用户界面设计的艺术原则、在图形用户界面中使用图标实验10：WINDOWS软件用户界面设计实验-II1. 实验目的及要求1）了解图形用户界面的特点；2）掌握图形用户界面设计的艺术原则；3）熟悉如何在图形用户界面中使用图标；4）掌握利用VS.NET进行WINDOWS图形用户界面软件开发技术2. 实验主要内容1）将软件界面设计原理应用于WINDOWS软件系统的人机界面设计中，提供一个WINDOWS应用系统的例子，要求设计登录界面、不同用户界面和其他功能界面；2）利用VS.NET

19、开发图形用户界面，提供设计代码作为实验报告结果。3. 重难点利用VS.NET进行WINDOWS图形用户界面软件开发实验11：手机软件用户界面设计实验-I1. 实验目的及要求1）了解手机用户界面特点；2）了解手机用户界面设计开发方法。2. 实验主要内容1）根据界面设计原则对手机的软件界面进行设计；2）考虑手机自身分辨率以及手机功能和手机用户群特点，进行手机软件界面设计。3. 重难点手机的用户界面设计开发方法实验12：手机软件用户界面设计实验-II1. 实验目的及要求1）了解手机用户界面特点；2）了解手机用户界面设计开发方法。2. 实验主要内容1）根据界面设计原则对手机的软件界面进行设计；2）考虑

20、手机自身分辨率以及手机功能和手机用户群特点，进行手机软件界面设计；3）提供设计代码作为实验报告结果。3. 重难点未来手机的用户界面设计发展趋势四、学时分配及教学方法章教学形式及学时分配主要教学方法支撑的课程目标课堂教学实验上机课程实践小计第1章用户界面概念224讲授、案例、演示、课程目标1第2章用户界面的设计规则和方法224讲授、案例、演示、实验课程目标1第3章界面设计的部分编码实现技术448讲授、案例、演示、实验课程目标1，2第4章多媒体制作和处理方法448讲授、案例、演示、实验课程目标1第5章 WEB软件用户界面设计448讲授、案例、演示、实验课程目标1，2第6章 WINDOWS软件用户界

21、面设计448讲授、案例、演示、实验课程目标1，2第7章手机软件用户界面设计246讲授、案例、演示、实验课程目标1，2第8章软件界面测试与评估22讲授、案例、演示、实验课程目标1，2合计242448注：1.课程实践学时按相关专业培养计划列入表格； 2.主要教学方法包括讲授法、讨论法、演示法、研究型教学方法（基于问题、项目、案例等教学方法）等。五、课程考核1. 课程考核方式包括期末考试、平时作业和实验情况考核。考核形式考核要求考核权重备注平时作业及阶段测试课后完成35个习题，主要考核学生对每节课知识点的复习、理解和掌握度，计算全部作业的平均成绩再按15%计入总成绩；可让学生查阅资料，了解本课程相关技术发展情况，自主学习并完成。15%根据平时作业得分取平均值或结合平时测试情况实验完成12个实验，主要训练学生应用所学知识构建实验系统，并进行实验的能力，最后按35%计入课程总成绩。35%评分细则见附录1期末考试试卷题型包括选择题、填空题、判断题、应用题、设计题5大类，以卷面成绩的50%计入课程总成绩。其中考核基础知识及应用能力的题占90%；考核能针对个人或职业发展的需求，采用合适的方法