Sketch 移动UI与交互设计电子书

内容提要

前言

第1章 网页UI设计入门

1.1 UI设计发展史

1.1.1 早期UI设计的风格

1.1.2 中期UI设计的兴起

1.1.3 后期UI设计的发展

1.2 网页UI设计的制作流程

1.2.1 产品调研阶段

1.2.2 UI视觉设计

1.2.3 产品技术开发

1.2.4 BUG测试

1.2.5 产品上线

1.2.6 产品迭代

1.3 UI设计的注意事项

1.3.1 图稿一致性原则

1.3.2 图稿准确性原则

1.3.3 布局合理化原则

1.3.4 操作合理性原则

1.3.5 系统响应时间原则

1.4 配色对于UI设计的影响

1.4.1 网页配色基本概念

1.4.2 网页配色基本方法

1.4.3 网页色彩搭配技巧

1.5 本章小结

第2章 初识Sketch

2.1 绘制iOS照片分享界面

2.1.1 Sketch的安装与启动

2.1.2 了解Sketch界面

2.1.3 设置Sketch的快捷键

2.1.4 添加图片、形状

2.1.5 添加文本

2.2 绘制手机登录页

2.2.1 新建和保存Sketch文件

2.2.2 使用Sketch画板

2.2.3 使用Sketch模板

2.3 本章小结

第3章 绘制线框原型

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

3.1.1 线框原型的基本概念

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

3.2 绘制注册页面线框图

3.2.1 图层面板

3.2.2 图层类型

3.2.3 图层的调整

3.3 绘制完整的线框原型图

3.3.1 计步App线框图的绘制01

3.3.2 计步App线框图的绘制02

3.4 本章小结

第4章 使用Sketch绘制图标

4.1 绘制iOS 11提醒事项图标

4.1.1 矢量工具

4.1.2 路径的使用

4.2 绘制Android照相机图标

4.2.1 使用“形状”绘制图标

4.2.2 使用“蒙板”绘制图标

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

4.3 绘制极简化的Android图标

4.3.1 Android图标设计准则

4.3.2 图标设计的三大原则

4.3.3 极简化设计

4.4 本章小结

第5章 Android UI设计

5.1 绘制Android音乐播放器界面

5.1.1 组件的编辑及使用

5.1.2 应用软件UI设计

5.1.3 移动App UI设计

5.1.4 Android系统UI设计

5.2 绘制Android信息界面

5.2.1 “文本”命令

5.2.2 “文本”检查器

5.2.3 “文本”选项

5.3 本章小结

第6章 iOS UI设计

6.1 绘制iPhone X App界面

6.1.1 iOS系统UI用户元素

6.1.2 iOS系统UI设计要求

6.1.3 iOS系统UI设计原则

6.1.4 iPhone X的App UI设计

6.2 绘制iPhone 8 App界面

6.2.1 iOS App UI设计模板

6.2.2 iOS UI设计规范

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

6.3 本章小结

第7章 PC端UI设计

7.1 绘制网站登录界面

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

7.1.2 铅笔工具和剪刀工具

7.2 绘制医学网站首页

7.2.1 PC端UI设计原则

7.2.2 PC端UI设计要点

7.2.3 PC端UI设计风格

7.3 本章小结

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

8.1 UI图像的输出

8.1.1 图标的输出

8.1.2 界面的输出

8.2 UI设计的交互

8.3 Sketch插件的安装与使用

8.4 本章小结