UI界面设计

第一部分 知识准备 第1章 UI界面设计相关知识 1 1.1 UI界面设计 1 1.1.1 UI设计的概念 1 1.1.2  UI设计的流程 2 1.1.3  UI界面设计的规范 4 1.1.4 UI界面设计常用工具 5 1.2 UI界面设计与用户体验 6 1.2.1 UI界面设计与用户体验 6 1.2.2 影响用户体验的因素 7 1.3 知识拓展 8 1.3.1 Photoshop CC入门 8 1.3.2 Photoshop CC精彩新功能 9 1.3.3 图像常用基本操作 11 1.3.4 选区的基本操作 14 1.3.5 画笔工具的应用 16 本章小结 19 第2章 UI界面设计的常用方法 20 2.1 UI界面设计中的设计方法 20 2.1.1 方法与方法论 20 2.1.2 认识论和设计方法 20 2.1.3 UI界面设计中实用的设计方法 21 2.2 UI界面设计中实用的构成方法 23 2.2.1 什么是构成 23 2.2.2 形式美法则 23 2.2.3 构成的思维方式 29 2.3 UI界面设计中实用的色彩搭配技巧 32 2.3.1 色彩的基本理论 33 2.3.2 色彩搭配法则 35 2.4 知识拓展――UI界面设计风格 46 2.4.1 扁平化 46 2.4.2 拟物化 48 2.4.3 卡通化 48 2.5 能力拓展――Photoshop CC中图层的应用 49 2.5.1 图层类别 49 2.5.2 图层的基础操作 49 2.5.3 图层样式 50 2.5.4 混合模式 51 2.5.5 Photoshop中的蒙版 52 2.5.6 渐变工具 56 本章小结 58 第二部分 牛刀小试 第3章 各种UI界面常用元素制作 59 3.1 常用图形制作 59 3.1.1 圆形、圆角 59 3.1.2 多边形 60 3.1.3 直线 60 3.2 常见控件制作 60 3.2.1 按钮的制作 60 3.2.2 下拉选择框的制作 62 3.2.3 滑动条的制作 64 3.2.4 TAB切换块的制作 66 3.2.5 气泡对话框的制作 68 3.3 创意图标设计与制作 70 3.3.1 图标设计技巧 70 3.3.2 利用Photoshop打造拟物化设计风格图标 74 3.3.3 利用Photoshop打造四种扁平化设计风格图标 79 3.4 知识拓展 83 3.4.1 图标设计的趋势――响应式图标 83 3.4.2 路径与形状工具 83 3.4.3 擦除类工具 86 3.5 能力拓展――简单网页设计制作实例 87 本章小结 93 第三部分 UI界面设计典型实战 第4章 操作型APP――计算器界面设计 94 4.1  界面设计任务分析 94 4.2  学习目标 95 4.3  制作步骤详解 95 4.3.1 新建文件，确定尺寸规范 95 4.3.2 制作背景 96 4.3.3 制作状态栏区域 96 4.3.4 制作显示区细节 96 4.3.5 制作功能键区和数字键区细节 97 4.3.6 定稿输出有效的设计方案 97 4.4 知识拓展 98 4.4.1 图层组 98 4.4.2 APP界面布局设计 99 4.4.3 Photoshop外部素材的载入使用 100 4.5 能力拓展 100 4.5.1 拓展练习：水平仪UI界面设计 100 4.5.2 拓展练习：拼拼乐APP界面设计 101 4.5.3 独立实践 105 本章小结 105 第5章 实用型软件――播放器界面设计 106 5.1  界面设计任务分析 106 5.2  学习目标 106 5.3 制作步骤详解 106 5.3.1  创建播放器 106 5.3.2  播放器专辑信息部分制作 108 5.3.3  播放器播放按钮部分制作 112 5.4 知识拓展 119 5.4.1 色彩的搭配 119 5.4.2 Photoshop中的色彩调整 120 5.5 能力拓展 120 5.5.1 拓展练习：设计制作DVD光盘图标 120 5.5.2 拓展练习：设计制作金属按钮 121 5.5.3 拓展练习：为黑白照片调色 122 5.5.4 独立实践 125 本章小结 125 第6章 手机主题UI界面设计 126 6.1 界面设计任务分析 126 6.2 学习目标 127 6.3 制作步骤详解 127 6.3.1 主体形象设计制作 127 6.3.2 手机壁纸设计制作 129 6.3.3 锁屏设计制作 130 6.3.4 天气插件制作 131 6.3.5 桌面图标制作 137 6.4 知识拓展 147 6.4.1 手机界面设计原则 147 6.4.2 手机常用尺寸与图标格式 148 6.5 能力拓展 149 6.5.1 拓展练习：ico图标设计制作 149 6.5.2 拓展练习：伪扁平手机主题UI界面设计 150 6.5.3 独立实践 152 本章小结 152 第7章 Web界面设计实例――儿童节专题网页设计 153 7.1  界面设计任务分析 153 7.2  学习目标 154 7.3  制作步骤详解 154 7.3.1 设计制作头部主图 154 7.3.2 设计制作装饰图形 167 7.3.3 设计制作栏目“书籍系列” 173 7.3.4 设计制作栏目“服饰系列” 181 7.3.5 设计制作栏目“玩具系列” 184 7.3.6 设计制作底部区域 187 7.4 知识拓展 189 7.4.1 网站界面设计基本原则 189 7.4.2 网站界面的功能美与形式美 189 7.5 能力拓展 190 7.5.1 拓展练习：照射在透明玻璃窗上效果 190 7.5.2 拓展练习：Photoshop打造倾盆大雨效果 191 7.5.3 拓展练习：Photoshop打造电子商务网页界面 192 7.5.4 全局观念的强化 206 7.5.5 独立实践 206 本章小结 206 参考文献 207

