Responsive Design资源之二：设计工具_Responsive

作者：大漠日期：2013-01-23 点击：544

Responsive Design设计工具，早前在《15+ Responsive设计的测试工具》中只整理了一些测试工具，今天特意在《Responsive Design资源之一：学习线路》基础之上，整理Responsive Design资源系列第二部分——设计工具。希望这些工具能帮助大家更好的学习Responsive。

Responsive设计工具中主要包括“设计灵感”、“设计草图”、“Psd辅助图”、“框架与原型”、“样式指南”和“计算器”六个部分，其中“设计灵感”中罗列的是一些Responsive设计案例；“设计草图”中提供了一些Responsive设计草图的常用工具；“Psd辅助”主要是用来帮助设计师在制图时更好的帮助设计师设计；“框架与原型”中总结了一些优秀的Responsive设计的框架和原型；“样式指南”中提供了CSS处理Responsvie的方法与细节；最后一部分是有关于一些计算器，帮助大家在制作过程中的单位转换。接下来我们一起来看看这些资源。

Responsive设计灵感（案例资源）

这里主要收集了Responsive设计的一些案例，大家可以通过这些案例，为您的Responsive设计提供灵感。

1、Mediaqueri.es

2、This Is Responsive tagged 'Inspiration'

3、Responsive Deck

4、Zurb Responsive Gallery

二、Responsive设计草图

Responsive设计过程，对于制作草图是很有必要的一个环节，下面给大家提供了四个优秀的Responsive草图制作工具。

1、Responsive Web Design Sketch Sheets

2、Responsive Design Sketch Sheets

3、Interface Sketch

4、Responsive Sketch Sheets

三、Responsive设计辅助图

对于做设计的同学来说，Psd应该很熟悉，其实在对Responsive做设计时，也有一些图可以辅助我们，让大家更好的实现Responsive设计，在这里给大家提供了两套设计，以供使用。

1、A better Photoshop grid for responsive web design

2、Stripes - Responsive Web Design PSD

四、Responsive框架与原型

有关于Responsive框架，在互联网上特别的多，就W3cplus就搜集了不少，比如说《8个实用的响应式设计框架》经过一年多的积累，现在有近20个Responsive框架，另外在《16个优秀的Responsive CSS框架》也整理了16个Responsive方面的框架。现在多了，也不知道如何选择，这里为大家推荐几个国外讨论较多的Responsive框架以供大家参考。