sketch之组件（设计规范）

关于设计组件规范

在用了sketch之后，最大的感触就是太方便了。尤其是设计规范使用好了，更是爽上加爽！～

一.为什么要做组件规范？

1.保证产品风格统一

在公司里面，很多都是团队合作来完成设计稿，每个设计师都有自己的审美和风格，但是产品的风格必须保证是统一的，所以就需要一个规范性的文件来作为设计标准。

2.提升团队效率

在sketch里，有一个好的组件库，设计师就不用重复去改每一个页面上的图标。只需要改动一个就能同步页面上所有的图标。

3.打磨细节体验

在产品长期迭代的过程中，对每一个元素都需要对其场景、状态考虑清楚。所以在整理过程中，经常会发现以前没有注意到的问题并优化。

二.怎么做一个好的组件规范？ 

好的规范首先要清晰，将不同的组件分类。让每一位设计师都能在20秒内找到自己想要的东西。

按类别分类（按组件类别）、场景完备（用简单的语言表述帮助用户了解什么、怎么用、哪些场景。

怎么创建组件：在sketch中创造组件非常方便，选中要制作组件的元素，再点击下方图片上的按钮

组件的命名：点击按钮后页面上就会出现组件命名编辑框。

在sketch中，一个好的命名规范可以方便开发和设计师查找且使用相应的组件。

命名中的“/”在sketch中是分组的作用，例如下方这个icon的命名。

1.整理规范内容及分类

不同的项目的规范内容都是不同的，我们需要明确规范内容的分类有哪些。可以先确定大体的规范内容，在页面完善的过程中也不断的完善规范。

2.确定优先级

首先确定整体风格和框架后再去确定细节的风格，优先级最好以控件、组件、场景来进行完善。

3.规范性尺寸

先确定设计图尺寸，建议使用375（@1x）。

左右页边距：10、12、16px居多（@1x情况下）。

图标尺寸不要过多，最好控制在两种。