Sketch交互设计之美：从零基础到完整项目实现

　　交互设计师需要一款简单、高效的矢量交互设计工具，本书以Sketch、Principle软件的使用作为基础，以完整项目实践为故事线，结合交互设计方法论的思考，让广大交互设计师、Sketch软件爱好者深入浅出地掌握软件使用方法，并快速应用到实战项目中。　《Sketch交互设计之美：从零基础到完整项目实现》共分为8章，1章为初识Sketch，主要介绍Sketch软件的特性和应用场景，通过该章的介绍，让读者初步了解软件的安装和使用方法；第2章为快速入门，结合具体的案例学习，让读者学会Sketch直线、钢笔、矩形等基本工具的使用，同时，对交互设计有一定的认知；第3章为基础运用，详细介绍界面设计的理论，并让读者掌握界面中图像、图标等元素的处理方法；第4章为高级运用，深入介绍Sketch核心高级功能Symbol的使用，剖析Sketch能成为交互设计工具的原理；第5章为团队协作，帮助读者利用Sketch解决团队协作的难题，优化团队成员的协作模式；第6章为交付输出，为读者展示如何使用Sketch输出高质量的交互设计和视觉设计输出物；第7章为动效设计，将Sketch与Principle结合起来，为用户创造愉悦的动效体验；第8章为完整后台设计实现，将完整呈现一个管理后台项目的设计过程，帮助读者总结提炼软件使用、交互水平提高的学习经验。　本书适合零基础的Sketch爱好者，尤其是想在交互设计方向发展的人员，也可以作为产品经理、交互设计师、视觉设计师、用户体验设计师等设计从业人员的工具使用指南。

　　夜雨，浙大网新集团高级交互设计师，爱交互网站创始人，有多年产品设计落地经验，擅长产品策划、交互设计、用户研究，对Sketch设计有深入的研究，人人都是产品经理网站人气作者，简书互联网优秀作者。

目 录

第1章初识Sketch

1.1拥抱变化，交互设计师的蜕变之旅
1.2Sketch简介
1.2.1Sketch是什么
1.2.2Sketch的优势
1.2.3Sketch对于团队特别是交互设计师的价值
1.2.4Sketch的应用前景
1.2.5Sketch和Photoshop对比
1.3Sketch获取
1.3.1Sketch下载
1.3.2Sketch安装
1.3.3Sketch激活
1.3.4Sketch定价策略
1.4Sketch界面介绍
1.4.1菜单栏
1.4.2工具栏
1.4.3页面
1.4.4图层
1.4.5画布
1.4.6检查器
1.5Sketch上手试用
1.6团队项目介绍
1.6.1项目背景说明
1.6.2项目功能需求
1.6.3项目产品架构
知识拓展
动脑思考
动手操作
第2章快速入门

2.1交互设计入门
2.1.1认识交互设计
2.1.2认识交互设计师
2.1.3交互设计师需要具备的素质
2.1.4交互设计师的职责
2.1.5交互设计师的专业背景要求
2.1.6交互设计师需要的知识体系
2.1.7交互设计师常用的工具
☆重点2.1.8了解交互设计流程
2.2明确目标和产出物
2.2.1流程图
2.2.2低、高保真原型
2.2.3交互说明
2.2.4视觉规范
2.2.5视觉标注稿
2.2.6规范切图
2.2.7动效参数
2.3学习基本工具使用
☆重点2.3.1线条工具
☆重点2.3.2几何工具
☆重点2.3.3文字工具
2.4学习高级工具使用
2.4.1剪刀工具
2.4.2变形工具
2.5学习其他工具使用
2.5.1插入类工具
2.5.2组织类工具
2.5.3编辑类工具
2.5.4辅助类工具
2.6学会版本管理
2.6.1使用多个Sketch文件管理
2.6.2使用Sketch自动保存历史
版本
2.7了解原型尺寸和命名规范
☆重点2.7.1原型尺寸
2.7.2命名规范
2.8掌握交互设计方法论
2.8.1交互设计方法论的概念
2.8.2交互设计方法论——5W2H
2.8.3其他交互设计方法论
知识拓展
实战教学
动脑思考
动手操作
第3章基础运用

