Sketch移动UI与交互设计视频讲解版2025|PDF|Epub|mobi|kindle电子书版本百度云盘下载

Sketch移动UI与交互设计视频讲解版PDF格式电子书版下载

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

第1章 网页UI设计入门2

1.1 UI设计发展史2

1.1.1早期UI设计的风格3

1.1.2中期UI设计的兴起3

1.1.3后期UI设计的发展5

知识点讲解——iOS系统6

知识点讲解——Android系统6

知识点讲解——Windows系统7

知识点讲解——拟物化风格设计8

知识点讲解——扁平化风格设计8

1.2网页UI设计的制作流程9

1.2.1产品调研阶段10

1.2.2UI视觉设计10

1.2.3产品技术开发11

1.2.4BUG测试12

1.2.5产品上线12

1.2.6产品迭代13

1.3UI设计的注意事项13

1.3.1图稿一致性原则13

知识点讲解——字体13

知识点讲解——表单录入14

知识点讲解——鼠标手势14

1.3.2图稿准确性原则15

1.3.3布局合理化原则16

1.3.4操作合理性原则17

1.3.5系统响应时间原则18

1.4配色对于UI设计的影响18

1.4.1网页配色基本概念18

知识点讲解——网页主色18

知识点讲解——网页背景色19

知识点讲解——网页辅色19

知识点讲解——网页点缀色20

1.4.2网页配色基本方法20

知识点讲解——根据产品内容确定网页主色20

知识点讲解——根据网页主色确定配色方案21

1.4.3网页色彩搭配技巧22

知识点讲解——同色系23

知识点讲解——邻近色23

知识点讲解——对比色25

知识点讲解——互补色25

1.5本章小结26

第2章 初识Sketch28

2.1绘制iOS照片分享界面28

2.1.1Sketch的安装与启动28

操作案例——安装与启动Sketch28

2.1.2了解Sketch界面30

知识点讲解——Sketch的主界面31

知识点讲解——菜单栏31

知识点讲解——工具栏34

操作案例——自定义工具栏34

2.1.3设置Sketch的快捷键35

知识点讲解——Sketch的快捷键35

操作案例——自定义快捷键37

2.1.4添加图片、形状39

知识点讲解——Sketch插入面板39

知识点讲解——插入图片40

知识点讲解——插入形状41

2.1.5添加文本42

知识点讲解——插入文本43

2.2绘制手机登录页45

2.2.1新建和保存Sketch文件45

知识点讲解——文件的新建和保存45

操作案例——设置Sketch的标尺47

2.2.2使用Sketch画板48

知识点讲解——画板预设48

知识点讲解——画板检查器50

2.2.3使用Sketch模板51

知识点讲解——“iOS用户界面设计”模板52

2.3本章小结56

第3章 绘制线框原型58

3.1绘制手机信息界面线框图58

3.1.1线框原型的基本概念58

知识点讲解——线框原型概念60

知识点讲解——线框原型视觉特性61

3.1.2绘制线框原型的注意事项61

知识点讲解——巧用明暗对比63

知识点讲解——不使用截图和颜色64

知识点讲解——标记第一屏高度64

知识点讲解——合理的布局和间距65

3.2绘制注册页面线框图65

3.2.1图层面板66

知识点讲解——图层面板简述67

操作案例——添加和编辑图层68

知识点讲解——选择图层69

操作案例——移动图层70

3.2.2图层类型71

知识点讲解——图层类型详解73

操作案例——变换大小75

3.2.3图层的调整75

操作案例——新建、重命名、复制和删除页面78

知识点讲解——复制、剪切和粘贴图层79

知识点讲解——图层组的检查器80

3.3绘制完整的线框原型图83

3.3.1计步App线框图的绘制0184

3.3.2计步App线框图的绘制0287

3.4本章小结91

第4章 使用Sketch绘制图标93

4.1绘制iOS11提醒事项图标93

4.1.1矢量工具93

知识点讲解——矢量图形（形状）95

知识点讲解——点模式95

知识点讲解——编辑矢量图形96

操操作案例——矢量工具绘制箭头图标97

4.1.2路径的使用98

知识点讲解——路径100

4.2绘制Android照相机图标101

4.2.1使用“形状”绘制图标102

操作案例——使用布尔运算绘制照相机图标106

知识点讲解——布尔运算107

4.2.2使用“蒙板”绘制图标108

知识点讲解——蒙板命令109

操作案例——使用透明度蒙板制作简易图标110

4.2.3添加阴影效果为图标添加质感112

知识点讲解——图标基本属性113

4.3绘制极简化的Android图标116

4.3.1Android图标设计准则116

知识点讲解——图标设计准则118

