下载文档原格式
《图形与界面设计illustrator》课程教案第一讲：Illustrator CS4基础知识一、学习目标1．学生通过第一讲的学习，应了解平面设计、图形与界面设计、illustrator设计工作的基础理论知识。
2．学生在教师的引导下，通过Illustrator设计实例的鉴赏和分析，了解Illustrator 设计基本概念，图形与界面设计的基本理论与方式。
3．通过老师的演示，学生基本了解Illustrator软件的大体的功能以及性能。
二．课时三、教学内容分析1. 教学内容：本讲内容是图形与界面设计illustrator第一部分--数字媒体商业设计基本理论。
2．单元及课时教学内容分析本部分是基础理念内容，也是第一部分。
首先，讲解商业平面设计、图形与界面设计、illustrator设计工作的基础理论知识。
再次，但要Illustrator商业设计实例的鉴赏和分析，了解Illustrator设计基本概念，图形与界面设计的基本理论与方式。
最后，通过老师的演示，学生基本了解Illustrator软件的大体的功能以及性能。
3．教学重点、难点、关键本课的教学重点是了解和掌握图形与界面设计的概念；教学难点是矢量图和位图的区别；教学关键是借助各个实例的讲解，让学生体会了解Illustrator软件的大体的功能以及性能。
四、学生分析学生在学习本门课程之前，已经学习了Photoshop、InDesign等软件的应用，能够利用这些工具创作一般的数字媒体作品。
但对矢量设计软件没有接触过。
五、教学过程1．教学准备教师准备：教师机、教学广播软件、课件、Illustrator设计案例学生准备：复习已经学过的数字媒体设计软件2．教学过程说明分辨率是用于描述图像文件信息量的术语，通厘米；像素/英寸。
在保持不失真的情况下，该数据越大，印刷出来的图像也越大。
第二讲：Illustrator CS4基础操作一、学习目标1．学生通过该讲的学习，应了解文件的新建、保存和打开。
界面设计课程标准1. 课程简介界面设计是一门旨在教授学生创建用户友好和吸引人的数字界面的课程。
本课程旨在培养学生的视觉设计能力以及在用户体验和用户界面设计方面的技能和知识。
该课程将涵盖用户界面设计的基本原则、设计工具的使用、人机交互的最佳实践以及最新的界面设计趋势等。
学生将通过讲座、案例研究、实践项目和小组讨论等学习方式来掌握这些知识和技能。
2. 课程目标本课程的主要目标是：•培养学生的视觉设计能力，使他们能够创建具有吸引力和良好用户体验的界面。
•教授学生界面设计的基本原则和最佳实践，包括布局、色彩、字体、图标等方面的设计。
•培养学生在用户体验设计方面的技能，包括用户研究、用户测试和用户反馈等。
•了解最新的界面设计趋势和工具，以保持与行业的发展保持同步。
•提供实践项目，让学生能够将所学知识应用到实际设计中，并提供反馈和指导以提高他们的设计能力。
3. 课程大纲3.1 界面设计基础•介绍界面设计的基本概念和原则•研究用户体验的重要性•学习人机交互的基本原则和最佳实践•探讨常见的界面设计错误和如何避免它们3.2 设计工具和资源•介绍各种常用的界面设计工具，如Adobe XD，Sketch，Figma等•学习如何使用这些工具进行界面设计•提供设计资源和模板，帮助学生快速开始他们的设计项目3.3 色彩和排版•探讨色彩在界面设计中的重要性•学习如何选择适合的配色方案•研究字体的选择和排版原则，以确保良好的可读性和美观性3.4 图标和图形•学习如何设计和使用图标和图形来增强用户界面的可视化效果•探索各种图标和图形库，以及其在界面设计中的应用3.5 用户研究和测试•介绍用户研究的基本方法和技巧•学习如何进行用户测试和分析测试结果•强调用户反馈的重要性，并提供如何获取和利用用户反馈的指导3.6 响应式设计和移动界面•探讨响应式设计的原理和最佳实践•研究移动界面设计的特点和挑战•学习如何设计适应不同终端和屏幕尺寸的界面3.7 最新的界面设计趋势•了解最新的界面设计趋势和创新•学习如何跟随行业的发展并应用到自己的设计项目中4. 评估和考核方式本课程的评估和考核方式将包括以下几个方面：•日常作业和练习：包括设计项目和小组讨论•设计作品展示和评估：学生将展示自己的设计作品，并接受同学和教师的评估和反馈•期末考试：考查学生对界面设计基础知识和原则的理解5. 参考资料•Tidwell, J. (2010). Designing interfaces: Patterns for effective interaction design.O’Reilly Media.•Shneiderman, B., & Plaisant, C. (2010). Designing the user interface: Strategies for effective human-computerinteraction. Addison-Wesley Professional.•Preece, J., Sharp, H., & Rogers, Y. (2019). Interaction design: Beyond human-computer interaction. Wiley.•Brown, D., Macanufo, J., & Nickisch, C. (2009).Gamestorming: A playbook for innovators, rulebreakers, and changemakers.O’Reilly Media.以上是《界面设计》课程的标准。
《用户交互界面设计》教学教案一、课程概述本课程旨在教授学生用户交互界面设计的基本原理和技巧。
通过本课程的研究，学生将掌握用户交互界面设计的流程和方法，并能够运用所学知识设计出符合用户需求的优秀交互界面。
二、教学目标1. 了解用户交互界面设计的基本概念和原则；2. 掌握用户交互界面设计的流程和方法；3. 学会运用合适的工具和技术进行用户交互界面设计；4. 能够通过用户研究和测试，改进和优化交互界面设计；5. 培养学生的团队协作和问题解决能力。
三、教学内容1. 用户交互界面设计的概述和基本原则；2. 用户研究和需求分析；3. 信息架构和界面布局设计；4. 交互设计和可用性评估；5. 接口设计和视觉设计；6. 用户测试和反馈收集；7. 界面优化和改进。
四、教学方法1. 前导讲解：通过讲解理论知识和案例分析，介绍用户交互界面设计的基本概念和原则；2. 实践操作：引导学生使用相关工具和技术进行用户交互界面设计的实际操作，如界面绘制和模型构建；3. 小组讨论：组织学生进行小组讨论，分享设计思路和经验，并互相评价和改进设计方案；4. 项目实践：学生分为小组进行项目实践，在实际场景中应用所学知识进行交互界面设计；5. 阶段测试：进行中期和期末测试，评估学生对课程内容的掌握程度。
五、教学评价1. 平时表现：考察学生在课堂讨论、实践操作和小组合作中的参与度和表现；2. 项目报告：要求学生书写项目实践报告，包括需求分析、设计思路、界面展示和反馈收集等内容；3. 测试成绩：通过中期和期末测试评估学生对课程知识的掌握程度；4. 课堂作业：布置课堂作业以检验学生对理论知识的理解和掌握情况。
六、参考教材1. 《用户界面设计之美》- 刘伟2. 《交互设计之路》- 马云鹏3. 《用户中心设计》- 李虎以上是《用户交互界面设计》教学教案的概要内容，具体教学进度和细节会根据实际情况进行调整和完善。
相信通过本课程的学习，学生们将在用户交互界面设计领域有所突破和进步。
人机交互基础教程
实验报告
实验题目：图形用户界面的设计
专业计算机科学与技术
学生姓名
班级学号
教师
指导单位计算机软件学院
日期
教师
评语教师签名：
年月日
成绩评定
备注
一、实验目的
(1)熟悉图形用户界面的设计原则
(2)利用一种设计工具完成图形化的用户界面设计
二、预备知识
图形用户界面又称为WIMP界面，由窗口(windows)、图标(icons)、菜单(menu)、指点设备(pointing device)四位一体，形成桌面(desktop) ，如图所示。
WIMP界面
用
户
手
眼
击键/指点
窗口、图标
菜单、文本
应用例程
图形用户界面是当前用户界面的主流，广泛应用于各档台式微机和图形工作站。
图形用户界面的共同特点是以窗口管理系统为核心，使用键盘和鼠标器作为输入设备。
窗口管理系统除了基于可重叠多窗口管理技术外，广泛采用的另一核心技术是事件驱动(event-driven)技术。
WIMP界面可看作是第二代人机界面，是基于图形方式的人机界面。
在WIMP界面中，人被称为用户，人机通过对话进行工作。
用户只能使用手这一种交互通道输入信息，通过视觉通道获取信息。
在WIMP界面中，界面的输出可以为静态或动态的二维图形或图像等信息。
这种方式能同时输出不同种类的信息，用户也可以在几个工作环境中切换而不丢失几个工作之间的联系，通过菜单可以执行控制型和对话型任务。
由于引入了图标、按钮和滚动条技术，大大减少键盘输入，提高了交互效率。
基于鼠标和图形用户界面的交互技术极大地推动了计算机技术的普及。
(1)图形用户界面的三个重要思想
1）桌面隐喻(desktop metaphor)
指在用户界面中用人们熟悉的桌面上的图例清楚地表示计算机可以处理的能力。
隐喻的表现方法:静态图标、动画、视频2）所见即所得(What You See Is What You Get，WYSIWYG)
显示的用户交互行为与应用程序最终产生的结果是一致的。
3）直接操纵(direct manipulation)
直接操纵是指可以把操作的对象、属性、关系显式地表示出来，用光笔、鼠标、触摸屏或数据手套等指点设备直接从屏幕上获取形象化命令与数据的过程。
直接操纵的对象是命令、数据或是对数据的某种操作。
(2)设计图形用户界面的原则
1) 一般性原则：界面要具有一致性、常用操作要有快捷方式、提供简单的错误处理、对操作人员的重要操作要有信息反馈、操作可逆、设计良好的联机帮助、合理划分并高效地使用显示屏、保证信息显示方式与数据输入方式的协调一致
2) 颜色的使用：颜色是一种有效的强化手段，同时具有美学价
值。
使用颜色时应注意如下几点：限制同时显示的颜色数；画面中活动对象的颜色应鲜明，而非活动对象应暗淡；尽量避免不相容的颜色放在一起，如黄与蓝，红与绿等，除非作对比时用；若用颜色表示某种信息或对象属性，要使用户理解这种表示，并尽量采用通用的表示规则。
3)图标的设计：图标是可视地表示实体信息的简洁、抽象的符号。
图标设计是方寸艺术，需要在很小的范围内表现出图标的内涵。
设计图标时应该着重考虑视觉冲击力，要使用简单的颜色，利用眼睛对色彩和网点的空间混合效果，做出精彩图标。
4）按钮的设计：设计按钮应该具有交互性，应该有3到6种状态效果(点击时的状态、鼠标放在上面但未点击的状态、点击前鼠标未放在上面时的状态、点击后鼠标未放在上面时的状态、不能点击时的状态、独立自动变化的状态)，按钮应具备简洁的图示效果，应能够让使用者产生功能上的关联反应。
属于一个群组的按钮应该风格统一，功能差异大的按钮应该有所区别。
5）屏幕布局的设计：设计屏幕布局(Layout)时应该使各功能区重点突出,应遵循如下几条原则：平衡原则、预期原则、经济原则、顺序原则、规则化
6）菜单界面的设计：菜单在图形界面的应用程序中使用得非常普遍，是软件界面设计的一个重要组成方面，描述了一个软件的大致功能和风格。
菜单中的选项在功能上与按钮相当，一般具有下列一种或几种类型的选项：命令项、菜单项和窗口项。
菜单的结构一般有
单一菜单、线状序列菜单、树状结构菜单、网状结构菜单等，其中树状结构菜单是最常见的结构。
设计菜单界面时应注意的一般性原则：功能组织菜单，合理分类，并力求简短，前后一致；合理组织菜单界面的结构与层次；按一定的规则对菜单项进行排序；菜单选项的标题要力求文字简短、含义明确，并且最好以关键词开始；常用选项要设置快捷键；充分利用菜单选项的使能与禁止、可见与隐藏属性；使用弹出式菜单。
填表输入界面的设计：在处理大量相关数据的场合下，需要输入一系列的数据，这时填表输入界面是最理想的数据输入界面。
在设计填表输入界面时应遵循的原则：一致性；有含义的表格标题；使用易于理解的指导性说明文字；栏目按逻辑分组排序；表格的组织结构和用户任务相一致；光标移动方便；出错提示；提供帮助；表格显示应美观、清楚，避免过分拥挤。
三、实验内容与步骤
(1)实验内容
利用常用的设计工具(VC/VB/Delphi/PB等)完成一个通用图形
用户界面设计，要遵循界面设计的一般原则(一致性、快捷方式、提供错误处理)，注意颜色的使用，学会使用图标、按钮、屏幕布局、菜单和对话框的设计。
(2)实验步骤
1．设计多个对话框，完成填表输入界面的设计，合理使用图标、按钮、颜色；
2．设计不同形式的菜单，完成对不同对话框的调用；
3．提供简单的错误处理、联机帮助。
(3)实验截图
四、实验总结
通过此次实验，我很好地熟悉了图形用户界面的设计原则，并且
利用C#设计工具完成了图形化的用户界面设计。
