所谓万事开头难，启动设计项目也是件难事。无论你是自由职业设计师、外包公司或者是大公司设计团队，设计项目的启动都是让人心生畏惧的事情。
作者JonMoore在一个每个月都有大量签约客户的外包团队，头衔是产品概念设计师（ProductConceptDesigner），职责就是让那些令人兴奋的创意点可视化的展现在客户的屏幕上，从而激发他们思考出明年、后年或者大后年的产品迭代路径。
1.创建文件夹
为什么：保证你的设计文档规整
所用工具：Finder
如果第一步没做对的话，整个项目都会问题重重。我组织文件的结构能够保证项目的便于跟团队其他部门对接工作。
我在命名文件时加了_保证这些文件夹始终在列表的上面
_assets:这个文件夹是与内外部的开发团队共享的。其中包含了开发App所用到的一切资源（比如展位图片和内容，字体，icon，图片和logo等）
_exports：任何时候我导出的PNG都放在这个文件夹里。这是跟市场部共享的，从而保证他们总能拿到各种销售物料，方便工作的进展。
ui-design：这里都是我的源文件。通常这个只有一份，但是如果有新的版本，我也会把之前的保存在这个文件夹里。
我创建了个自动动作帮助我创建所有文件夹。
2.选取颜色
为什么：为我的设计项目设计一个基础样式
所用工具：Coolors.co
吸取颜色是最简单的开始方式。如果你正在从事已经开始的设计系统，颜色肯定早已被设定了，这这种情况下问下市场方面的同事或者是视觉负责人。
通常我的项目设定5个主色：
品牌主色
黑色
成功色
警示色
危险色
我是用FabrizioBianchi设计的Coolors帮助我制作调色板。你只需点击空格键，他就能为你随机选色。当你找到自己喜欢的颜色，锁定她，然后继续寻找其他你想要的颜色。如果你们的品牌色早已确定，你可以输入十六进制的数值，锁定这个颜色，然后按空格键选择其他颜色。
我确定好每一个主色，就把他们导入sketch的模版文件里。这些模版文件的样式已经被自定义啦。所以我只需要把他们更新为我刚选的颜色就可以啦。
3.选择字体
为什么：定义app里字体
所用工具：GoogleFonts和FontPair
那么什么才是app设计中好的字体呢？以下是我选择字体的几个原则：
可伸缩性：放大和缩小后是否还可读？
多样性：是否具有至少两种字重（粗细）？
GoogleFonts去年升级了他的字体库，现在它好用极了。我常会通过黑白背景测试，确保任何时候文字都具有良好的可读性。（谷歌推出过思源黑体和思源宋体）
如果你喜欢多样的字体，一种用在标题，一种用在内容，你可以试试FontPair。他们真的为了帮你选择合适的字体下了很大的功夫。所挑选的文字看起来搭配的很和谐。另外，这些字体都来自GoogleFonts，所以全部都是免费的。
但是一定要测试文字的字母、数字以及标点符号。有时你会发现，一款漂亮文字的“9”看起来很怪异，或者感叹号的点很奇怪。当你已经设计了24个页面的时候，你不想碰到这样的怪异情况的。
你一旦选定了字体，在sketch里创建文本样式，比如说标题、内容和连接的文字样式。你永远都不需要在设计某个文本框，除非它跟某个文字样式关联，当你更新某些文本样式时，其余使用相同样式的文本也可以同步更新。
我的sketch模版文件已经标准化所有默认文本的尺寸，所以我能全选他们然后所有的样式都会发生相应的改变。
4.设定网格
为什么：保证整个app的全局对齐
所用工具：sketch和计算器
相对常见的建立8像素网格。
为啥是8？
众所周知，大多数主流屏幕是可以被8整除的。所以在底层，这些测试数值其实在宽度和高度上都可以被8整除。
根据这些信息，你可以确定网格的尺寸。首先定下你的app的展示效果：
固定屏幕：全屏宽度是指app的一个边缘到另外一个边缘。如果是web应用，你的设计应该能够被拉伸到浏览器的宽度。
自适应：这类app会在屏幕中心有个固定的网格宽度。
对于自适应app，我希望宽度和间隙都能被8整除。所以这里有个简单公式：
(12columns*Width)+(11Gutters*Width)=TotalLayoutWidth
混合app：这种app又有全屏款的元素又有自适应的元素。Medium网站就是个混合应用。因为在标题文字上是全屏宽度，但是内容文字是固定740px的宽度的。
在sketch里shift+→是移动10像素，当你设定的是8像素基准时，工作时你会特别困扰。这里用Nudg.it插件帮你解决这个问题。
5.构建框架
为什么：快速生成app布局和UX交互流程
所用工具：矩形
在设计线框图之前，我习惯创建框架，建立多样的页面布局。这个建立在你定义了网格的基础上，快速圈除页面中最重要的部分。这就是我曾经给即时通讯设计的框架：
这个操作只花费了90秒，但是这是我开始设计界面的指导。我更喜欢全局线框，因为当我尝试将屏幕上的元素全部线框化的时候，我更倾向于做高保真。或许，我不是个好设计师？我也看过很多将细节做的很逼真的线框图，但是这个我的意见而已。在UX阶段作出app工作流的框架，确保每个交互都能基于用户正向的反馈。
6.制作高保真
我不想跟你展示的过程是下面酱紫～
但，遵循下面的原则你就能创造奇迹～做高保真的诀窍就是把下面的1-5件事儿做好：