UI设计必修课 Sketch移动界面设计教程 全彩版2025|PDF|Epub|mobi|kindle电子书版本百度云盘下载

UI设计必修课 Sketch移动界面设计教程 全彩版PDF格式电子书版下载

注意：本站所有压缩包均有解压码： 点击下载压缩包解压工具

Chapter 01 移动UI设计师入门2

1.1 移动UI设计的发展2

1.1.1 早期设计保证软件可用性2

1.1.2 中期设计保证软件易用性2

1.1.3 后期设计保证软件实用性4

1.1.4 未来UI设计的展望5

1.2 移动UI设计师的工作流程6

1.3 iOS和Android设计特色7

1.3.1 iOS的设计特色7

1.3.2 Android的设计特色11

1.4 移动UI设计师应了解的基本常识14

1.4.1 移动UI设计中用到的单位14

1.4.2 iOS的界面设计规范16

1.4.3 Android的界面设计规范18

1.4.4 为触控而设计20

1.4.5 从iOS10的特点看设计趋势20

1.5 专家支招22

1.5.1 移动UI设计师常用的设计工具有哪些？22

1.5.2 什么是屏幕密度？23

1.6 本章小结23

Chapter 02 初识Sketch26

2.1 Sketch的安装和启动26

2.1.1 实战—安装Sketch26

2.1.2 实战——启动Sketch27

2.2 Sketch的欢迎介绍28

2.3 Sketch的主界面29

2.3.1 菜单栏29

2.3.2 工具栏31

2.3.3 工具介绍33

2.3.4 画布33

2.3.5 检查器35

2.3.6 图层36

2.3.7 画板36

2.3.8 蒙版37

2.3.9 布尔运算37

2.3.10 组件与共享样式37

2.4 Sketch的快捷键38

2.4.1 Sketch的快捷键列表39

2.4.2 实战——自定义快捷键43

2.5 Sketch的系统偏好设置44

2.5.1 通用选项卡45

2.5.2 画布选项卡46

2.5.3 图层选项卡47

2.5.4 插件选项卡48

2.5.5 预设选项卡49

2.5.6 Cloud选项卡49

2.6 Sketch的标尺、参考线和网格49

2.6.1 标尺49

2.6.2 参考线50

2.6.3 网格51

2.7 Sketch的常见问题53

2.7.1 Sketch是否支持Windows系统？53

2.7.2 Sketch能否替代Photoshop？53

2.7.3 Sketch是否有汉化版53

2.7.4 Sketch如何升级？53

2.7.5 Sketch价格能不能优惠？54

2.8 专家支招54

2.8.1 Sketch怎么兼容低版本文件？54

2.8.2 Sketch是否有类似Axure的组件库的功能？55

2.9 本章小结55

Chapter 03 从线框原型开始58

3.1 线框原型的基本概念58

3.2 绘制线框原型的注意事项59

3.2.1 巧用明暗对比59

3.2.2 不使用截图和颜色60

3.2.3 标记第一屏高度60

3.2.4 合理的布局和间距61

3.3 Sketch绘制线框原型61

3.3.1 文件的新建和保存61

3.3.2 回到Sketch文档的历史版本63

3.3.3 画板预设64

3.3.4 画板检查器65

3.3.5 图层面板66

3.3.6 关于模板70

3.3.7 图层组的检查器71

3.3.8 形状图层的检查器73

3.3.9 文字图层的检查器76

3.4 使用Sketch绘制线框原型78

3.4.1 实战——计步App线框图的绘制78

3.4.2 实战——内容列表页线框图的绘制82

3.5 完整线框原型的绘制86

3.5.1 实战——注册页1线框图的绘制86

3.5.2 实战——注册页2线框图的绘制90

3.5.3 实战——注册页3线框图的绘制92

3.5.4 实战——注册页4线框图的绘制94

3.6 绘制线框原型的思考95

3.7 专家支招96

3.7.1 画好App线框图的要点有哪些？96

3.7.2 线框原型的优势有哪些？96

3.8 本章小结97

Chapter 04 使用Sketch设计图标100

4.1 图标的设计准则100

4.1.1 图标设计的必要性100

4.1.2 了解图标的属性102

4.1.3 不同系统中的图标格式105

4.1.4 不同系统图标的更换方法105