3.1创作空间
3.1.1画布
☆重点3.1.2Artboard（画板）
☆重点3.1.3栅格布局
3.2框架设计
3.2.1发散思维
3.2.2人物角色
3.2.3故事板
3.2.4流程设计
3.2.5信息架构
3.3界面设计
3.3.1界面设计原则
3.3.2界面设计理论
3.3.3界面设计实践
3.4图像处理
3.4.1图像导入
☆重点3.4.2图像处理方式
3.4.3Mask（蒙版）处理
3.5图标设计
☆重点3.5.1认识图标
3.5.2图标绘制规范
☆重点3.5.3图标绘制
3.5.4图标引用
3.6测距和对齐
3.6.1测距
3.6.2对齐
知识拓展
实战教学
动脑思考
动手操作
第4章高级运用

4.1快速原型设计
4.1.1快速复制
4.1.2批量复制
4.1.3一级页面设计
☆重点4.2归类整理
4.2.1图层整理
4.2.2页面整理
4.2.3图层查找
4.3原型演示
4.3.1SketchMirror
4.3.2SketchMirrorforiPhone
4.3.3需求验证
4.3.4二级页面设计
4.4Symbol（符号）
☆重点4.4.1Symbol的介绍及应用
场景
☆重点4.4.2Symbol基础教程
☆重点☆难点4.4.3Symbol
嵌套教程
☆重点☆难点4.4.4夜视Symbol库
制作
4.5StyledText（样式库）
4.5.1StyledText的概念
4.5.2TextStyle（字体样式）
4.5.3ShareStyle（共享样式）
4.5.4夜视项目样式库
4.6细节设计
☆重点4.6.1交互边界
☆重点4.6.2特殊状态
☆重点4.6.3场景设计
4.6.4首页及播放页设计
知识拓展
实战教学
动脑思考
动手操作
第5章团队协作

5.1Sketch和团队协作
5.1.1团队协作基础
5.1.2Sketch协作流程
5.2使用Libraries减少重复劳作
☆重点☆新功能5.2.1Libraries
介绍
☆重点5.2.2Libraries制作和
导入
☆重点5.2.3Libraries使用和
更新
☆重点5.2.4Libraries云协作
5.3使用坚果云构建协作环境
5.3.1构建前的准备工作
5.3.2创建团队文件夹
5.3.3设置本地同步文件夹
5.3.4查看历史版本
动脑思考
动手操作
第6章交付输出

6.1交互设计输出物
6.1.1交互方案和交互原型
☆重点6.1.2交互说明
☆重点6.1.3交互规范
6.2视觉设计输出物
6.2.1视觉风格探索
6.2.2视觉页面
☆重点6.2.3视觉规范
☆重点6.2.4视觉标注
☆重点6.2.5切图资源
知识拓展
实战教学
动脑思考
动手操作
第7章动效设计Principle

7.1需要动效设计的原因
☆重点7.1.1为用户创造愉悦的
体验
7.1.2验证心中的想法和可行性
7.1.3与开发工程师沟通动态效果
7.2选择Principle的原因
7.2.1Principle简介
7.2.2Principle的优势
7.2.3Principle的获取、安装与
激活
7.3Principle初体验
7.3.1初识界面
☆重点7.3.2交互形态
☆重点7.3.3事件
☆重点7.3.4动画
7.4Principle制作原型
7.4.1准备工作
7.4.2制作翻页效果
7.4.3制作转场效果
7.4.4制作滚动效果
7.4.5原型演示
7.5Principle制作动画
☆重点☆难点7.5.1动画构思
☆重点7.5.2动画制作
☆重点☆难点7.5.3交付开发
实现
实战教学
动脑思考
动手操作
第8章完整后台设计实现

8.1后台设计目标
8.1.1业务功能
8.1.2设计目标
8.2后台框架设计
8.2.1角色场景
8.2.2权限设计
8.2.3流程设计
8.3后台界面设计
8.3.1菜单导航设计
8.3.2内容列表设计
8.3.3流程页面设计
8.3.4页面细节设计
8.3.5创建最小化Symbol库
8.4后台交互说明
8.4.1学会讲故事
8.4.2时刻警惕权限和安全
8.5学习建议
8.5.1Sketch学习建议
8.5.2交互设计学习建议
结语
参考文献