移动UI设计与实战

课证融通：内容编写有机融合面向界面设计1+X 证书的相关技能要求。

课程思政：将中国传统文化元素融入案例，为课程思政建设提供思路。

校企合作：一手素材、真实案例，将知识、技能、标准全面融入教学。

实践性强：采用“项目导向、任务驱动”的编写方式，突出实践应用。

资源丰富：配套电子课件、微课、习题答案等资源，方便师生教与学。

随着“互联网+”时代的发展及社会、市场的需求，UI设计职业岗位越来越受欢迎。该领域人才需求缺口大、就业待遇薪资高、发展空间大，是许多人向往的工作岗位。

1．本书特色

（1）课证融通。依据界面设计1+X职业技能初级证书中对界面设计模块要求，全面梳理教材内容，将企业工作任务、职业技能要求、行业设计规范等融入教材，同时，结合教学中有效的实践、工具和方法，开发学习流程，并对课证融通进行探索，建设面向界面设计1+X职业技能初级证书的配套辅助教材。

（2）课程思政。通过视觉表达方法把中国传统文化元素运用到手机主题界面设计中，在图标功能与文化内涵之间建立起对应关系，让读者在学习中体会中华民族传统文化的魅力。

（3）校企合作。编写过程中充分与企业一线设计人员进行沟通，选取了行业一手素材，以及与企业合作的真实教学项目作为教材编写的案例，将知识、技能、标准全面融入本书的任务中。

（4）实践性强。采用“项目导向、任务驱动”的编写方式，各项目主要包含“任务要点”“任务实现”“任务拓展”“任务小结”等环节，紧紧围绕任务，构建融合互通、层层递进的任务体系。

（5）资源丰富。运用二维码技术提供丰富的资料包，包括微课、习题答案、扩展阅读等，方便读者进行对比学习，方便教师做课程准备。

2．内容概述

本书依据职业技能提升过程，分为三篇：第一篇是基础篇，主要掌握界面设计学习中的职业标准和技能要求并对职业岗位进行认知和了解；第二篇是图标篇，在理解基础理论之上学习界面设计中重要元素图标；第三篇是综合实践篇，在掌握基础能力后进行视觉设计实践。其中，第一篇有2个项目、8个任务，主要涵盖界面设计岗位能力要求、产品开发流程应用、界面设计规范、交互设计基础、界面设计原则及移动端UI设计中的色彩表现6个方面内容；第二篇有1个项目、9个任务，分别对线性图标、面性图标、线面结合图标、扁平风格图标、轻拟物图标、写实图标设计制作要点及方法进行介绍；第三篇有3个项目、18个任务，分别对手机主题界面设计制作、App应用界面设计制作及交付文档进行模拟训练。

3．读者对象

本书信息量大、内容资源丰富、实用性强，既可以作为数字媒体应用技术、艺术设计、移动应用开发等专业的教材和学习辅导书，也可以作为考取界面设计1+X职业技能初级证书的备考人员的参考书和界面设计爱好者的自学书籍。为读者了解界面设计基础，掌握平面软件制作，掌握交互基础、制作界面视觉设计作品提供帮助。

4．作者团队

本书由来自一线项目的研发人员和一线教学的任课老师编写而成。本书由苗楠任主编，负责全书的统稿、修改、定稿工作，赵晟媛任副主编。具体编写分工为：苗楠负责编写项目一，项目四，项目五，项目六和项目三中的任务1、2、3、4、7；赵晟媛负责编写项目二和项目三中的任务5、6、8、9。同时，李鑫平、董文婧、唐建民等为本书编写和资源建设做了很多有益工作；中国水利水电出版社的有关负责同志对本书的出版给予了大力支持。在此，向这些作者以及为本书出版付出辛勤劳动的同志表示感谢。在本书编写过程中还参阅和采用了部分设计网站的文章及图例，因来源复杂，不能一一标注作者，在此深表歉意和感谢。

在本书编写过程中编者虽然倾注了全部精力，但由于水平有限，加之时间仓促，书中难免有疏漏之处，恳请各位读者和专家批评指正。

基础篇

项目一 移动端界面设计基础 1
任务1 认识移动端界面设计 1
任务要点 1
任务检测 4
任务2 产品开发流程应用 5
任务要点 5
任务检测 10
任务3 移动端界面基础设计规范 10
任务要点 10
任务检测 18
任务4 交互设计基础 18
任务要点 18
任务检测 34
任务5 移动端界面设计基本原则 35
任务要点 35
任务检测 52
项目总结 53
项目二 移动端界面设计色彩搭配 54
任务1 色彩的基本认知 54
任务要点 54
任务检测 67
任务2 色彩情感在移动端界面中的应用 67
任务要点 67
任务实现—渐变色锁屏手机界面制作 78
任务检测 86
任务3 移动端界面色彩配色技巧 87
任务要点 87
任务实现—移动端界面主色配色设定 116
任务检测 122
项目总结 123

图标设计篇

