UI图标手绘88例

　　这是一本UI图标手绘设计专业教程。本书的宗旨是帮助读者理解图标设计的原理，用手绘的方式将图标展现出来。在UI设计工作中，我们可以采用各种设计方法制作图标。其中，手绘是一种快速且容易出效果的方式，设计师在独立创作、群体讨论、会议展示、工作汇报时均可采用。本书分为3篇，共14章。其中，基础篇和进阶篇讲解如何制作App相关的各类图标，在初步掌握手绘技能的同时，理解UI图标设计的原理和规范，从而为图标手绘练习打下良好的基础。高阶篇则是将生活中常见的事物融入图标设计中，通过对素材进行提炼、简化和有效组合，将其以图标的形式呈现出来，以提高读者对素材的提取、处理及重组能力，以及图标手绘能力。从而进一步提升图标手绘能力。本书不仅全方位介绍了图标手绘设计的基本方法与技巧，还提供了一些实际工作中的经验知识。此外，每个案例都有配套视频，读者扫码即可观看。本书适合UI设计初学者和有一定UI设计经验的设计师学习或参考。

　　路铭 （网名 Rrrmandy）生于美丽的海滨城市大连。美术学习长达 10年之久，以优异的成绩毕业于上海东华大学艺术设计系（工业设计）。毕业后从事 UI 设计工作 5年以上，对 UI 设计和网站设计有自己独到的见解。曾入围 UI 中国 2016 年度优秀设计师和UI 中国 2017 年度优秀设计师。