张小玲，高级界面设计师。擅长艺术设计。在界面设计方面，她有系统的理论基础，并且已经在多年的实践中得以应用和验证。曾任正大恒领网络科技有限公司美术总监，项目经验丰富。现任职于重庆工程学院，负责和参与多项教研教改项目研究，为界面设计领域培养了诸多专业人才。

本书按照高职高专计算机多媒体技术专业教学大纲的要求编写，是一本全面的UI界面设计与制作的基础教程。本书以培养学生的UI设计理念、方法为基本，结合Photoshop软件中常用的各种工具和方法，有针对性地剖析设计制作的实施策略与过程，以训练和提高学生UI界面设计制作技能。 全书内容共7章，分为三个部分。第一部分是UI界面设计相关知识的介绍，包括什么是UI界面设计、UI界面设计的常用方法和设计工具、UI设计与用户体验的关系等基本知识。第二部分是各种UI界面常用元素的制作。第三部分是UI界面设计典型实战，通过4个递进的设计实例，从任务分析、功能定位、制作步骤入手对界面设计制作进行全过程讲解。 本书结构合理、内容翔实、图文并茂，在项目中讲述Photoshop CC的要点和难点，将艺术设计的知识与技巧融入其中，引导读者进行思考及软件操作实践，提升读者的审美、审艺能力。

定价：为出版社全国统一定价；

文轩价：为商品的销售价，是您最终决定是否购买商品的依据；受系统缓存影响，最终价格以商品放入购物车后显示的价格为准；

新广告法规定所有页面信息中不得出现绝对化用词和功能性用词。

本店非常支持新广告法，但为了不影响消费者正常购买，页面明显区域本店已在排查修改，对于不明显区域也将会逐步排查并修改，我们此郑重声明：本店所有页面上的绝对化用词与功能性用词在此声明全部失效，不作为赔付理由。涉及“教育部声明”中的商品，均不代表教育部指定、推荐的具体版本，仅代表该商品的内容为指定、推荐书目。因极限用词引起的任何形式的商品赔付，本店不接收且不妥协。希望消费者理解并欢迎联系客服帮助完善，也请职业打假人士高抬贵手。