http://www.csdn.net/article/2013-04-22/2814991-20-useful-tools-and-resources-for-Web-designers

摘要:对Web工程师而言,掌握一些优秀的工具不仅可以让开发工作事半功倍,而且还能增强自身实力,触类旁通。本文整理和收集了20款非常实用的资源列表,它们能够帮助你降低Web开发过程中的复杂度,节省时间和精力。

1.Niice

Niice本质上是一个设计搜索引擎,其结果来源于Designspiration 、Behance、Dribbble。搜索示例:black and white script lettering

2.Pixel Dropr

Pixel Dropr是PhotoShop的一款插件,由UI Parade公司设计开发,是一个集成了图标、插图、照片、按钮等设计元素的工具面板,用户可以轻松地将设计元素从Pixel Dropr的面板上拖拽到任何PSD文件中。

3.Designer News

Designer News是一款强调设计的新兴工具。

4.Firefox’s Font Inspector

Font Inspector是Firefox在DevTools里新添的一款typography-centri工具,点击查看更多详细介绍。

5.Cloud Comp

Cloud Comp是由Cloud APP提供的一款轻量级工具,设计师可以使用它与客户共享APP和网站排版。点击查看更多详细介绍。


6.Sidebar.io

Sidebar是一个网站,在它的页面上每天都会提供5个最好的设计链接给大家。

7.BLOKK

BLOKK是一款由破折号组成的字体,可用于快速建立原型图与线框,点击查看更多详情。

8.What’s My Browser Size?

顾名思义,What’s My Browser Size?是一款显示当前浏览器窗口尺寸的Web应用。

9.Intuitive Color Picker

Intuitive Color Picker是一款取色器。同类型的应用有0 to 255Colllor

10.Timehub

11.Helvetica vs Arial

字体排版在Web设计中扮演着非常重要的角色,许多设计师对一些相似的字体很难知道它们的区别,比如 Helvetica和Arial。该资源将不仅能很好地测试你们的技能,并有助于区分这两种字体。

12.HEX to RGB Converter

这是一个非常小的网站,把HEX转换成RGB代码。推荐尝试Colorrrs

13. PlaceIt

PlaceIt是一个简单的拖放工具,可以让你在几秒钟内生成非常逼真的产品截图。

14.Heyoffline.js

这是一个JavaScript插件,当网络设备下滑时,会通知用户保存信息,以免数据丢失。另外推荐Garic.js插件,用于存储本地表单数据。

15.Keynote/PowerPoint for UX Tests

Keynote是Google Ventures团队的首选工具,用于构建功能模型,并且非常实用。

16.Alfred Workflows

如果你是Alfred用户,可以查看这款CSS颜色转换流程。

17.PLTTS

PLTTS(读作Pallets),是一款为项目确定颜色的工具。

18.Chardin.js

Chardin.js是一个jQuery插件,可以为Web应用程序提供简单的叠加式说明(overlay-style instructions),点击查看特效。

19.Mincss

Mincss是一款垃圾清除器,通过查找和删除选择器可以清除CSS中的“垃圾”

20.CSSCSS 

CSSCSS与Mincss类似,通过解析CSS文件来解释一些规则和重复使用的声明。

英文来自:TNW