栅格化设计就是按照一定的规则把页面的宽度分成固定的相同宽度，然后列出各种组合的可能，以方便在进行页面呈现的时候能够快速的进行布局，界面设计栅格化系统栅格系统英文为"grid systems",开始是从平面栅格系统中发展而来，后在网页设计中被发扬光大，比较有名的栅格化系统如960GS，现在随着移动端的兴起，移动端设计也有了很多这样栅格系统。

　　Material Design是谷歌推出了全新的设计语言，这种设计语言旨在为手机、平板电脑、台式机和"其他平台"提供更一致、更广泛的"外观和感觉"。

　　在Material Design中也有着一套完善的栅格化系统，我们再设计中可以使用这个栅格系统，帮助我们更加高效规范的进行界面设计。

　　这个栅格系统所有组件都与间隔为8dp的基准网格对齐，排版/文字与间隔为4dp的基准网格对齐。

　　△ 界面设计栅格

　　△ 布局设计栅格

　　△ 图标设计栅格

　　配色神器 (谷歌搭梯子)

　　配色是很多设计师头疼的问题，特别是一些新设计师在如何调色与配色上往往都是处理的不太好!那么下面这个插件将帮你解决这个问题!

　　同样是来自Material Design，Material Design的配色方案更是艳丽无比，与扁平设计风格更是相得益彰。如果你还在担心自己的设计作品配色的话，那么下面这套Material Design的配色版插件，将彻底让配色变的无比简单了，妈妈再不用担心我的配色了!

　　这套插件可以轻松的安装到你的Adobe Photoshop 和 Adobe Illustrator 调色板，使用非常方便。

　　碧玉刀 — 切图神器 Cutterman

　　Cutterman是一款运行在photoshop中的插件，能够自动将你需要的图层进行输出。以替代传统的手工 "导出web所用格式" 以及使用切片工具进行挨个切图的繁琐流程。能够让你只需要点击一个按钮，就自动输出你需要的各种各样的图片，快到没有朋友!

　　输出支持IOS平台的单倍图、双倍图，支持IPHONE6/6P尺寸比例。

　　输出支持Android平台的各种分辨率大小图片，什么XXHPDI，XHDPI，HDPI啊之类的，通通自动化输出，为你节省出更多的时间陪小伙伴好好玩耍。

　　了解更多关于网页设计方面的知识，访问上海网页设计培训学校