ca1840
需要先申明的一点，本文不是一篇sketch的入门教程，如果对sketch一点不熟悉的话，建议先看一遍sketch用户手册。
一年前写过一篇文章：如何用Axure快速制作APP交互原型，相对来说还算比较受欢迎。从文章的标题也能看出两点重要信息：工具是「Axure」，主要特点是「快速」。
Axure作为一个老牌的设计工具，算是产品经理入门必备，而最近几年火起来的一个设计软件——sketch，则异军突起，逐渐成为了互联网从业人员的新宠，不仅仅可以拿来画交互，也是UI设计的利器。所以，用sketch产出的内容有一个很大的特点就是颜值高，这篇文章就尝试讲解一下如何用「sketch」制作「精致」的APP原型，当然只要使用熟练，速度也是足够快的。
1. sketch自带模板
Sketch做的非常人性化的一点，就是自带了很多模板，而且用来画交互完全够用，省去了从网上各种非正规渠道找资源的麻烦，如果你是sketch的老用户，而不知道自带模板功能的话，真的是要面壁思过了。
2. APP原型样式
知道利用sketch自带的APP界面模板之后，我们首先讨论一下APP原型采用哪个样式比较合适。
2.1 待选样式
在Sketch中插入画板的时候，软件会提供一些常用设备的尺寸供用户选择，我们需要用到的是iPhone6（375×667px），为什么一定要采用iPhone6呢？非常重要的一点，是因为上边提到的sketch自带模板，iOS界面的所有控件大小全部是以iPhone6尺寸为基准的，拿过来可以直接使用。如果采用了plus或se的手机型号尺寸，控件大小和画板大小标准不一致，还得需要人为调整，异常的繁琐。
看上去，整齐划一、非常美观，所以这种样式比较适合从全局的角度来展示APP所有页面的交互样式，但并不适用于作为交付物，提供给开发和测试同学在实际工作中使用，主要的问题有以下两点：
标注信息无法体现，标注信息包括了“页面之间的跳转关系”和“相关交互逻辑的说明性文案”。在sketch内，由于位于画板之外的元素无法显示并导出，如上，即以一个iPhone6页面为一个画板，造成画板之外的“箭头”或“文字”就无法派上用场；
功能点结构化的展示比较欠缺，上面也提到了，这种形式比较适合进行全局展现，但在实际项目运作中，会拆分成多个相关的独立功能点，并且每个主要功能点，又要分为正常主干流程和多个异常分支流程，同时对于分支流程来说，不一定需要整个页面做信息呈现，很可能局部模块展示就足够了。
针对第1个问题，其实也有专门用来做标注的sketch插件，比如Notebook，直接用插件做标注虽然方便，但是格式太受限，非常的不灵活，尤其是经常需要修改时候，所以在我试用了两次之后，最终还是放弃了。
2.2 采用样式
否定了上边提到的APP原型样式后，我们又该如何通过其它的样式来解决遇到的一些问题呢？
在sketch中，是以画板或切片为单位进行导出的，所以我们可以根据需要，自由把握一个画板的大小，而不是局限于以一个iPhone6页面为一个画板。比如如果需要全局展示APP整体样式，则可以将所有APP页面放在一个画板中，如果只是讲解某个具体的功能点，则可以只将涉及到的APP页面放在一个画板中。
那每个具体的APP页面该怎么体现呢，很简单，通过一个375×667px 的矩形框来表示一个常规的APP页，或许你已经注意到了，这个尺寸正好是sketch默认的iPhone6画板的大小，采用这个尺寸矩形的好处就是，所有自带的控件仍可以继续无缝的使用。
这样做的另一个好处，APP页面之外可以体现更多的元素，比如表示跳转关系的“箭头”，比如解释性“文字”，比如表示分支流程的“局部模块”
除了系统层面的“状态栏”、“导航栏”、“键盘”等组件，针对特定的项目，自己也可以将常用的某个模块创建为组件，比如电商项目中常用的商品模板，可以创建“商品/横排”“商品/竖排”两种形式的组件，从而可以不断的快速复用。
并且有个命名的小技巧可以参考一下，通过符号“/ ”进行名称的层级划分，sketch会自动将“/”符号之前名称相同的组件归为一组，分门别类之后，我们在插入组件的时候就能快速定位，尤其是组件比较多的时候。
综上，我们可以直接复制sketch中自带的控件（以组件形式存在），也可以自己把常用的某些模块创建为组件，这些就组合成了针对某个项目的特定组件库，在画交互的时候直接可以复用，并且还支持文案、不透明度等自定义，效率和美观性都得到了保障。
3.2 文本样式
“组件”功能的核心使用场景就是某些元素经常需要复用在不同地方，字体和图层也如此。在一个项目的交互稿中，使用到的样式种类是有限的，如果对每个元素如果都单独维护，会比较繁琐，sketch中的“文本样式”和“图层样式”功能就完美解决了这个问题，针对文字和图形元素，在“检查器”中选择需要共享的样式，能够快速的将颜色、阴影、不透明度等样式配置套用过来，而不再需要做重复性的样式配置，非常的便捷。
可以根据需要，整理一套自己常用的样式规范，比如”正文常规性文字”，统一采用“微软雅黑，色值#ffffff，字号18pt”的样式，在之前提到的“页面注释说明”，统一采用“微软雅黑，色值#5CD600，字号20pt”…….将规范维护成共享的样式文本，在需要的地方直接复用即可，不仅仅提高了效率，并且保证了交互稿统一美观性。
熟练使用“组件”和“文本样式”，不仅仅是在创建的时候能提高效率，尤其是在涉及修改时，你会发现只要修改一处，全局同步调整完成，那种快速带来的痛快感更加明显。当然效率的提升是一方面，通过不断复用标准精致的控件，采用统一规范的文本样式，也保障了交互稿整体的美观性。
4. 原型文件维护和导出
原型设计的一些思路说的差不多了，那不同项目以及不同版本的原型该怎么维护比较合适，将原型同步给团队成员的方式有哪些呢？
4.1 原型文件维护
需要注意的一点是，上边提到的“组件”和“文本样式”，它们均保存在某一文件中，并不能在不同文件中共享，并且这两个东西是跟项目有比较大的相关性，所以我比较倾向于一个项目维护一个sketch文件，比如“某某应用APP端原型”文件。
以一个页面（或称为画布）呈现一个版本的原型内容，然后在某个页面/版本内，以一个画板呈现一个功能点模块的原型内容。当然，主体思路是这样的，特殊情况也可以做灵活的调整，比如对应用的第一个版本来说，原型内容会非常多，也可以分成多个页面来呈现。
这样做，不仅仅是“组件”和“文本样式”可以在一个项目内复用，其它相关的元素，比如某个页面，或者某个画板，都可以更加方便的复用。
5. 总结
以上，基本就是用sketch设计APP原型的整体思路，产出物从视觉上看会非常精致，完全达到了高保真原型的水准，使用熟练的话，制作效率也非常高。在同样甚至更短的时间内，如果能设计出更精致的原型，何乐而不为呢？
当然，设计思路不仅仅适用APP端，也同样适用于web端项目，只需要将页面大小和相关控件更换一下就可以。
若要文中截图内容的sketch文件，欢迎交流。
相关阅读
首先要了解74HC595这个芯片：74HC595是一个8位串行输入、平行输出的位移缓存器：平行输出为三态输出。这个芯片各个引脚的功能及工作
大家好！我是一名UX设计师，希望可以与共同喜欢探索用户体验的朋友们一起成长！我会不定期地更新一些有关用户体验方面的文章。本文主要
环境：本人使用的是chrome浏览器，其他的浏览器操作类似，可能需要做适当的调整。 一、打开需要下载的视频的网页。 二、按F12以后可以
今天我们以好奇心日报为业务原型，探讨下数据模型建设过程（本人非好奇心员工，好奇心老板看见如果觉得对数据化运营有所帮助记得给我加
尽管有不少互联网服务是通过优秀的产品策划设计而取胜的，但是在电子商务市场上，运营能力的强弱无疑是制胜的关键之一。因此作为电商