更新时间:2022-09-14 15:42:56
封面
版权信息
内容提要
前言
第1章 关于移动UI设计
1.1 了解移动UI设计
1.1.1 初识UI设计
1.1.2 移动UI设计的概念
1.1.3 移动UI与PC端UI
1.1.4 将PC端UI重置为移动UI
1.2 移动UI的系统分类
1.2.1 iOS
1.2.2 Android系统
1.2.3 HarmonyOS
1.2.4 Wear OS和watchOS
1.3 移动UI设计流程
1.3.1 需求分析
1.3.2 原型设计
1.3.3 UI设计
1.4 移动UI设计原则
1.4.1 风格一致性原则
1.4.2 元素准确性原则
1.4.3 界面布局合理化原则
1.4.4 系统响应时间原则
1.5 移动UI设计流程的职位划分
1.5.1 产品经理
1.5.2 项目经理
1.5.3 UI设计师
1.5.4 开发工程师
1.6 本章小结
第2章 移动UI策划与原型设计
2.1 确定移动UI目标用户
2.1.1 分析移动UI项目背景
2.1.2 掌握用户画像分析法
2.2 完成移动UI策划书
2.3 了解思维导图
2.3.1 思维导图的设计依据
2.3.2 思维导图的特点
2.3.3 思维导图的作用
2.4 绘制思维导图的常用软件
2.4.1 MindMeister
2.4.2 MindManager
2.4.3 XMind
2.4.4 操作案例——下载并安装XMind
2.5 绘制移动UI思维导图
2.5.1 思维导图的操作流程
2.5.2 思维导图的基本类型
2.5.3 操作案例——绘制美妆App的首页思维导图
2.6 绘制移动UI草图
2.6.1 了解草图的概念
2.6.2 认识草图的特点
2.6.3 草图功能的体现
2.6.4 常见的草图形式
2.7 了解原型设计
2.7.1 原型设计的概念
2.7.2 原型设计的参与者
2.8 绘制原型的常用软件
2.8.1 Axure RP
2.8.2 Adobe XD
2.8.3 操作案例——安装Axure RP 10
2.9 绘制移动UI原型图
2.9.1 原型的表现手法
2.9.2 原型的重要性
2.9.3 操作案例——绘制美妆App首页草图
2.9.4 App原型设计与用户体验
2.9.5 操作案例——绘制美妆App分类界面原型
2.10 本章小结
第3章 优秀的移动UI色彩搭配
3.1 认识色彩
3.1.1 色彩基础
3.1.2 色彩三属性
3.2 和谐、统一的色彩搭配方法
3.2.1 同色系配色方法
3.2.2 邻近色配色方法
3.2.3 类似色配色方法
3.2.4 同色调配色方法
3.2.5 类似色调配色方法
3.3 突出、对比的配色方法
3.3.1 中差色配色方法
3.3.2 对比色配色方法
3.3.3 互补色配色方法
3.3.4 对比色调配色方法
3.4 构建移动UI颜色系统
3.4.1 确定风格
3.4.2 确定主色
3.4.3 确定辅色
3.4.4 操作案例——构建美妆App颜色系统
3.4.5 调整配色
3.5 移动UI色彩搭配的注意事项
3.5.1 切忌将精致、美观放在第一位
3.5.2 配色方案要符合用户的心理印象
3.5.3 操作案例——美妆App首页界面配色设计
3.5.4 App界面内容必须便于阅读
3.5.5 保守地使用色彩
3.5.6 规避杂乱的配色方案
3.5.7 操作案例——美妆App分类界面配色设计
3.6 本章小结
第4章 出色的移动图标设计
4.1 初识App图标
4.1.1 App图标的概念