项目三 使用Photoshop设计制作图标 124
任务1 认识图标设计 124
任务要点 124
任务实现—微信图标的设计制作 131
任务检测 134
任务小结 135
任务2 线性图标设计制作 135
任务要点 135
任务实现—天气图标的绘制 138
任务拓展 140
任务小结 141
任务3 面性图标设计制作 141
任务要点 141
任务实现—相机图标的绘制 144
任务拓展 146
任务小结 146
任务4 线面结合图标设计制作 146
任务要点 146
任务实现—首页图标的绘制 147
任务拓展 149
任务小结 149
任务5 扁平化图标—折纸图标设计制作 149
任务要点 149
任务实现—地图图标制作 154
任务拓展 157
任务小结 157
任务6 轻拟物图标—轻质感图标设计
制作 157
任务要点 157
任务实现—时间图标制作 160
任务拓展 162
任务小结 162
任务7 轻拟物图标—透明质感图标设计
制作 162
任务要点 162
任务实现—设置图标制作 164
任务拓展 167
任务小结 168
任务8 写实图标—金属质感图标设计
制作 168
任务要点 168
任务实现—开关图标制作 174
任务拓展 178
任务小结 178
任务9 写实图标—木质感图标设计制作 178
任务要点 178
任务实现—邮件图标制作 188
任务拓展 192
任务小结 192

综合实践篇

项目四 剪纸风格手机主题界面设计 193
任务1 手机主题桌面图标设计 193
任务要点 193
任务实现—剪纸风格图标制作 195
任务拓展 200
任务小结 201
任务2 手机主题背景界面设计 201
任务要点 201
任务实现—背景界面设计制作 202
任务拓展 205
任务小结 206
任务3 手机主题锁屏界面设计 206
任务要点 206
任务实现—锁屏界面设计制作 207
任务拓展 208
任务小结 209
项目五 新西兰NAMEKIWI App应用界面
设计 210
任务1 App启动图标设计 210
任务要点 210
任务实现—App启动图标制作 211
任务拓展 213
任务小结 214
任务2 启动页设计 214
任务要点 214
任务实现—启动页制作 215
任务拓展 217
任务小结 217
任务3 引导页设计 217
任务要点 217
任务实现—引导页制作 218
任务拓展 221
任务小结 222
任务4 首页设计 222
任务要点 222
任务实现—首页制作 224
任务拓展 237
任务小结 238
任务5 分类页设计 238
任务要点 238
任务实现—分类页制作 240
任务拓展 242
任务小结 243
任务6 商品详情页设计 243
任务要点 243
任务实现—商品详情页制作 245
任务拓展 247
任务小结 248
任务7 搜索页设计 248
任务要点 248
任务实现—搜索页制作 249
任务拓展 251
任务小结 251
任务8 搜索结果页设计 251
任务要点 251
任务实现—搜索结果页制作 252
任务拓展 254
任务小结 255
任务9 登录注册页设计 255
任务要点 255
任务实现—登录注册页制作 255
任务拓展 257
任务小结 258
任务10 购物车页设计 258
任务要点 258
任务实现—购物车页制作 259
任务拓展 262
任务小结 263
任务11 订单结算页设计 263
任务要点 263
任务实现—订单结算页制作 264
任务拓展 266
任务小结 267
任务12 个人中心页设计 267
任务要点 267
任务实现—个人中心页制作 268
任务拓展 271
任务小结 272
项目六 新西兰NAMEKIWI App项目设计
交付文档 273
任务1 设计适配 273
任务要点 273
任务实现—设计适配 276
任务拓展 279
任务小结 279
任务2 标注 280
任务要点 280
任务实现—标注登录页面 281
任务拓展 286
任务小结 286
任务3 切图 287
任务要点 287
任务实现—分类页切图 293
任务拓展 297
任务小结 297
参考文献 298

1. 庭院风骨—树、灌、篱 [创意房主 著]
2. Python语言程序设计教程 [郭其标 房宜汕]
3. 微积分（经管类）教程篇（下册） [曹海军 王海棠 周玲丽]
4. 微积分（经管类）教程篇（上册） [曹海军 王海棠 周玲丽]
5. 微积分（经管类）导学篇（上册） [王海棠 曹海军 周玲丽]
6. 网站前端技术案例教程（HTML+CSS+JavaScript）（第二版） [黄华升]
7. 线性代数 [主编 史昱 陈凤欣]
8. 电力电子技术课程学习及实验指导 [主编 陈荣]
9. 成长对话：青春的榜样 [主编　施端银　黄武刚　应巨林]
10. 人工智能应用基础 [主编 杨缨 李佳]
11. 中华水文化（慕课版）（第二版） [毕雪燕 杨华轲 罗玲谊 等编著]
12. 电路与电子技术Ⅱ——电路分析基础 [主编 陈晓 金哲]
13. 飞机维修专业英语——飞机系统（第二版） [赵迎春]
14. 英语大爆炸：跟趣味情景剧学口语（微课版） [秦然　编著]
15. 机械工程制图任务跟踪训练 [主编 王瑞清 赵金考 周彦云 ]
16. 机械工程制图 [主编 覃国萍 刘百顺 禹晨]
17. 平面设计与制作项目化教程 [主编　李晨]
18. 后期影像剪辑技术 [主编　郭建伟]
19. 人工智能概论（第二版） [主编　任云晖　丁红　徐迎春 ]
20. 信息时代美育之道 [主编　刘宏宇　黎娅]
21. 数字媒体交互设计项目式教程（微课版） [主编　苏陆]
22. 动画运动规律项目实例解析（微课版） [孙珊珊　袁维坤]
23. 自然语言处理 [主编　冯建周]
24. 新媒体内容创作实务（微课版） [主编　覃思源]
25. 人工智能基础 [主编 余平 张春阳]
26. 人工智能导论 [主编 王飞 潘立武]
27. Amazing！儿童英语自然拼读分级教材（全8册） [王玲　编著]
28. Spark大数据处理技术 [主编　刘仁山　周洪翠　庄新妍]
29. 毫无PS痕迹—你的第一本Photoshop书（第二版） [赵鹏 著]
30. 电视新闻制作（活页式） [主编 王晓翠 刘传琳]