移动端UI设计与制作案例教程

本书是一本讲解如何使用Photoshop软件进行移动端UI界面设计的实例教程，用于帮助UI设计爱好者，特别是移动端UI界面设计人员，提高界面设计与应用能力。本书共分为三个篇章：基础篇、图标设计篇和综合实战篇。其中基础篇讲解了移动UI设计的概念、岗位能力与要求和色彩表现，帮助读者了解行业，打好设计基础；图标设计篇通过10个经典案例分别讲解了极简风格、扁平风格和微质感图标的设计思路和表现手法，帮助读者学习图标设计的要点与规范；综合实践篇通过移动端主题图标设计、搜狗输入法皮肤设计和移动端界面设计，帮助读者夯实设计基础，拓展设计思路。

张芳芳是北京市信系管理学校的骨干教师，有丰富的教学及教研经验。本书是讲解如何使用Photoshop软件进行移动端UI界面设计的实例教程，用于帮助UI设计爱好者，特别是移动端UI界面设计人员，提高界面设计与应用能力。

第1篇 基 础 篇
项目1 认识移动端UI设计 2
任务1 移动端UI设计的定义 2
任务2 移动端UI设计的特点 3
任务3 了解企业中移动端产品设计流程 6
任务4 移动端产品团队相关职位及UI设计岗位能力要求 12
项目2 移动端UI设计中的色彩表现 14
任务1 色彩构成 15
任务2 色彩属性 16
任务3 视觉感受 17
任务4 色彩搭配技巧 24

第2篇 图标设计篇
项目1 极简图标设计 28
任务 绘制天气图标 28
项目2 扁平图标设计 33
任务1 扁平纯色块图标设计 33
任务2 扁平长投影图标设计 36
任务3 扁平微质感图标设计 39
项目3 质感图标设计 44
任务1 塑料质感图标设计 44
任务2 毛绒质感图标设计 55
任务3 皮质图标设计 64
任务4 金属质感图标设计 71
任务5 木质质感图标设计 79
任务6 玻璃质感图标设计 88

第3篇 综合实践篇
项目1 移动端主题设计 98
任务1 移动端主题图标设计 102
任务2 移动端背景设计 108
任务3 移动端解锁界面设计 110
任务4 主题图标测试与发布 119
项目2 搜狗输入法皮肤设计 123
任务1 搜狗输入法皮肤设计 126
任务2 搜狗输入法测试与发布 137
项目3 移动端界面设计 145
任务1 闪屏设计 164
任务2 引导页设计 169
任务3 登录页设计 175
任务4 首页设计 180
任务5 列表页设计 187
任务6 详情页设计 192

本书编者为职业院校UI设计课程任课教师，编者苦于市面上并没有成体系的移动端UI设计教学指导工具书，特与设计行业领头企业—创优翼公司培训讲师，共同收集整理了当前移动端UI设计行业前端的案例和项目，为广大初中级读者量身打造了这本全面学习移动端UI设计的经典教程。本书共分为3篇：基础篇、图标设计篇和综合实践篇，分别从行业认识、图标风格表现和实践应用3个部分详细全面地介绍了移动端UI设计的要点和规范。在每篇中，除了精心设计的经典案例，编者还为每个项目设计了配套的拓展任务，方便读者举一反三，融会贯通。本书建议分72课时进行教学或学习，具体安排如下。
课时安排
篇    内容    课时
第1篇    基础篇    4
第2篇    图标设计篇    32
第3篇    综合实践篇    36
本书提供了内容丰富的资料包，包括所有使用到的素材文件、终效果图、PSD源文件、习题答案，方便读者进行对比学习；还提供了教学指南和PPT课件，方便教师做课程准备，更好地进行课堂教学。请有此需要的读者登录华信教育资源网（www.hxedu.com.cn）下载使用。
本书由张芳芳、严芳、周国红担任主编，参与编写的人员还有刘雨晴、肖贺瑾、于洪军、梁亚丽，本书由胡志齐担任主审。
由于编者知识水平有限，加之时间仓促，书中难免有疏漏之处，恳请广大读者批评指正。

编  者