Web开发者欣喜若狂的40个UI设计工具和资源

开发 前端
本文主要给大家分享40个UI设计工具和资源,方便用户了解界面设计在持续的基础上不断成长和演变。Web设计师要跟上时代,你需要关注趋势、新资源和正被实施和谈论的新技术。同时,你也要亲身尝试,并提出原创的见解和应用。

本文主要给大家分享40个UI设计工具和资源,方便用户了解界面设计在持续的基础上不断成长和演变。Web设计师要跟上时代,你需要关注趋势、新资源和正被实施和谈论的新技术。同时,你也要亲身尝试,并提出原创的见解和应用。

下面列举的这些工具能帮你做到这些。尽情分享下面这些我找到的注释出的资源中你认为有用的部分。

模型参考和资料库

User Interface Design Patterns(用户界面设计目标)

看看这些其他人已经想出的对一般用户界面挑战的解决方案,它不仅能帮助你找到正确的现有解决方案,还能作为你提出新的和原创的东西的基础。

一个在线文字和图形目录是常见解决的UI设计问题的方案。使用非常宽松的分类,同时也让你用标签或颜色分类:

User Interface Design Patterns

地址:http://ui-patterns.com/

Pattern Tap

一个能找到平常被使用的设计模板精神的好资源。Pattern Tap将UI元素分类集合,同时也将个别项目以标签形式在新窗口打开:

Pattern Tap

地址:http://patterntap.com/

Patternry

Patternry 将重点放在寻找常见UI问题的解决上,而不只是提出简单的建议:

Patternry

地址:http://patternry.com/

Mephobox

是另一个能找到的提出常见设计模板启示的好资源。你能够以用户身份游览网站,或者查证基于个人设计元素的集合:

Mephobox

地址:http://box.mepholio.com/

#p#

原型开发、模型构建和设计反馈工具

Lumzy

你在创建新的UI技术任何时候,在创建网站之前,你会需要创造出一个作为概念根据的原型或模型。当然,你也要测试这些新构想。

Lumzy是一个方便的UI界面模型构建和原型开发的小型在线工具。它能让你创建具有工作功能的原型,而不只是线框:

Lumzy

地址:http://www.lumzy.com/

Mockingbird

另一个界面模型构建和原型开发工具,同时拥有在线团体合作开发工具:

Mockingbird

地址:https://gomockingbird.com/

UI Design Framework for Illustrator

一个为AI服务的用户界面元素和风格设置网站:

UI Design Framework for Illustrator

地址:http://www.webalys.com/design-interface-application-framework.php

Android Asset Studio

一个为开发Android应用提供UI元素的网站:

Android Asset Studio

地址:http://android-ui-utils.googlecode.com/hg/asset-studio/dist/icons-launcher.html

Unique Mobile UI Design Elements

自由设置UI设计元素:

Unique Mobile UI Design Elements

地址:http://www.fullcreative.com/2010/10/mobility-a-free-set-of-mobile-ui-design-elements/

#p#

Android UI Elements Set

自由设置Android OS的UI元素:

Android UI Elements Set

地址:http://www.webdesignshock.com/freebies/free-photoshop-android-interface-gui/

OSX Leopard GUI Set

OSX Leopard的GUI元素:

[[18731]]

地址:http://www.tutorialshock.com/freebie/mac-osx-leopard-gui-set/

ALL In One Web Elements Kit

提供你的网站的所需的一切PSD分层文件:

ALL In One Web Elements Kit

地址:http://bestblogbox.com/freebies/all-in-one-web-elements-kit/

iPad GUI Set

提供你所需的任何iPad应用程序的主题的分层矢量PSD文件:

[[18732]]

地址:http://www.teehanlax.com/blog/2010/02/01/ipad-gui-psd/

The Pencil Project

火狐的GUI原型构建插件:

The Pencil Project

地址:http://pencil.evolus.vn/en-US/Home.aspx

#p#

Concept Feedback

发布你的设计和概念,并得到免费反馈的设计社区:

Concept Feedback

地址:http://www.conceptfeedback.com/

Landing Page Optimization

获得他人关于你目标页面5秒钟的真实印象反馈的网站:

Landing Page Optimization

地址:http://fivesecondtest.com/

框架

框架已经成为了几乎所有复杂的UI的主干了。这里的是极少数的框架,不像Moo Tools和jQuery那些你可能熟悉的工具。

DHTMLX

一个提供了大量的UI部件的javaScript UI资料库和 jQuery的替代品:

DHTMLX

地址:http://dhtmlx.com/

Dojo

另一个拥有强大API设置以及丰富UI控件的javascript工具包。

Dojo

地址:http://dojotoolkit.org/

Echo 3

是一个不仅能让开发者创造组建驱动和事件驱动API和Javascript客户端应用程序的UI工具包:

Echo 3

地址:http://echo.nextapp.com/site/

#p#

Midori

一个超轻量级Javascript框架,它集合了很多常用的UI技术。而且即使包括缩进语言,Midori也只有51K:

Midori

地址:http://www.midorijs.com/

Scripty 2

另一个支持***版Webkit游览器的CSS过渡和转换的框架。

Scripty 2

