本书是一本围绕数字用户界面中图标设计创意思维展开的理论与实践教程。
本书分为上下两部分。
第一部分为图标基础知识,包括:第1章图标概念起源和图标设计作为数字媒体专业必需课的课程教学结构;第2章介绍了图标设计历史与现状,特征与分类,创意原则等内容;第3章是与图标设计相关的一些基于符号学,认知理论,图标语言理论的介绍;
第二部分为应用实践部分,包括:第4章图标在设计过程中的流程和创意思维阐述;第5章从形,色,肌理;动态与情感角度对图标设计要素的讲解与举例;第6章则是一个图标设计制作实践案例的演示教程。
本书旨在帮助读者从原理和实践两方面深入理解图标设计的基础理论和思维方法与流程,在内容编排上侧重让读者从了解基本概念推进到掌握思维方式,以便读者在面对图标设计时有一个较为明确的思考切入点,进而层层深入完成设计。本书适用于数字交互艺术 数字媒体 视觉传达设计 游戏美术设计等专业课程教学用书,面向图标设计学习者与爱好者,或者初学者购买的专业教学用书,亦适合作为培训班学员在图标创意思维与设计领域购买的自学辅助用书。
1.10个完整实际制作案例,按步骤演示制作过程,使读者学习掌握不同质感图标的计算机软件绘制方法。
2.大量行业大咖的优秀作品赏析,以及专业学生优秀作品与设计思路分析
3.提供多媒体课件、书中全部案例素材、以及书中案例教学视频。
作者童元园,是中国美术学院影视与动画艺术学院教师,出身于平面设计和多媒体设计专业方向,多年从事界面与交互设计,图标设计,视觉(动态)领域的教学和实践工作。专业基础扎实,经验丰富。
第 1 章绪论
1.1 图标的概念 ………………… 1
1.1.1 “图标”释意 ………………… 1
1.1.2 何为 icon ……………………… 1
1.2 图标的应用与设计 ………… 2
1.2.1 图标的应用范围与需求 ……… 2
1.2.2 图标 , 标识与标志 …………… 2
1.2.3 图标设计的应用价值 ………… 2
本章小结…………………………… 3
课后练习…………………………… 3
第 2 章图标设计概论
2.1 图标设计的发展与现状 …… 4
2.1.1 从纸媒到数媒 ………………… 4
2.1.2 图标与界面 …………………… 6
2.1.3 图标的发展历史 ……………… 7
2.1.4 图标大咖与他们的作品 ……… 16
2.2 图标的特征 ………………… 22
2.2.1 图标是信息载体 ……………… 22
2.2.2 图标是艺术形式 ……………… 23
2.2.3 图标是用户体验的一部分 …… 24
2.3图标创意原则 ……………… 25
2.3.1 识别性原则 …………………… 25
2.3.2 差异性原则 …………………… 26
2.3.3 统一性原则 …………………… 27
2.3.4 适度性原则 …………………… 28
2.3.5 艺术性与原创性原则 ………… 28
2.4 图标的分类 ………………… 30
2.4.1 按功能分类 …………………… 30
2.4.2 按风格分类 …………………… 33
2.4.3 按视图分类 …………………… 38
2.5 图标设计软件与输出 ……… 41
2.5.1 图标设计软件 ………………… 41
2.5.2 图标输出格式 ………………… 44
2.6 图标的平台与特征 ………… 45
2.6.1 不同平台的图标特征 ………… 45
2.6.2 不同平台图标的规格尺寸 …… 49
本章小结…………………………… 52
课后练习…………………………… 52
第 3 章 图标设计基础
3.1 图标与符号 ………………… 53
3.1.1 符号学对图标的解读 ………… 53
3.1.2 所指与能指 …………………… 55
3.1.3 练习 …………………………… 55
3.2图标设计中的隐喻 ………… 56
3.2.1 关于认知 ……………………… 56
3.2.2 隐喻的力量 …………………… 56
3.2.3 练习 …………………………… 57
3.3图标语言理论 ……………… 58
3.3.1 用图标说话——图形文字 …… 58
3.3.2 图标语言?的语法与规则 ……… 59
3.3.3 练习 …………………………… 60
本章小结…………………………… 60
课后练习…………………………… 60
第 4 章图标设计流程与创意
4.1 图标设计流程 ……………… 61
4.1.1 概念解读 ……………………… 61
4.1.2 概念的图形化 ………………… 62
4.1.3 手稿绘制 ……………………… 63
4.1.4 软件绘制 ……………………… 66
4.1.5 输出保存 ……………………… 67
4.2?图标作品赏析 ……………… 68
4.2.1 应用图标习作赏析 …………… 68
4.2.2 系列图标习作赏析 …………… 70
4.2.3 计算机桌面及手机平台图标习作赏析 …… 72
4.3 图标与界面的匹配 ………… 75
4.3.1 风格匹配 ……………………… 75
4.3.2 层级匹配 ……………………… 76
4.3.3 主次匹配 ……………………… 77
本章小结…………………………… 78
课后练习…………………………… 78
第 5 章? 图标设计要素精讲
5.1图标的形 …………………… 79
5.1.1 素材的收集和使用 …………… 79
5.1.2 图标信息与形 ………………… 80
5.2 形式与形式感 ……………… 84
5.2.1 何为形式感 …………………… 84
5.2.2 图标中的黄金分割 …………… 85
5.2.3 图标造型表现形式 …………… 85
5.2.4 从拟物到扁平 ………………… 88
5.3 色彩语言 …………………… 90
5.3.1 色彩的基本属性 ……………… 90
5.3.2 色彩情感与表现力 …………… 91
5.3.3 图标色彩处理手法 …………… 95
5.3.4 图标色彩运用准则 …………… 97
5.4 材质与质感 ………………… 99
5.4.1 何为材质 ……………………… 99
5.4.2 来自表面的质感 ……………… 100
5.4.3 来自构造的质感 ……………… 101
5.5图标动效 …………………… 102
5.5.1 动效的作用 …………………… 102
5.5.2 图标动效分类 ………………… 103
5.6 情感的唤起 ………………… 104
5.6.1 创作一枚有故事的图标 ……… 105
5.6.2 图标的情感作用 ……………… 105
本章小结…………………………… 109
课后练习…………………………… 109
第 6 章图标制作实例
6.1AI 图标制作实例 ………… 110
6.1.1 制作即时聊天工具图标 ……… 110
6.1.2 制作 YOGA 风格图标 ………… 115
6.1.3 制作 safari 图标 ……………… 124
6.1.4 制作日历图标 ………………… 131
6.1.5 制作针织勋章图标 …………… 140
6.2 PS 图标制作实例 ………… 148
6.2.1 制作相机图标 ………………… 148
6.2.2 制作电池图标 ………………… 160
6.2.3 制作艺术相框图标 …………… 171
6.2.4 制作龙珠图标 ………………… 177
6.2.5 制作金属旋钮图标 …………… 184
本章小结…………………………… 193
课后练习…………………………… 193
尾声
参考文献
鸣谢