master( 三 ) _秒懂生活

即时设计：
组件库的入口在左下角，再加上没有中文的提示，我花了好久的时间才找到。进入组件库以后，需要点击共享设计库，进入详情后点击发布才能生效。这样的路劲实在太长了，第一次使用的成本太高了。

文章插图
Mastergo：
组件的位置很明显，就在图层的左边，不过操作很繁琐，我需要先回到工作台的团队面板，导入组件库，进入组件库文件，然后添加到团队组件库，发布更新才能正式生效，这让我折腾了好久。

文章插图
Pixso：
Pixso组件的导入逻辑和mastergo很相似，都需要在团队导入组件发布以后才能生效。

文章插图
2）建立文本样式
组件库虽然导入了，但是我发现均不支持导入文本样式，而文本样式是确保整个界面的字体大小、颜色保持统一的基础，所以我只能单独重新制作一套文本样式组件库。
即时设计、Mastergo和Pixso均嵌入了多款免费商业字体，无需下载安装，极大节省了设计师的成本，其次有效避免设计师使用商业字体带来侵权的困扰。另外，它们都提供了本地字体下载助手，这帮助我可以快速载入本地的字体，非常方便。
最让我惊喜的地方则是字体均支持使用渐变色、支持图层混合模式，这省去了我过往使用Sketch时候要去photoshop进行视觉加工的成本，我的天，这真的棒极了。

文章插图

文章插图
3）建立颜色样式
和文本样式一样，颜色样式是确保整个界面配色统一的基础，在我开始使用形状工具之后，就需要开始建立颜色样式，确保整个设计的颜色统一。即时设计、Mastergo和Pixso的颜色样式功能和Sketch都差不多，没有太多学习成本，轻松上手。

文章插图

文章插图
4）制作基础组件
设计组件是Sketch最吸引我的地方，我以前在学习UI设计的时候尝试过Photoshop ，那种批量修改的痛苦让我每次想起都感到难受，所以自从尝试Sketch以后就彻底放弃Photoshop了。
组件的建立比较简单，但相比Sketch ，即时设计、Mastergo和Pixso都加入了一个变体的功能，这真的很棒。因为在Sketch里当一个组件有不同状态的时候，我需要建立不同的组件，略显繁琐，而变体的设计，可以一劳永逸，方便操作，更加灵活。
当然，对于组件的使用，如果是一个新手，需要花上不少时间成本，不过对于已经习惯组件化设计的设计师来说，即时设计、Mastergo和Pixso的设计真的非常方便。

文章插图

文章插图
5）完成交互临摹
通过建立文本样式、颜色样式和掌握基础组件的制作方法，接下来的工作就是根据每一个页面的结构进行拆解、临摹和组合。
相比Sketch、Photoshop本地部署的软件，即时设计、Mastergo和Pixso的操作性也非常流畅，没有卡顿，不过你尽量要保证你的网络稳定，我在制作过程中确实也遇见过网速不佳导致软件无法操作的情况，还好数据是完整无误的自动保存下来，并没有造成影响。
随着操作时间的增多，每个软件仅用1天就可以完整上手了，这种感觉棒极了。

master( 三 )

秒懂生活扩展阅读