《PhotoshopCC 移动UI设计案例教程全彩慕课版》配套教学教案.docx
- 文档编号:1823691
- 上传时间:2022-10-24
- 格式:DOCX
- 页数:14
- 大小:1.03MB
《PhotoshopCC 移动UI设计案例教程全彩慕课版》配套教学教案.docx
《《PhotoshopCC 移动UI设计案例教程全彩慕课版》配套教学教案.docx》由会员分享,可在线阅读,更多相关《《PhotoshopCC 移动UI设计案例教程全彩慕课版》配套教学教案.docx(14页珍藏版)》请在冰豆网上搜索。
《PhotoshopCC移动UI设计案例教程全彩慕课版》配套教学教案
《PhotoshopCC移动UI设计案例教程(全彩慕课版)》
配套教学教案
第1讲
课时内容
初识移动UI设计
授课时间
180分钟
课时
4
教学目标
þ认识移动UI设计。
þ认识App。
教学重点
þ认识移动UI设计。
教学难点
þ了解App的设计流程。
教学设计
1、教学思路:
(1)通过认识移动UI设计了解UI设计的相关概念、移动UI设计的概念、特点、原则、常用软件和学习方法;
(2)通过认识App了解App的基本概念、操作平台、设计流程和基本分类。
2、教学手段:
(1)通过资料了解移动UI和App的概念;
(2)通过实例界面等图片深入了解移动UI和App。
教学内容
讨论问题:
1、移动UI设计的常用软件有哪些?
2、App的设计流程有哪些步骤?
内容大纲:
具体可结合本项目的PPT课件进行配合讲解。
1.1认识移动UI设计
1.1.1UI设计的相关概念
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.1App的基本概念
1.2.2App的操作平台
1.2.3App的设计流程
1.2.4App的基本分类
小结
1、了解移动UI设计。
2、了解App。
第2讲
课时内容
移动UI设计规范
授课时间
180分钟
课时
4
教学目标
熟练掌握iOS系统的设计规范。
熟练掌握Android系统的设计规范。
教学重点
掌握iOS及Android系统的设计尺寸。
掌握iOS及Android系统的界面结构。
掌握iOS及Android系统的图标规范。
掌握iOS及Android系统的字体规范。
教学难点
掌握iOS及Android系统的基本布局。
教学设计
1、教学思路:
(1)通过资料及实例图片讲解,掌握iOS系统的设计规范;
(2)通过资料及实例图片讲解,掌握Android系统的设计规范。
2、教学手段:
(1)通过总述了解iOS及Android系统的基本概念;
(2)通过分类解析深入学习iOS及Android系统的设计尺寸及单位、界面结构、基本布局、图标规范和文字规范。
教学内容
讨论问题:
1、iOS系统的界面结构有哪几部分组成?
2、iOS及Android系统的图标包括哪几种分类?
内容大纲:
具体可结合本项目的PPT课件进行配合讲解。
2.1iOS系统设计规范
2.1.1iOS设计尺寸及单位
2.1.2iOS界面结构
2.1.3iOS基本布局
2.1.4iOS图标规范
2.1.5iOS文字规范
2.2Android系统设计规范
2.2.1Android设计尺寸及单位
2.2.2Android界面结构
2.2.3Android基本布局
2.2.4Android图标规范
2.2.5Android文字规范
小结
1.了解并掌握iOS及Android系统的设计尺寸及单位。
2.了解并掌握iOS及Android系统的界面结构。
3.了解并掌握iOS及Android系统的基本布局。
4.了解并掌握iOS及Android系统的图标规范。
5.了解并掌握iOS及Android系统的文字规范。
第3讲
课时内容
iOS系统界面设计
授课时间
360分钟
课时
8
教学目标
了解栏的概念、分类和设计规范。
了解视图的概念、分类和设计规范。
了解控件的概念、分类和设计规范。
熟练掌握iOS系统界面设计的方法和规范。
教学重点
熟练掌握栏的应用和设计规范。
教学难点
掌握按钮的概念和分类。
教学设计
1、教学思路:
(1)通过对课堂实训案例的讲解掌握制作旅游类APP首页、旅游类APP相册页、旅游类APP登机牌页、旅游类APP酒店列表页和旅游类APP美食筛选页的方法和技巧;
(2)再通过相关的解析掌握栏、视图和控件的概念、分类和设计规范;(3)最后通过课堂练习和课后习题消化所学知识。
2、教学手段:
(1)通过课堂实训案例熟悉设计规范和软件功能;
(2)通过课堂练习和课后习题提高学生的实际应用能力。
3、教学资料及要求:
在网上找一些简单的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相册页
3.2.2操作列表
3.2.3活动视图
3.2.4警告窗
3.2.5集合视图
3.2.6图像视图
3.2.7地图视图
3.2.8页面浏览控制器
3.2.9课堂案例——制作旅游类APP登机牌页
3.2.10弹出框
3.2.11滚动视图
3.2.12分屏视图
3.2.13表单视图
3.2.14文字视图
3.2.15网络视图
3.3控件
3.3.1课堂案例——制作旅游类APP酒店列表页
3.3.2按钮
3.3.3编辑菜单
3.3.4标签
3.3.5页面控件
3.3.6选择器
3.3.7进度指示器
3.3.8刷新
3.3.9分段控件
3.3.10课堂案例——制作旅游类APP美食筛选页
3.3.11滑块
3.3.12步进器
3.3.13开关
3.3.14文本框
3.4课堂练习——制作旅游类APP酒店详情页
3.5课后习题——制作旅游类APP预约美食页
小结
1、了解并熟练掌握栏、视图和控件的概念。
2、了解并熟练掌握栏、视图和控件的分类。
3、了解并熟练掌握栏、视图和控件的设计规范。
4、熟练掌握iOS系统界面设计的方法和规范。
作业
3.4课堂练习——制作旅游类APP酒店详情页
使用移动工具移动素材,使用横排文字工具输入文字,矩形工具、圆角矩形工具、直线工具绘制基本形状。
3.5课后习题——制作旅游类APP预约美食页
使用移动工具移动素材,使用横排文字工具输入文字,矩形工具、直线工具绘制基本形状。
第4讲
课时内容
Android系统界面设计
授课时间
360分钟
课时
8
教学目标
了解栏的概念、分类和设计规范。
了解组件的概念、分类和设计规范。
熟练掌握Android系统界面设计的方法和规范。
教学重点
掌握组件的多种分类。
教学难点
熟练掌握栏的设计规范。
教学设计
1、教学思路:
(1)通过对课堂实训案例的讲解掌握制作医疗类APP闪屏页、医疗类APP首页、医疗类APP医生列表页、医疗类APP医生介绍页、医疗类APP医生筛选页和医疗类APP预约页的方法;
(2)再通过相关的解析掌握栏和组件的概念、分类和设计规范;(3)最后通过课堂练习和课后习题消化所学知识。
2、教学手段:
(1)通过课堂实训案例熟悉设计规范和软件功能;
(2)通过课堂练习和课后习题提高学生的实际应用能力。
3、教学资料及要求:
在网上找一些简单的Android系统界面进行临摹制作,来加深学员对知识点的理解和提高实际应用能力。
教学内容
讨论问题:
1、底部应用栏有哪些组成部分?
2、悬浮按钮的尺寸有哪些规范?
内容大纲:
具体可结合本项目的PPT课件进行配合讲解。
4.1栏
4.1.1课堂案例——制作医疗类APP闪屏页
4.1.2状态栏
4.1.3系统导航栏
4.2组件
4.2.1课堂案例——制作医疗类APP首页
4.2.2底部应用栏
4.2.3顶部应用栏
4.2.4背板
4.2.5横幅
4.2.6底部导航
4.2.7课堂案例——制作医疗类APP医生列表页
4.2.8按钮
4.2.9悬浮动作按钮
4.2.10卡片
4.2.11纸片
4.2.12数据表
4.2.13课堂案例——制作医疗类APP医生介绍页
4.2.14对话框
4.2.15分割线
4.2.16图片组
4.2.17列表
4.2.18菜单
4.2.19抽屉式导航
4.2.20状态指引
4.2.21课堂案例——制作医疗类APP医生筛选页
4.2.22选择控件
4.2.23底部面板
4.2.24侧面板
4.2.25滑块
4.2.26底部提示栏
4.2.27课堂案例——制作医疗类APP预约页
4.2.28选项卡
4.2.29文字框
4.2.30提示
4.3课堂练习——制作医疗类APP输入信息页
4.4课后习题——制作医疗类APP帮助支持页
小结
1、了解并熟练掌握栏和组件的概念。
2、了解并熟练掌握栏和组件的分类。
3、了解并熟练掌握栏和组件的设计规范。
4、熟练掌握Android系统界面设计的方法和规范。
作业
4.3课堂练习——制作医疗类APP输入信息页
使用移动工具移动素材,使用置入命令置入图片,使用矩形工具、圆角矩形工具和钢笔工具绘制基本形状,使用横排文字工具输入文字。
4.4课后习题——制作医疗类APP帮助支持页
使用移动工具移动素材,使用置入命令置入图片,使用剪贴蒙版命令调整图片显示区域,使用矩形工具、圆角矩形工具、椭圆工具和直线工具绘制基本形状,使用横排文字工具输入文字。
第5讲
课时内容
App界面设计实战
授课时间
360分钟
课时
8
教学目标
了解闪屏页的概念和分类。
了解引导页的概念和分类。
了解首页的概念和分类。
了解个人中心页、详情页和注册登录页的概念。
熟练掌握App界面设计的方法和规范。
教学重点
了解App界面的类型与组成部分。
教学难点
掌握App界面设计的方法和规范。
教学设计
1、教学思路:
(1)通过对课堂实训案例的讲解掌握制作美食到家App的方法;
(2)再通过相关的解析掌握闪屏页、引导页、首页、个人中心页、详情页和注册登录页的概念和分类;(3)最后通过课堂练习和课后习题消化所学知识。
2、教学手段:
(1)通过课堂实训案例熟练掌握App界面设计的方法和规范;
(2)通过相关的解析深入学习App界面的分类和概念。
3、教学资料及要求:
在网上找一些不同类型的App界面进行临摹,来加深学员对知识点的理解并提高实际应用能力。
教学内容
讨论问题:
1、品牌推广型闪屏页的概念是什么?
2、综合型首页由哪几部分组成?
内容大纲:
具体可结合本项目的PPT课件进行配合讲解。
5.1闪屏页
5.1.1品牌推广型
5.1.2活动广告型
5.1.3节日关怀型
5.2引导页
5.2.1功能说明型
5.2.2产品推广型
5.2.3搞笑卖萌型
5.3首页
5.3.1列表型
5.3.2网格型
5.3.3卡片型
5.3.4综合型
5.4个人中心页
5.5详情页
5.6注册登录页
5.7课堂案例——制作美食到家App
5.8课堂练习——制作DelicacyAPP
5.9课后习题——制作美食来了APP
小结
1、了解闪屏页、引导页、首页、个人中心页、详情页和注册登录页的分类
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- PhotoshopCC 移动UI设计案例教程全彩慕课版 PhotoshopCC 移动UI设计案例教程全彩慕课版配套教学教案 PhotoshopCC 移动 UI 设计 案例 教程 全彩 慕课版 配套
![提示](https://static.bdocx.com/images/bang_tan.gif)