4.2 图标集的制作过程109

4.2.1 创建制作清单109

4.2.2 设计草图109

4.2.3 数字呈现110

4.2.4 确定最终效果110

4.2.5 命名并导出111

4.3 使用Sketch插入面板111

4.3.1 插入矢量111

4.3.2 插入铅笔115

4.3.3 插入形状116

4.3.4 插入文本120

4.3.5 插入图片121

4.4 图形的布尔运算121

4.5 实战——绘制iOS App图标124

4.6 实战——绘制音乐应用图标128

4.7 图标的源文件格式132

4.8 专家支招133

4.8.1 iOS系统中图标的尺寸133

4.8.2 如何获得专业图标134

4.9 本章小结134

Chapter 05 使用Sketch设计移动UI136

5.1 移动UI的设计原则136

5.1.1 视觉一致性原则136

5.1.2 视觉简易性原则137

5.1.3 从为用户的考虑角度出发137

5.2 移动界面的色彩搭配与视觉效果138

5.2.1 冷暖色调的对比138

5.2.2 色彩的意向138

5.2.3 色彩的搭配技巧139

5.2.4 App界面配色原则140

5.2.5 App UI设计的用色规范142

5.3 iOS应用界面设计规范142

5.3.1 Sketch的iOS UI模板143

5.3.2 模板使用的注意事项144

5.4 安卓界面及Material Design设计规范146

5.5 移动界面中的色彩应用147

5.5.1 Sketch颜色面板的使用148

5.6 文字的创建与编辑157

5.6.1 文本的添加158

5.6.2 文本的编辑158

5.6.3 文本路径160

5.6.4 文本转换轮廓160

5.7 使用共享样式161

5.8 文字的导出163

5.9 实战——绘制iOS音乐播放界面164

5.10 实战——绘制iOS社交App界面168

5.11 实战——绘制iOS支付App界面172

5.12 专家支招176

5.12.1 移动界面中的文字使用技巧176

5.12.2 移动界面中的色彩选择177

5.13 本章小结178

Chapter 06 使用Sketch设计PC端网站UI180

6.1 网页设计PC端和移动端的区别180

6.1.1 屏幕尺寸不同180

6.1.2 操作方式不同180

6.1.3 网络环境不同181

6.1.4 传感器不同181

6.1.5 使用场景和使用时间的不同181

6.1.6 软件迭代时间和更新频率不同181

6.1.7 功能设计上的区别181

6.2 扁平化设计在UI设计中的应用182

6.2.1 图标和徽章182

6.2.2 圆角和折角183

6.2.3 标签和条纹184

6.2.4 装饰元素185

6.3 编辑绘制的图形186

6.3.1 分组和取消分组186

6.3.2 编辑和变换图形187

6.3.3 旋转图形187

6.3.4 蒙版189

6.3.5 剪刀与描边宽度192

6.4 位图的编辑192

6.4.1 编辑位图193

6.4.2 色彩校正195

6.5 应用样式195

6.5.1 阴影195

6.5.2 内阴影196

6.5.3 模糊196

6.6 混合模式198

6.7 组件199

6.7.1 创建组件200

6.7.2 覆盖文本200

6.7.3 管理组件201

6.8 实战——绘制企业PC端网站界面202

6.9 实战——绘制企业PC端网站界面205

6.10 专家支招215

6.10.1 理解以用户为中心215

6.10.2 界面设计中的内容与形式统一215

6.11 本章小结216

Chapter 07 UI的输出与交互设计218

7.1 适配多分辨率移动界面218

7.1.1 适配安卓设备218

7.1.2 适配iOS设备218

7.1.3 使用自适应设计插件218

7.2 实现在设备上实时预览219

7.3 分享设计稿219

7.4 交付给开发人员的文件220

7.5 使用Sketch切图221

7.5.1 切片图层检查器223

7.5.2 点九切图224

7.6 使用Sketch标注227

7.7 设计移动交互动效230

7.7.1 了解移动设备的手势230

7.7.2 移动交互动效设计的注意事项233

7.7.3 常见的动效制作软件234

7.8 使用Sketch插件237

7.8.1 插件的安装237

7.8.2 实用的插件238

7.9 专家支招240

7.9.1 如何对移动界面进行标注240

7.9.2 常见角度动画效果241

7.10 本章小结242