地址:http://scripty2.com/

ZK

ZK包括超过200个ajax组件,一切准备就绪:

Scripty 2

地址:http://www.zkoss.org/

jQTouch

一个用于手机iPone应用开发的jQuery插件:

jQTouch

地址:http://www.jqtouch.com/

代码片段和脚本

为什么我们要白费力气呢?如何这里有一个存在的片段,而它正是你所需要的,你就可能在下面的这些网站中找到。

jQuery Labs

一个为你网站预制jQuery组件的庞大的资料库:

jQuery Labs

地址:http://www.jquerylabs.com/

#p#

Snippet Library

一个由用户提交审查的各种程序语言的片段和代码教程的资料库:

Snippet Library

地址:http://www.snippetlibrary.com/

The Javascript Source

一个常用javascript和ajax片段的便捷的向导:

The Javascript Source

地址:http://javascript.internet.com/snippets/

roScripts (beta)

可以被用户投票的脚本、片段和资源:

roScripts (beta)

地址:http://www.roscripts.com/listings

Snipplr

一个有许多先进脚本和jQuery技术的好资源:

snipplr

地址:http://snipplr.com/popular/language/javascript

Code Sucks

有关于Javascript片段如何工作的极其详细的评论的网站:

Code Sucks

地址:http://www.code-sucks.com/code/javascript/

#p#

HTML Goodies

另一个有优秀的步骤记录文件的jQuery资源:

HTML Goodies

地址:http://www.htmlgoodies.com/beyond/javascript/

WebResources Depot

包括在它们的设计资源的大型目录中的是大量非常有用的脚本和片段:

WebResources Depot

地址:http://www.webresourcesdepot.com/

Ajax Rain

出色的以分类和标签的形式表现的片段资源库,它能使你很容易找到你这在寻找的东西:

Ajax Rain

地址:http://www.ajaxrain.com/

Open Source Scripts

提供截止于2004年的Javascript片段和代码:

Open Source Scripts

地址:http://www.opensourcescripts.com/

Mini Ajax

非常优美程序片段的集合:

Mini Ajax

地址:http://miniajax.com/

#p#

Webappers

大量的包括非常好的图片编辑片段集合的jQuery组件:

Webappers

地址:http://www.webappers.com/

Javascript Kit

原创在线javascript片段资源库之一:

Javascript Kit

地址:http://www.javascriptkit.com/

Webcodr.com

一些对你网站非常有用的程序片段:

Webcodr.com

地址:http://www.webcodr.com/6/15-javascript-snippets-you-cant-live-without/

HTML Assets

基础javascript片段的小集合:

HTML Assets

地址:http://www.html-assets.com/javascript-snippets.php

其他杂项资源

这里有方便的并不适合下面任一类别的UI资源,但是我们仍旧感到是值得提及的:

Slidenote

一个简单的能使你创建滑动通知(sliding notification)的jQuery插件:

Slidenote

 

地址:http://slidenote.info/

#p#

 Editable Grid

只要几行简单代码,就能将HTML表格转换为可以用高级选项操作的组件:

Editable Grid

地址:http://www.webismymind.be/editablegrid/

Placehold.it

为你排版简易创建占位符的服务器:

Placehold.it

地址:http://placehold.it/

Fillerati

一个独特的Lorem Ipsum的替代品。为你网站模型创建真实文字块,帮你从所能接收到的各种公共域文字中做出选择。

Fillerati

地址:http://fillerati.com/

qTip2

一个qTip的提示窗口插件的jQuery升级。使得为你网站制作风格化提示窗口变得容易:

qTip2

地址:http://craigsworks.com/projects/qtip2/

原文链接:http://space.yeeyan.org/u/144345

【编辑推荐】

  1. 代替桌面工具 10款最给力的Web开发与设计工具
  2. 10个国外开发的HTML 5精彩应用
  3. 众妙之门:网站UI设计之道
  4. 移动终端设备UI设计检测要素
  5. 中国的网页设计为什么这么烂?
责任编辑:陈贻新 来源: 译言网
相关推荐

2011-03-15 10:21:57

WebChrome

2017-02-09 15:19:14

2011-03-29 14:11:10

UI界面UI设计

2011-03-21 16:30:42

UI界面设计

2013-08-01 09:52:04

网页设计工具Web工具Web资源

2011-10-31 15:08:54

Chrome插件Web设计开发

2015-09-01 10:55:08

Web设计工具

2011-03-30 08:49:34

WebjQuery

2014-06-16 15:35:29

设计师JavaScript资

2019-04-09 15:12:43

开发者技能工具

2011-03-01 13:10:06

WebjQueryHTML 5

2020-06-22 07:53:21

编程工具Web 开发编程语言

2010-05-24 10:46:00

Web开发者

2011-01-11 10:00:20

Web开发工具

2021-04-08 10:40:24

前端工具代码

2015-09-22 13:25:46

Web开发者HTML5工具

2015-08-11 11:01:22

设计原则开发者

2023-11-30 15:30:19

Python编程语言

2011-04-21 13:02:29

2015-01-23 09:53:12

Bug工具Web开发
点赞
收藏

51CTO技术栈公众号