UI设计-教学教案.docVIP

《Photoshop CC 移动UI设计案例教程（全彩慕课版）》 配套教学教案 第1讲 课时内容 初识移动UI设计 授课时间 180分钟 课时 4 教学目标 ? 认识移动UI设计。 ? 认识App。 教学重点 ? 认识移动UI设计。 教学难点 ? 了解App的设计流程。 教学设计 教学思路：（1）通过认识移动UI设计了解UI设计的相关概念、移动UI设计的概念、特点、原则、常用软件和学习方法；（2）通过认识App了解App的基本概念、操作平台、设计流程和基本分类。 教学手段：（1）通过资料了解移动UI和App的概念；（2）通过实例界面等图片深入了解移动UI和App。 教学内容 讨论问题：1、移动UI设计的常用软件有哪些？ 2、App的设计流程有哪些步骤？ 内容大纲：具体可结合本项目的PPT课件进行配合讲解。 1.1 认识移动UI设计 1.1.1 UI设计的相关概念 1.1.2 移动UI设计的概念 1.1.3 移动UI设计的特点 1.1.4 移动UI设计的原则 1.1.5 移动UI设计的常用软件 1.1.6 移动UI设计学习方法 1.2 认识App 1.2.1 App的基本概念 1.2.2 App的操作平台 1.2.3 App的设计流程 1.2.4 App的基本分类 小结 了解移动UI设计。 了解App。 第2讲 课时内容 移动UI设计规范 授课时间 180分钟 课时 4 教学目标 ? 熟练掌握iOS系统的设计规范。 ? 熟练掌握Android系统的设计规范。 教学重点 ? 掌握iOS及Android系统的设计尺寸。 ? 掌握iOS及Android系统的界面结构。 ? 掌握iOS及Android系统的图标规范。 ? 掌握iOS及Android系统的字体规范。 教学难点 ? 掌握iOS及Android系统的基本布局。 教学设计 教学思路：（1）通过资料及实例图片讲解，掌握iOS系统的设计规范；（2）通过资料及实例图片讲解，掌握Android系统的设计规范。 教学手段：（1）通过总述了解iOS及Android系统的基本概念；（2）通过分类解析深入学习iOS及Android系统的设计尺寸及单位、界面结构、基本布局、图标规范和文字规范。 教学内容 讨论问题：1、iOS系统的界面结构有哪几部分组成？ 2、iOS及Android系统的图标包括哪几种分类？ 内容大纲：具体可结合本项目的PPT课件进行配合讲解。 2.1 iOS系统设计规范 2.1.1 iOS设计尺寸及单位 2.1.2 iOS界面结构 2.1.3 iOS基本布局 2.1.4 iOS图标规范 2.1.5 iOS文字规范 2.2 Android系统设计规范 2.2.1 Android设计尺寸及单位 2.2.2 Android界面结构 2.2.3 Android基本布局 2.2.4 Android图标规范 2.2.5 Android文字规范 小结 了解并掌握iOS及Android系统的设计尺寸及单位。 了解并掌握iOS及Android系统的界面结构。 了解并掌握iOS及Android系统的基本布局。 了解并掌握iOS及Android系统的图标规范。 了解并掌握iOS及Android系统的文字规范。 第3讲 课时内容 iOS系统界面设计 授课时间 360分钟 课时 8 教学目标 ? 了解栏的概念、分类和设计规范。 ? 了解视图的概念、分类和设计规范。 ? 了解控件的概念、分类和设计规范。 ? 熟练掌握iOS系统界面设计的方法和规范。 教学重点 t 熟练掌握栏的应用和设计规范。 教学难点 t 掌握按钮的概念和分类。 教学设计 教学思路：（1）通过对课堂实训案例的讲解掌握制作旅游类APP首页、旅游类APP相册页、旅游类APP登机牌页、旅游类APP酒店列表页和旅游类APP美食筛选页的方法和技巧；（2）再通过相关的解析掌握栏、视图和控件的概念、分类和设计规范；（3）最后通过课堂练习和课后习题消化所学知识。 教学手段：（1）通过课堂实训案例熟悉设计规范和软件功能；（2）通过课堂练习和课后习题提高学生的实际应用能力。 教学资料及要求：在网上找一些简单的iOS系统界面进行临摹制作，来加深学员对知识点的理解和提高实际应用能力。 教学内容 讨论问题：1、视图有哪几种分类？ 2、按钮的概念是什么？ 内容大纲：具体可结合本项目的PPT课件进行配合讲解。 3.1 栏 3.1.1 课堂案例——制作旅游类APP首页 3.1.2 状态栏 3.1.3 导航栏 3.1.4 搜索栏 3.1.5 标签栏 3.1.6 工具栏 3.2 视图 3.2.1 课堂案例——制作旅游类APP相册页