教学内容
讨论问题：1.美妆电商App的工程背景有哪些？
2.美食外卖App的工程背景有哪些？ 内容大纲：具体可结合本章的PPT课件进行配合讲解。
8.1设计与制作美妆电商App工程
1.1.1分析美妆电商App的工程背景
2.1.2制作美妆电商App界面的草图原型
3.1.3构建美妆电商App的颜色系统
8.1.1设计与制作美妆电商App的图标组
□掌握美妆电商App的界面标注；
0掌握美妆电商App的切图资源：
0分析美食外卖App的工程背景；
0掌握制作美食外卖App的草图原型；
□掌握创立美食外卖App的颜色系统；
□掌握设计与制作美食外卖App的图标组；
0掌握美食外卖App的UI设计；
0掌握美食外卖App的交互设计；
0掌握美食外卖App的界面标注；
1.3.1需求分析
1.3.2原型设计
1.3.3UI设计
1.4移动UI设计原那么
1.4.1风格一致性原那么
1.4.2元素准确性原那么
1.4.3界面布局合理化原那么
5. 6. 3设置App界面中的内容间距
5. 6. 4操作案例一设计与制作iOS App侧面菜单界面5. 6.5移动App界面的布局方式
1.了解移动UI的基本元素；
教学重点
□掌握移动UI交互的类型。
教学难点
0掌握移动UI中的作用。
教学设计
1、教学思路：介绍交互动效的概念、交互设计软件、交互设计的基本流程、移动UI交互的类型、动效在UI中的作用和交互设计需要遵循的习惯等相关内容，使学员 能够理解并掌握移动App交互设计的相关知识。
2、教学手段：通过讲解操作案例的方式，使学员熟知移动App交互类型，并了解制作 移动App交互的绘制软件和表现手法。
2.了解常见的UI设计软件；
3.掌握移动UI的设计基础；
4.掌握设计与制作iOS App启动界面；
5.掌握设计与制作Android系统App界面；
6.掌握移动UI的字体规范；
小马口
7.掌握设计与制作iOS App登录界面；
8.掌握设计与制作Android系统App分类界面；
9.了解移动UI图片尺寸规范；
2.了解移动UI与PC端UI的不同点；
3.了解移动UI的系统分类以及各类型的特点；
4.理解移动UI设计流程；
5.了解需求分析阶段的主要步骤；
6.理解移动UI设计原那么以及各原那么的特点；
7.理解移动UI设计流程的职位划分。
课时内容
移动U1筹划与原型设计
授课时间
分钟
课时
教学目标
0了解移动UI目标用户；
7.2.2Adobe XD
6.3交互设计的基本流程
6. 3.1提出交互设计创意想法
7.3.2实现创意想法
6.4移动UI交互的类型
6.4.11转场过渡
6.4.2操作案例一设计与制作App转场交互
6.4.3层级展示
6.4.44.4空间扩展
6.4.5关注焦点
6.4.6内容呈现
6.4.77操作案例一设计与制作相册App内容呈现交互
教学目标
0了解标注的重要性；
H了解常见的标注软件；
0掌握标注移动UI；
0了解移动UI标注规范；
0掌握输出与适配iOS UI设计；
0掌握输出与适配Android系统UI设计。
教学重点
□掌握标注移动UI。
教学难点
0掌握输出与适配iOS UI设计；
0掌握输出与适配Android系统UI设计；
教学设计
1、教学思路：介绍标注的重要性、常见的标注软件、标注移动UI、移动UI标注规范、 输出与适配iOS UI设计和输出与适配Android系统UI设计，使学员能够了解并掌 握适配与输出移动UI设计的使用方法和技巧。
11.掌握导出Android系统App切图资源。
课时内容
设计与制作移动App工程
授课时间
分钟
课时
教学目标
0分析美妆电商App的工程背景：
□掌握制作美妆电商App界面的草图原型；
0掌握构建美妆电商App的颜色系统；
□掌握设计与制作美妆电商App的图标组；
0掌握美妆电商App的UI设计；
0掌握美妆电商App的交互设计；
3、教学资料及要求：准备一些视频和案例素材，以便在讲解过程中使用。
教学内容
讨论问题：1.移动II交互的类型有哪些？
2.动效在U1中作用有哪些？
内容大纲：具体可结合本章的PPT课件进行配合讲解。
6.1了解UI交互设计
6.1.1交互动效的概念
6.1.2基础动效类型
6.2常见的交互设计软件
6.2.1Adobe Affter Effects
1.1了解移动UI设计
1. 1.1初始移动UI设计
2.1.2移动UI设计的概念
1. 1.3移动UI与PC端UI
1.1.4将PC端LI重置为移动UI
1.2移动UI的系统分类
1.3.1iOS
1. 2.2Android系统
1. 2.3HarmonyOS
1. 4Wear OS和watchOS
1.3移动UI设计流程
7.5输出与适配iOS UI设计
7. 5.1向上适配与向下适配
7. 5.2适配切片命名规范
7. 5.3操作案例一导出iOS App界面切图资源
7.6输出与适配Android系统UI设计
7. 6.1Android系统中的“点9”切图
输出与适配的一稿两用
7. 6.3操作案例一导出Android系统App切图资源
2.4.3 XMind
2. 4.4操作案例一下载并安装XVind
2.5绘制移动UI思维导图
2.5.1思维导图的操作流程
3.5.2思维导图的基本类型
4.5.3操作案例一绘制美妆App的首页思维导图
2.6绘制移动UI草图
2. 6.1了解草图的概念
2. 6.2认识草图的特点
草图功能的表达
2. 6.4常见的草图形式
8.2.2Assistor PS
7.3标注移动UI
7. 3.1移动App标注的内容
7. 3.2操作案例一标注iOS App界面
7. 3.3标注的声明文档
7.3.4操作案例一标注Android系统App界面
7.4移动UI标注规范
7.4.1位置与尺寸的标注规范
7.4.2色彩和文字的标注规范
7.4.3切图资源的尺寸必须是偶数
8.2.4
设计与制作美食外卖App的图标组
8. 2.5
完成美食外卖App的UI设计
完成美食外卖App的交互设计
8. 2.7
完成美食外卖App的界面标注
8. 2.8
导出美食外卖App的切图资源
1.分析美妆电商App的工程背景；
2.掌握制作美妆电商App界面的草图原型；
3.掌握构建美妆电商App的颜色系统；
13.掌握美食外卖App的UI设计；
14.掌握美食外卖App的交互设计；
15.掌握美食外卖App的界面标注；
16.掌握美食外卖App的切图资源。
系统响应时间原那么
1.5移动UI设计流程的职位划分
1.5.1产品经理
1.5.2工程经理
1.5.3UI设计时
1.5.4开发工程师
1.6本章小结
小结
1.了解移动UI设计的概念；
1.7了解原型设计
2.7.1原型设计的概念
3.7.2原型设计的参与者
1.8绘制原型的常用软件
2.8.1Axure RP
3.8.2Adobe XD
4.8.3操作案例一安装Axure RP10
2.9绘制移动UI原型图
2. 9.1原型的表现手法
2. 9.2原型的重要性
操作案例一绘制美妆App分类界面原型
小结
教学设计
1、教学思路：通过对移动UI设计相关基础知识的讲解了解移动UI设计；
2、教学手段：针对移动UI与PC端UI的区别、移动UI的系统分类、移动UI设计流 程、移动II设计原那么和移动UI设计流程的职位划分进行讲解，
教学内容
讨论问题：1、移动UI的系统分类有哪些？
2、移动UI设计原那么有哪些？
内容大纲：具体可结合本章的PPT课件进行配合讲解。
□了解移动UI筹划书；
0了解思维导图；
□了解思维导图的常用软件；
0掌握绘制移动UI思维导图；
0掌握绘制移动UI草图；
□了解原型设计；
0了解绘制原型的常用软件；
0掌握绘制移动UI原型图。
教学重点
0掌握绘制移动UI思维导图。
教学难点
0掌握绘制移动UI草图；
□掌握绘制移动UI原型图。
教学设计
1、教学思路：通过对移动UI筹划与原型设计相关内容的讲解，使学员能够掌握移动UI筹划与原型设计的方法及形式。
10.掌握移动App内容布局：
11.掌握设计与制作iOS App首页界面；
12.掌握设计与制作iOS App侧面菜单界面。
课时内容
移动App交互设计
授课时间
分钟
课时
教学目标
0了解交互动效的概念：
0了解常见的交互设计软件；
0了解交互设计的基本流程；
0掌握移动UI交互的类型；
0掌握动效在UI中的作用；
0了解交互设计需要遵循的习惯。
2、教学手段：采用操作案例分析与理论知识相结合的方式进行讲解。
3、教学资料及要求：制作简单易懂的操作案例，通过由浅入深的方式，来加深学员对 相关理论知识的理解。
教学内容
讨论问题：1.思维导图有哪些特点？
2.草图功能的表达有哪些？
3.用户的体验方式和用户的体验要素有哪些？ 内容大纲：具体可结合本章的PPT课件进行配合讲解。