基础篇
第 1章 App基础功能图标的制作 11
01 箭头图标设计 12
经验分享：图标绘制需注意的基本问题 13
思维拓展：如何绘制圆形 13
02 首页图标设计 14
03 收藏图标设计 15
思维拓展：线描图标的细节表现通常有哪些 167
04 扫一扫图标设计 17
经验分享：寻找素材时可采用的一些方法 18
05 帮助与反馈图标设计 19
经验分享：符号在图标设计中的语义表达和应用 20
06 评论图标设计 21
思维拓展：两个形状相似的图标如何做到差异化设计 22
07 搜索图标设计 23
思维拓展：MBE风格在图标设计中如何运用 24
08 删除图标设计 25
思维拓展：线描图标如何用线条来表现不同的质感 26
09 点赞图标设计 27
思维拓展：如何分析结构复杂的事物并将其绘制成图标 28
10 分享图标设计 29
经验分享：图标绘制时需要注意的一些规范性问题 30
11 退款图标设计 31
12 订单图标设计 32
经验分享：图形元素的变换使用 33
思维拓展：用直线表达信息内容时需注意哪些问题 33
13 个人中心图标设计 34
思维拓展：为什么图标需要在正方形范围内进行设计 35
第 2章 消费类App图标的制作 37
14 购物车图标设计 38
经验分享：线描图标绘制时需要注意的小问题 38
15 分类图标设计 39
经验分享：底边工具栏中图标的设计规范 40
思维拓展：底边工具栏图标的设计形式与风格有哪些 40
16 发现图标设计 41
思维拓展：底部工具栏中5个图标的功能 42
17 客服图标设计 43
18 定位图标设计 45
思维拓展：图标设计时可借助的平面构成原理有哪些 46
19 生鲜图标设计 47
思维拓展：App图标的风格分类有哪些 48
20 超市图标设计 49
思维拓展：影响图标设计结果和风格形成的因素有哪些 50
21 金融图标设计 51
经验分享：影响图标语义表达的因素 52
22 图书图标设计 53
经验分享：图标设计中有关平行透视的掌握 54
23 优惠券图标设计 55
经验分享：文字在图标设计中的应用 56
24 VIP会员图标设计 57
经验分享：线描图标用线条表达不同风格的方式 58
25 进口图标设计 59
经验分享：头脑风暴的流程分析 60
26 美妆图标设计 61
经验分享：图标素材的一些筛选规则 62
第3章 视频娱乐类App图标的制作 63
27 热点图标设计 64
经验分享：底边工具栏中图标设计的一些特点 65
28 播放图标设计 66
经验分享：线描图标设计中高光的不同表现方式 67
29 历史图标设计 68
经验分享：箭头图形在不同图标中的语义表达 69
30 下载图标设计 70
经验分享：界面的层级关系和重要程度对图标设计结果的影响 71
31 VIP充值图标设计 72
经验分享：影响图标图形选择和设计的因素 73
32 电影图标设计 74
33 直播图标设计 76
34 综艺图标设计 78
35 游戏图标设计 80
经验分享：简化图形的方法和技巧 81
第4章 效率类App图标的制作 83
36 素材库图标设计 84
经验分享：分析和解决问题的一些方法 85
37 工具图标设计 87
经验分享：图标设计的基本流程 88
38 快传图标设计 89
经验分享：整理图标素材的一些方法和技巧 90
39 录音图标设计 91
第5章 网站错误界面图标的制作 93
40 404网站错误界面图标设计（1） 94
经验分享：关于同一个网站的错误界面之间的逻辑关系 95
41 404网站错误界面图标设计（2） 96
经验分享：图标的五大面和阴影的表现与运用 97
42 404网站错误界面图标设计（3） 98
经验分享：关于图标的情感化设计 99
43 404网站错误界面图标设计（4） 100
第6章 功能大类图标的制作 103
44 钻石婚庆图标设计 104
45 家居摆设图标设计 106
经验分享：图标中植物图形的绘制技巧 107
46 物业服务图标设计 108
思维拓展：关于系列图标的风格化统一 109
进阶篇
第7章 iOS 系统应用图标的制作 111
47 美甲应用图标设计 112
经验分享：iOS系统下App图标的尺寸规范 113
48 播放器应用图标设计 114
经验分享：图标设计中基础图形的演变技巧 115
49 购物应用图标设计 116
50 房屋租赁应用图标设计 118
51 旅游应用图标设计 120
经验分享：圆角矩形边框的用法 121
第8章 Android系统应用图标的制作 123
52 应用市场图标设计 124
经验分享：如何选择和确定手机主题风格 125
53 音乐应用图标设计 126
经验分享：关于怀旧风格元素的运用 127
54 邮件应用图标设计 128
55 电话应用图标设计 130
56 日历应用图标设计 132
经验分享：关于数字在图标设计中的应用 133
57 设置应用图标设计 134
经验分享：关于图标中齿轮图形的画法 135
58 文件夹应用图标设计 136
思维拓展：黑白灰阴影线条的绘制规律有哪些 137
59 时钟应用图标设计 138
经验分享：如何简化生活中的图形 139
60 相机应用图标设计 140
第9章 微软系统应用图标的制作 143
61 计算机应用图标设计 144
经验分享：关于2．5D风格的运用 145
62 文件夹应用图标设计 146
经验分享：如何制作2．5D手绘图标的参考线背景 147
63 回收站应用图标设计 148
经验分享：不规则图标中各个图形的关键点的寻找 149
高阶篇
第 10章 食物类图标 151
64 生日蛋糕图标设计 152
65 菜篮子图标设计 154
经验分享：如何通过高光细节准确表现图标语义 154
66 牛排图标设计 155
67 寿司图标设计 157
68 拉面图标设计 159
第 11章 生活类图标 161
69 儿童车图标设计 162
70 水枪图标设计 164
71 榨汁机图标设计 166
72 老式唱片机图标设计 168
经验分享：如何表现出图标的年代感 169
73 笔记本式计算机图标设计 170
74 摄像机图标设计 172
经验分享：关于复杂图标的一些绘制经验 174
第 12章 交通旅游类图标 175
75 扬帆起航图标设计 176
76 跨海大桥图标设计 178
经验分享：常用的图标构图方法 179
77 度假酒店图标设计 180
经验分享：图标设计中一些常见的气氛表现需求 181
第 13章 动物类图标 183
78 大猩猩图标设计 184
79 羊驼图标设计 186
思维拓展：绘制表情图标时需要注意的关键点有哪些 187
80 西方龙图标设计 189
81 公鹿图标设计 191
82 白熊图标设计 193
思维拓展：关于黄金比例的运用 194
第 14章 学习工作类图标 195
83 作业本图标设计 196
思维拓展：增强图标节奏感的方式有哪些 197
84 教学图标设计 198
经验分享：增强图标层次感的方式有哪些 199
85 选课图标设计 200
经验分享：绘制图标之前需要考虑的几个问题 201
86 技能大赛图标设计 202
经验分享：复杂图形的分解与概括 203
87 理论与实践图标设计 204
88 实习图标设计 206
经验分享：绘制阴影时需要注意的问题 207