1. Solidify
Solidify允許用戶(hù)在模型、線(xiàn)框或者草圖中獲取原型圖。此外,你還可以快速地查看屏幕界面原型。如果在桌面、計(jì)算機(jī)或者手機(jī)上運(yùn)行Solidify還能輕易地測(cè)試出項(xiàng)目原型。如果你沒(méi)有太多的時(shí)間花在這上面,你也可以共享給其他測(cè)試人員,隨時(shí)隨地獲取反饋意見(jiàn)。
2. PowerMockup
專(zhuān)為設(shè)計(jì)師準(zhǔn)備的PowerMockup在創(chuàng)建PowerPoint時(shí)為線(xiàn)框提供模板。包含各式各樣的模板,包括菜單、表格、文本框、按鈕和標(biāo)簽。當(dāng)你在創(chuàng)建PPT時(shí)你可以輕易的將這些模板拖入使用。另外,用戶(hù)還能在庫(kù)中添加自己的條目,只需選擇PPT的外形,然后點(diǎn)擊“添加模板”標(biāo)簽,一款自定義的模板即可輕松創(chuàng)建。
3. Antetype
當(dāng)你創(chuàng)建大型的且連續(xù)性的項(xiàng)目時(shí),Antetype是最佳選擇,這是因?yàn)樗试S開(kāi)發(fā)者創(chuàng)建一整套的構(gòu)件庫(kù)。該構(gòu)件庫(kù)可收集各小部件,在原型中方便易用。此外,每個(gè)小部件都有一定數(shù)量的定制和默認(rèn)狀態(tài)可單獨(dú)或者同時(shí)進(jìn)行編輯。
因此用戶(hù)在編輯時(shí)無(wú)需使用不同的副本,Antetype可適應(yīng)不同項(xiàng)目的需求。
4. UXPin
UXPin是為那些不擅長(zhǎng)UX設(shè)計(jì)的開(kāi)發(fā)者而開(kāi)發(fā)的。經(jīng)驗(yàn)豐富的UX設(shè)計(jì)師為UXPin提供了一整套的完整的工具包。
在UXPin上用戶(hù)可以為自己的項(xiàng)目找到所需要的模板。他們通過(guò)上傳UX和項(xiàng)目文件來(lái)獲取模板,比如Project Canvas、Project Kick Off、Business Model Canvas、Personas等等。
此外,用戶(hù)無(wú)需來(lái)回收發(fā)郵件,因?yàn)樵谶@里任何項(xiàng)目都可在一起工作。UXPin旨在幫助項(xiàng)目經(jīng)理開(kāi)發(fā)適應(yīng)任何一款分辨率和設(shè)備的響應(yīng)式線(xiàn)框和原型。
5. QuirkTools
QuirkTools讓網(wǎng)站創(chuàng)建更加簡(jiǎn)單和便捷。
利用QuirkTools構(gòu)建Web應(yīng)用可幫助用戶(hù)創(chuàng)建屬于自己的一款應(yīng)用。Wires就是典型的例子,該應(yīng)用幫助用戶(hù)創(chuàng)建基于桌面、移動(dòng)手機(jī)或平板電腦的線(xiàn)框模型。此外,QuirkTools還能讓開(kāi)發(fā)者與同事、客戶(hù)共同協(xié)作打造最完美的設(shè)計(jì)。
6. Wireframe.cc
利用Wireframe.cc即可輕易的創(chuàng)建線(xiàn)框。Wireframe.cc支持有限的調(diào)色板和模板,以簡(jiǎn)潔為主。有兩個(gè)模板供選擇:移動(dòng)手機(jī)和瀏覽器窗口,前者包含景色和垂直風(fēng)格;后者則是縱向和橫向風(fēng)格。有了Wireframes.cc用戶(hù)可清晰的看到整個(gè)創(chuàng)建過(guò)程。
7. Easel
Easel是一款基于瀏覽器的Web設(shè)計(jì)工具,允許用戶(hù)記錄模型和創(chuàng)意。其功能包括按鈕、表和文本框。這款工具還集成了Twitter Bootstrap庫(kù)貫穿其他額外的圖標(biāo)和顏色。此外,Easel 讓用戶(hù)在Web中設(shè)計(jì)保持最佳像素,用戶(hù)可以使用先進(jìn)的工具比如CSS3、Web字體,無(wú)需在瀏覽器和文本編輯器之間來(lái)回查看,告別繁瑣的過(guò)程,輕松創(chuàng)建應(yīng)用。
8. InVision
InVision讓你以高水準(zhǔn)的級(jí)別快速創(chuàng)建令人印象深刻的原型。利用這款工具,用戶(hù)可在很短的時(shí)間內(nèi)鏈接到UX草圖、設(shè)計(jì)以及線(xiàn)框,還能與其他團(tuán)隊(duì)分享該項(xiàng)目。InVision使設(shè)計(jì)演示更加輕松方便,用戶(hù)可以在項(xiàng)目中進(jìn)行實(shí)際演示,在瀏覽器中加載或者以SMS形式連接到移動(dòng)設(shè)備上。
該工具還支持追蹤功能,讓你輕松查看項(xiàng)目進(jìn)度。
9. Proto.io
Proto.io這款工具完美適合設(shè)計(jì)師在觸摸屏幕上的小工具。支持主流的移動(dòng)觸摸風(fēng)格和手勢(shì),包括swipe、pinch、tap、zoom、tap-hold。此外,還能整合動(dòng)畫(huà)屏幕轉(zhuǎn)換比如,幻燈片、旋轉(zhuǎn)、流、翻轉(zhuǎn)等等。
該工具不僅僅是為了生產(chǎn)先進(jìn)的屏幕轉(zhuǎn)換,還能允許用戶(hù)學(xué)習(xí)和應(yīng)用最基本的動(dòng)畫(huà)技能比如在原型創(chuàng)建中的移動(dòng)、縮放、旋轉(zhuǎn)等等。
10. POP
有了Prototyping on Paper (POP)創(chuàng)建iPhone原型不再是難事,其提供了一個(gè)傳統(tǒng)的高科技線(xiàn)框技術(shù)。沒(méi)有復(fù)雜的軟件,所有的用戶(hù)需要在紙上或者筆記本上繪畫(huà)或繪制出線(xiàn)框。
該線(xiàn)框僅通過(guò)攝像頭拍攝,利用POP確保草圖能自動(dòng)調(diào)節(jié)對(duì)比度和亮度,然后通過(guò)“鏈接點(diǎn)”連接到草圖來(lái)設(shè)計(jì)模板。首先確保任何事情都在完美狀態(tài),用戶(hù)只需點(diǎn)擊“play”并模擬接口即可。
最后:
在設(shè)計(jì)網(wǎng)頁(yè)或程序之前,需要把界面給“畫(huà)”出來(lái)成為原型設(shè)計(jì),就像動(dòng)畫(huà)片要畫(huà)分鏡頭、手稿一樣。原型設(shè)計(jì)能起到有效溝通的作用,漂亮,直觀的原型圖更是讓人賞心悅目。有了這些工具,原型和線(xiàn)框變得更加簡(jiǎn)單和方便,即使是初學(xué)者也可設(shè)計(jì)自己的網(wǎng)站或者應(yīng)用,趕緊嘗鮮吧。