网址: www.voossi.com  微信:voossiwx

虽然有些设计方法会不断改变，但在任何项目的起始阶段中最重要的一点就是要先制定一整套的设计指南。

为每个项目制定设计指南和标准能改进你的工作流程，不但能保持设计的一致性，还能使得项目按照正确的方式开发。

制定设计指南是一个设计师的职责所在，因为你不能因为开发人员没有像素眼而去责怪他，你应该用设计指南和规范去指导他们。

你需要创建如下三种类型的文档:

1.设计风格指南

2.设计组件文档

3.界面说明文档

如果一个设计师同时也需要做前端开发的话，那么需要分别为每个平台再增加代码的编写指南代码组件。因为你可能也希望直接跳过某些步骤，从第二步开始编写代码。

1.设计风格指南

在一个设计项目中，设计风格指南定义了每一个元素的设计风格。这基本上就是给开发者的一个大概的笼统的指导文档基本的总体风格指南。颜色，排版规则，表格及列表样式，需要用到的图标，间距等等都应该在文档中详细定义。当你创建了这些元素的风格和制定了这些规则后，你就可以将这些设计元素直接拖拽到你的设计稿中了。

*建议：为各种设计元素命名。即使开发人员最后用了其他层级来命名，但当你在和团队中与其他人员交流时，这也是很有用且必要的。比如说，网站的导航栏设计中使用了不同的主题颜色，那么当你和别人交流时，采用“第一级主题色”、“第二级主题色”等名称来交流就比直接使用颜色名称要容易些。

2.设计组件文档

设计组件文档在很多方面都与设计风格指南相似，但二者属于不同层级。设计组件也是一些元素，比如包含输入框，滑块，旋钮，页眉和页脚等元素。

设计组件文档不同于笼统的设计风格指南，设计组件文档可以帮助你在整个设计过程中保持设计的一致性。对于开发人员来说你，他可以更容易辨别出可重复使用的元素，而这能加快项目开发的进度。

如上图所示，当你做的是一个响应式网页时，设计组件文档中应该包含每个元素在不同状态下的变化。而且，一般的开发人员是不会去关注到描述文字的（他们应该也不想去关注）。

相信我，如果你没有将“标题文字应在移动端居中显示”的描述文字高亮标识出来，开发人人员是不会注意到的。

一旦你认为你完成了设计组件文档的创建，就直接拖拽这些组件到设计稿中，以保证从一开始就是按照既定的规则来设计的，这样可以避免在最终的设计稿中无休止的去编写注释，标注颜色和字体尺寸。

*建议：分类别导出各组件的PSD文件。这样做最大的好处就是，当你的客户想要更改某些设计时，你只需要跟新组件库中相应的PSD文件即可。这能为你节省宝贵的时间。

3.说明文档

最后一步就是界面说明文档。由于我们已经制定了设计元素的风格指南和设计组件文档，接下来就是再回到那些组件文档中去标注（名称和尺寸）。

我们使用如下方法来标注阿迪达斯的网上商店以及类似的大型平台性网站，通常需要分为两部分：

1.分类别导出在大部分页面上使用的组件。

2.导出界面。

对于以上两种类型的导出文件，我们通常使用三个图层来阐释设计稿：（图示为弹出框的标注及说明）

这一切看似是件痛苦的事，但对于一名设计师来说这是至关重要的职责。

但幸运的是，有很多优秀的插件能帮你节省大量时间。

http://www.voossi.com

好文推荐

十大设计师必备网站：http://www.ui.cn/detail/85933.html

四个字体设计网站推荐：http://www.ui.cn/detail/87245.html

本文是悟思原创，如需转载或版权问题请联系我们。

译者：Eric  校对：Alvin

原文地址：http://designmodo.com/create-guidelines/