4.3.2图标设计的三大原则120

知识点讲解——三大原则122

4.3.3极简化设计123

知识点讲解——极简化设计风格126

操作案例——绘制记事本图标127

4.4本章小结128

第5章 Android UI设计130

5.1绘制Android音乐播放器界面130

5.1.1组件的编辑及使用130

知识点讲解——创建组件133

知识点讲解——更换文本133

知识点讲解——管理组件134

操作案例——使用组件工具绘制导航栏135

5.1.2应用软件UI设计136

知识点讲解——什么是应用软件UI设计137

知识点讲解——应用软件UI设计规范138

知识点讲解——软件启动UI设计139

5.1.3移动App UI设计140

知识点讲解——什么是App142

知识点讲解——移动UI的设计趋势143

知识点讲解——移动UI和平面UI的区别145

5.1.4Android系统UI设计146

知识点讲解——Android系统文字规范设计148

操作案例——绘制返回或菜单按钮149

知识点讲解——Android系统UI设计特色150

5.2绘制Android信息界面151

5.2.1“文本”命令152

知识点讲解——添加文本154

知识点讲解——文本框154

5.2.2“文本”检查器155

知识点讲解——文本的编辑157

知识点讲解——共享样式159

操作案例——使用共享样式绘制界面160

5.2.3“文本”选项161

知识点讲解——文本路径163

知识点讲解——文本转换轮廓164

操作案例——转化为轮廓绘制界面元素164

知识点讲解——导出文字165

知识点讲解——应用样式166

知识点讲解——混合模式168

5.3本章小结169

第6章 iOS UI设计171

6.1绘制iPhone X App界面171

6.1.1iOS系统UI用户元素171

知识点讲解——顶部导航栏173

知识点讲解——标签栏和搜索栏173

操作案例——绘制iPhone X启动界面174

知识点讲解——表格视图176

6.1.2iOS系统UI设计要求177

知识点讲解——确保程序可行178

知识点讲解——确保App可以在iPhone和iPad中通用178

知识点讲解——基于Web网页重新设计179

6.1.3iOS系统UI设计原则179

知识点讲解——美观性182

知识点讲解——一致性183

知识点讲解——控制可行性184

知识点讲解——及时性184

知识点讲解——暗喻性184

知识点讲解——自主性185

6.1.4iPhone X的App UI设计185

知识点讲解——编辑位图188

知识点讲解——iPhone X的屏幕尺寸190

知识点讲解——iPhone X的布局190

6.2绘制iPhone 8 App界面191

6.2.1iOS App UI设计模板192

知识点讲解——iPhone 8的组件193

操作案例——绘制iPhone系统视频播放界面194

知识点讲解——iPhone X的组件195

6.2.2iOS UI设计规范195

知识点讲解——界面尺寸198

知识点讲解——图标尺寸198

知识点讲解——内部设计199

6.2.3移动App设计过程中的要点199

知识点讲解——App UI设计流程202

操作案例——绘制系统发生错误界面203

知识点讲解——App UI配色原则204

6.3本章小结206

第7章 PC端UI设计208

7.1绘制网站登录界面208

7.1.1PC端和移动端UI设计的区别208

知识点讲解——网页设计PC端和移动端的区别211

7.1.2铅笔工具和剪刀工具213

知识点讲解——铅笔工具215

知识点讲解——剪刀工具216

操作案例——设计制作设置按钮①216

知识点讲解——旋转复制217

设置按钮②218

知识点讲解——变形工具219

7.2绘制医学网站首页219

7.2.1PC端UI设计原则220

知识点讲解——以用户为中心223

知识点讲解——视觉美观224

知识点讲解——主题明确224

知识点讲解——内容与形式统一226

知识点讲解——有机整体227

操作案例——绘制“休闲空间”启动页①227

7.2.2PC端UI设计要点229

知识点讲解——设计与技术相结合231

知识点讲解——视觉导向性232

7.2.3PC端UI设计风格233

知识点讲解——大众化设计风格234

知识点讲解——个性化设计风格234

操作案例——绘制“休闲空间”启动页②235

7.3本章小结236

第8章 UI的输出与交互设计238

8.1UI图像的输出238

8.1.1图标的输出238

知识点讲解——适配设备238

知识点讲解——导出图层240

知识点讲解——导出和切片241

8.1.2界面的输出241

知识点讲解——切片工具242

操作案例——为切片重命名245

8.2UI设计的交互245

知识点讲解——了解移动设备的手势245

知识点讲解——移动交互动效设计的注意事项248

知识点讲解——使用Xcode模拟交互效果249

8.3Sketch插件的安装与使用250

知识点讲解——实用的插件251

8.4本章小结252