图标设计与制作教学教案.docVIP

《UI图标设计案例教程》 教学教案 第1讲 课时内容 初识图标设计 授课时间 90分钟 课时 2 教学目标 ? 掌握图标的基本概念。 ? 掌握图标的应用场景。 ? 了解图标的风格类型。 ? 掌握图标的性格表现。 ? 掌握图标的设计原则。 ? 掌握图标的设计流程。 教学重点 ? 熟练掌握图标的基本概念。 ? 了解并掌握图标的应用场景。 ? 掌握图标的性格表现。 教学难点 了解图标的风格类型。 教学设计 教学思路：通过认识图标设计了解图标设计的相关概念、特点、原则、常用软件和学习方法。 教学手段：通过软件功能解析深入学习软件功能特点。 教学资料及要求：根据相关的工具和命令进行简单的练习和操作。 教学内容 讨论问题：1、图标设计的常用软件有哪些？ 2、图标的设计风格有哪些步骤？ 内容大纲：具体可结合本项目的PPT课件进行配合讲解。 1.1 图标的基本概念 1.2 图标的应用场景 1.2.1 产品图标 1.2.2 功能图标 1.2.3 装饰图标 1.3 图标的风格类型 1.3.1 拟物风格 1.3.2 扁平风格 1.3.3 3D风格 1.3.4 2.5D风格 1.4 图标的性格表现 1.4.1 圆角大小 1.4.2 描边粗细 1.4.3 颜色搭配 1.5 图标的设计软件 1.6 图标的设计原则 1.6.1 可识别性 1.6.2 视觉统一 1.6.3 简洁美观 1.6.4 愉悦友好 1.7 图标的设计流程 小结 掌握图标的基本概念。 掌握图标的应用场景。 了解图标的风格类型。 掌握图标的性格表现。 掌握图标的设计原则。 掌握图标的设计流程。 第2讲 课时内容 图标绘制方法 授课时间 90分钟 课时 2 教学目标 ? 掌握图标标准尺寸系统。 ? 掌握图标绘制像素完美。 ? 掌握图标的绘制思路。 ? 掌握布尔运算的使用。 ? 掌握图标等比例缩放。 ? 掌握图标的网格系统。 ? 掌握图标的视觉调整。 教学重点 ? 熟练掌握布尔运算的使用方法。 ? 了解图标标准尺寸系统。 ? 掌握图标的绘制思路。 教学难点 网格系统的使用方法和技巧。 教学设计 教学思路：（1）通过对课堂实训案例的讲解掌握用软件实现图标像素完美、用纸笔进行图标结构的分解、绘制基础面性图标、绘制基础线性图标、将图标通过缩放置入界面、运用网格系统调整图标、进行图标的重心调整、进行图标的线条调整、进行图标的颜色调整的方法和技巧；（2）通过资料及实例图片讲解，掌握图标的绘制思路；（3）通过资料及实例图片讲解，掌握图标绘制方法。 教学手段：（1）通过课堂案例快速熟悉制作思路和软件功能；（2）通过软件功能解析深入学习软件功能和制作特点。（3）通过课堂练习和课后习题提高学生的实际应用能力。 教学资料及要求：在网上或现实生活中找一些图标进行制作，来加深学员对知识点的理解，拓展实际应用能力。 教学内容 讨论问题：1、图标的绘制工具有哪些？ 2、如何使用网格系统？ 内容大纲：具体可结合本项目的PPT课件进行配合讲解。 2.1 图标标准尺寸系统 2.1.1 尺寸系统 2.1.2 图标尺寸 2.1.3 图标放大 2.1.4 图标布局 2.2 图标绘制像素完美 2.2.1 图标像素完美的概念 2.2.2 软件实现图标像素完美 2.2.3 课堂案例-用软件实现图标像素完美 2.3 图标的绘制思路 2.3.1 图标结构拆解 2.3.2 图标绘制工具 2.3.3 课堂案例-用纸笔进行图标结构的分解 2.4 布尔运算的使用 2.4.1不同软件的使用 2.4.2不同颜色的使用 2.4.3 课堂案例-绘制基础面性图标 2.4.4 课堂案例-绘制基础线性图标 2.5 图标等比例缩放 2.5.1 图标等比例缩放问题 2.5.2 图标等比例缩放方法 2.5.3 课堂案例-将图标通过缩放置入界面 2.6 图标的网格系统 2.6.1 网格系统的定制意义 2.6.2 网格系统的定制规范 2.6.3 网格系统的使用方法 2.6.4 课堂案例-运用网格系统调整图标 2.7 图标的视觉调整 2.7.1 重心调整 2.7.2 线条调整 2.7.3 颜色调整 2.7.4 课堂案例-进行图标的重心调整 2.7.5 课堂案例-进行图标的线条调整 2.7.6 课堂案例-进行图标的颜色调整 2.8 课堂练习-制作家居类面性图标 2.9 课后习题-制作服饰类线性图标 小结 掌握图标标准尺寸系统。 掌握图标绘制像素完美。 掌握图标的绘制思路。 掌握布尔运算的使用。 掌握图标等比例缩放。 掌握图标的网格系统。 掌握图标的视觉调整。 作业 2.8 课堂练习-制作家居类面性图标 使用圆角矩形工具、减去顶层形状命