我們剛剛介紹了移動(dòng)設(shè)計(jì)初探：觸屏網(wǎng)頁(yè)設(shè)計(jì)。本文將介紹一些UI界面與設(shè)計(jì)使用的元素、軟件和網(wǎng)站。內(nèi)容很豐富，適合用戶體驗(yàn)設(shè)計(jì)師、界面設(shè)計(jì)師、產(chǎn)品設(shè)計(jì)師、JS前段開(kāi)發(fā)、手機(jī)產(chǎn)品設(shè)計(jì)以及iPad和平板電腦產(chǎn)品設(shè)計(jì)等使用。

Lumzy

官方地址：http://www.lumzy.com/

Lumzy是一個(gè)網(wǎng)站應(yīng)用和原型界面制作工具。使用Lumzy，您可以輕松創(chuàng)建UI模型并即時(shí)發(fā)送到客戶電腦中。 Lumzy還具有團(tuán)隊(duì)協(xié)作編輯工具。 

#p#

Mockingbird

官方地址：https://gomockingbird.com/

Mockingbird（中文名：百舌鳥(niǎo)）是一個(gè)在線工具，它使您輕松地創(chuàng)建UI界面模型，預(yù)覽UI，并可以共享你的版面編排效果圖。 

#p#

The Pencil Project

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

為設(shè)計(jì)圖表和用戶界面圖形原型開(kāi)發(fā)的一個(gè)自由和開(kāi)源工具。 

#p#

Dojo

官方地址：http://dojotoolkit.org/

Dojo提供了強(qiáng)大的性能并節(jié)省您的時(shí)間。這是適合經(jīng)驗(yàn)豐富前端開(kāi)發(fā)者的JS開(kāi)發(fā)工具包。 

#p#

Mocklinkr

官方地址：http://www.mocklinkr.com/

自定義排版托管工具M(jìn)ocklinkr，讓你不用再擔(dān)心沒(méi)有漂亮版面

#p#

MockFlow

官方地址：http://www.mockflow.com/signup/

MockFlow是一個(gè)在線工具，用戶界面設(shè)計(jì)和協(xié)作版面編排工具。 

#p#

Serena Prototype Composer

官方地址：http://www.serena.com/products/prototype-composer/index.html

Serena Prototype Composer是制作流程圖，模擬程序流程和用戶界面設(shè)計(jì)程序。 

#p#

Cacoo

官方地址：http://cacoo.com/

Cocoo是一個(gè)用戶友好的在線繪圖工具，允許你創(chuàng)建一個(gè)如網(wǎng)站地圖，線框，UML和網(wǎng)絡(luò)圖圖等。 Cacoo可以免費(fèi)使用。 

#p#

DENIM

官方地址：http://dub.washington.edu:2007/denim/

一個(gè)早期非正式的網(wǎng)站和用戶界面設(shè)計(jì)工具 

#p#

Hot Gloo

官方地址：http://www.hotgloo.com/

網(wǎng)上應(yīng)用線框 

#p#

User Interface Design Framework

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

一個(gè)免費(fèi)提供網(wǎng)頁(yè)設(shè)計(jì)師使用的用戶界面設(shè)計(jì)工具。 

#p#

Pattern Tap

官方地址：http://patterntap.com/

可以尋找一些設(shè)計(jì)資源與模式等。 

#p#

User Interface Design Patterns

官方地址：http://ui-patterns.com/

提供一些熱門(mén)的用戶UI界面設(shè)計(jì)模式參考圖，分類(lèi)很詳細(xì)，如果設(shè)計(jì)網(wǎng)站或UI界面可以上去找一些資源，很不錯(cuò)。 

#p#

Patternry

官方地址：http://patternry.com/

Patternry是用戶界面設(shè)計(jì)模式庫(kù)的目的是幫助解決常見(jiàn)的接口設(shè)計(jì)問(wèn)題。

#p#

Mephobox

官方地址：http://box.mepholio.com/

UI設(shè)計(jì)界面資源欣賞參考網(wǎng)站。 

#p#

Android Asset Studio

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

可以在線生成圖表，只需要輸入?yún)?shù)即可 

#p#

Mobility

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

移動(dòng)用戶界面設(shè)計(jì)使用，可以輸入?yún)?shù)進(jìn)行測(cè)試，很方便 

#p#

Android UI Elements Set

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

可以自由設(shè)定Android操作系統(tǒng)的用戶界面元素。 

#p#

OSX Leopard GUI Set

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

該軟件包含一些常用的Photoshop原文件和PNG文件，這些元素都是用來(lái)設(shè)計(jì)GUI界面的素材，通過(guò)該軟件你可以快速制作出一些出色的界面 

#p#

ALL In One Web Elements Kit

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

網(wǎng)頁(yè)布局元素大集合,PSD文件。 

#p#

iPad GUI Set

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

iPad平板電腦上設(shè)計(jì)布局用的元素集合。 

【編輯推薦】

1. 針對(duì)碎片時(shí)間進(jìn)行移動(dòng)產(chǎn)品設(shè)計(jì)
2. 支付寶產(chǎn)品經(jīng)理談iPad上的設(shè)計(jì)工具
3. 移動(dòng)終端設(shè)備游戲設(shè)計(jì)初體驗(yàn)
4. 移動(dòng)設(shè)備客戶端交互適配設(shè)計(jì)
5. iOS操作系統(tǒng)多任務(wù)設(shè)計(jì)的繁與簡(jiǎn)