據(jù)國(guó)內(nèi)三大運(yùn)營(yíng)商披露的最新數(shù)字，截止 2012 年 1 月份，中國(guó)的手機(jī)用戶數(shù)已達(dá) 9.8758 億，即將逼近 10 億大關(guān)。CNNIC最新的調(diào)查顯示，截至 2012年6月，大陸5.38 億的網(wǎng)民中，有 15.3%的

網(wǎng)民不使用PC（桌上型電腦），也不使用NB（筆記型電腦）上網(wǎng)，只使用手機(jī)上網(wǎng)。磚家解釋，這個(gè)現(xiàn)象來(lái)自互聯(lián)網(wǎng)向某些不便使用PC或NB的人群擴(kuò)散的結(jié)果。閱讀全文

智能手機(jī)功能越來(lái)越強(qiáng)大，同時(shí)價(jià)格不斷走低，讓手機(jī)上網(wǎng)變得廉價(jià)、方便，降低了移動(dòng)智慧終端機(jī)的使用門檻，把原本用普通手機(jī)的用戶轉(zhuǎn)化成手機(jī)上網(wǎng)用戶。
目前此現(xiàn)象還在發(fā)展中，推估單用手機(jī)上網(wǎng)的人群規(guī)模還將繼續(xù)增長(zhǎng)。

移動(dòng)已經(jīng)是不可阻擋的趨勢(shì)，未來(lái)人們的獲取信息、娛樂(lè)、交流的最主要渠道就是移動(dòng)終端。交互在移動(dòng)應(yīng)用上發(fā)揮的作用更大，能夠?qū)崿F(xiàn)基于傳感器的多種效果。
這里推薦一款專注移動(dòng)端的交互設(shè)計(jì)軟件：JustinMind。它是由西班牙JustinMind公司出品的原型制作工具，可以輸出Html頁(yè)面。http://www.justinmind.com/

與目前主流的交互設(shè)計(jì)工具axure，Balsamiq Mockups等相比，Justinmind Prototyper更為專屬于設(shè)計(jì)移動(dòng)終端上app應(yīng)用。

下面先對(duì)JustinMind做一個(gè)簡(jiǎn)單的認(rèn)識(shí)，這是該軟件的主界面，共有5個(gè)功能分區(qū)：

下面是JustinMind的一些特性：

1.使用JustinMind，你可以在幾分鐘內(nèi)利用其廣泛的組件和交互繪制高保真原型。它提供了一些基本的形狀，如矩形和文本，還有特定的組件，如菜單，表單或數(shù)據(jù)列表。

2.關(guān)于手勢(shì)的交互效果：
JustinMind提供了多種觸屏的交互效果，例如滑動(dòng)、縮放、旋轉(zhuǎn)，甚至捕捉設(shè)備方向等等。在需要產(chǎn)生效果的部件中選擇對(duì)應(yīng)的手勢(shì)即可。

3.可以創(chuàng)建自己的組件庫(kù)。
JustinMind為iPhone?，iPad，黑莓，Android提供了多樣的組件。你可以創(chuàng)建自定義組件庫(kù)，方法是將排列好的單個(gè)組件放在一起，并將它們集體框選拖動(dòng)到組件庫(kù)。
這樣下次你就可以直接使用自己定義好的組件。

4.更為便捷的定義樣式。
相比Axure，JustinMind更好的提供了屬性窗口，并且更好的支持捕獲PS等軟件的圖像屬性。

5.JustinMind可以導(dǎo)出原型的所有信息到Microsoft Word。能夠一鍵生成及其規(guī)范的文檔。

6.共享原型進(jìn)行測(cè)試。
JustinMind支持將原型上傳到服務(wù)器并提供給他人進(jìn)行測(cè)試，為產(chǎn)品的改進(jìn)做出了良好的貢獻(xiàn)。最為特別的是，基于usernote的服務(wù)允許你將原型放到移動(dòng)設(shè)備上進(jìn)行測(cè)試。

7.更友好的定義交互方式。
在JustinMind中，你可以通過(guò)拖拽等方式來(lái)實(shí)現(xiàn)跳轉(zhuǎn)、定向等交互效果，無(wú)需像Axure一樣每一步都只能通過(guò)點(diǎn)擊來(lái)完成。并且顯示更為直觀，如進(jìn)度條。
同時(shí)可以通過(guò)一些簡(jiǎn)單的無(wú)代碼邏輯語(yǔ)句實(shí)現(xiàn)更為高級(jí)的交互效果。

8.全球范圍內(nèi)的復(fù)用、數(shù)據(jù)共享。
每一個(gè)模板都讓這一套組件有不同的視覺(jué)風(fēng)格，變量允許將數(shù)據(jù)從一個(gè)屏幕遷移到另一個(gè)，甚至使用它們來(lái)檢查是否滿足條件。

9.發(fā)布和收集反饋意見(jiàn)。
發(fā)布Prototyper作品到usernote后，全球各地的人將通過(guò)Web瀏覽器訪問(wèn)您的原型。他們的反饋結(jié)果將會(huì)實(shí)時(shí)的呈現(xiàn)在您的原型頁(yè)面。

?由于JustinMind在交互方式的實(shí)現(xiàn)以及原型的生成方面比較具有特點(diǎn)，所以我做了下面一些演示：

1.事件與交互
事件是JustinMind的一個(gè)關(guān)鍵功能，Justinmind Prototyper的事件由兩個(gè)主要部分組成：一個(gè)是事件的觸發(fā)（或用戶事件），另一個(gè)是一組操作。每一個(gè)事件必須在屏幕上定義
一個(gè)特定的元素，這將作為事件的觸發(fā)源。

這個(gè)就是事件窗口，在上文的主界面介紹中有過(guò)簡(jiǎn)單的介紹。

交互動(dòng)作按照順序依次排列下來(lái)，執(zhí)行的順序從上到下一目了然。 ? ? ? 每個(gè)交互動(dòng)作中有很多的操作，這些操作是從左到右依次執(zhí)行的。只有這些操作執(zhí)行完成后，才會(huì)到下一個(gè)交互動(dòng)作。

2.關(guān)于鏈接的設(shè)置

使用鏈接最簡(jiǎn)單的操作就是，例如，點(diǎn)擊Button跳轉(zhuǎn)到Screen3，那么直接將Button拖拽到Screen3上面就可以了。

3.下面列舉了一些常用的事件，可以看出來(lái)JustinMind的圖標(biāo)還是非常形象化的：

On Click: 當(dāng)用戶單擊鼠標(biāo)左鍵并松開(kāi)
On Mouse Up: 當(dāng)用戶釋放鼠標(biāo)按鍵
On Mouse Down: 當(dāng)用戶按下鼠標(biāo)按鍵
On Double-click: 當(dāng)用戶雙擊鼠標(biāo)左鍵
On Right-click: 當(dāng)用戶單擊鼠標(biāo)右鍵并松開(kāi)
On Toggle: 當(dāng)用戶單擊鼠標(biāo)左鍵后，自定義的事件將被執(zhí)行。用戶再次點(diǎn)擊后，事件將被還原
On Mouse Over: 當(dāng)用戶鼠標(biāo)位于所定義區(qū)域之上
On Mouse Enter: 當(dāng)用戶鼠標(biāo)進(jìn)入所定義區(qū)域
On Mouse Leave: 當(dāng)用戶鼠標(biāo)離開(kāi)所定義區(qū)域
On Drag Start: 當(dāng)用戶按住鼠標(biāo)左鍵并拖動(dòng)至少5像素時(shí)
On Drag: 當(dāng)用戶按住鼠標(biāo)左鍵并保持鼠標(biāo)移動(dòng)時(shí)
On Drag Stop: 當(dāng)用戶停止移動(dòng)鼠標(biāo)并且松開(kāi)鼠標(biāo)右鍵
On Key Up: 當(dāng)鍵盤按鍵被釋放

On Key Down: 當(dāng)鍵盤按鍵被壓下

On Swipe Up: 當(dāng)用戶一根手指向上滑動(dòng)

On Swipe Down: 當(dāng)用戶一根手指向下滑動(dòng)
On Swipe Left Up:?當(dāng)用戶一根手指向左上方滑動(dòng)
On Swipe Left:?當(dāng)用戶一根手指向左滑動(dòng)
On Swipe Left Down:?當(dāng)用戶一根手指向左下方滑動(dòng)
On Swipe Right Up:?當(dāng)用戶一根手指向右上方滑動(dòng)
On Swipe Right:?當(dāng)用戶一根手指向右滑動(dòng)
On Swipe Right Down:?當(dāng)用戶一根手指向右下方滑動(dòng)
On Pinch Open:當(dāng)用戶兩根手指互相張開(kāi)滑動(dòng)
On Pinch Close:當(dāng)用戶兩根手指收縮活動(dòng)
On Rotate Left:?當(dāng)用戶兩根手指向左旋轉(zhuǎn)滑動(dòng)
On Rotate Right:?當(dāng)用戶兩根手指向右旋轉(zhuǎn)滑動(dòng)
On Tap Hold: 當(dāng)用戶手指按住屏幕超過(guò)2秒
On Orientation Portrait: 當(dāng)設(shè)備由橫屏切換為豎屏
On Orientation Landscape: 當(dāng)設(shè)備由豎屏切為橫屏
On Change: 當(dāng)元素的值通過(guò)用戶的直接操作發(fā)生變化時(shí)
On Focus In: 當(dāng)輸入框獲得焦點(diǎn)時(shí)
On Focus Out: 當(dāng)輸入框失去焦點(diǎn)時(shí)
On Page Load: 當(dāng)頁(yè)面加載時(shí)
On Page Unload: 當(dāng)用戶離開(kāi)頁(yè)面時(shí)

舉個(gè)簡(jiǎn)單但是有用的例子，當(dāng)你要實(shí)現(xiàn)用戶名密碼驗(yàn)證的交互效果時(shí)，在大多數(shù)原型工具中，我們需要對(duì)輸入框做一些邏輯上的設(shè)定，填好其屬性中的數(shù)值。而在JustinMind中則更為直觀：
在交互窗口中，選擇條件表達(dá)式：

將需要驗(yàn)證的輸入框拖拽到相應(yīng)判斷窗口：

將相應(yīng)的判斷邏輯拖拽到判斷窗口，例如等號(hào)，并在右側(cè)輸入框輸入需要的值

OK，That’s it !在主界面點(diǎn)擊生成，就可以及時(shí)預(yù)覽效果了

關(guān)于模板
你可以為頁(yè)面上的不同組件選擇使用不同的模板，從而不改變內(nèi)容只改變樣式，切換起來(lái)非常靈活。

總結(jié)

JustinMind相比Axure最讓人喜愛(ài)的4個(gè)原因有：
1.Easy Drag and Drop
JustinMind里面對(duì)于組件的交互效果有著及其方便的操作方式，點(diǎn)擊一個(gè)對(duì)象，拖動(dòng)到另一個(gè)對(duì)象，OK，這兩個(gè)對(duì)象已經(jīng)產(chǎn)生了交互的碰撞。

2.Powerful Interactions
JustinMind提供了強(qiáng)大的交互效果，鼠標(biāo)hover的狀態(tài)、點(diǎn)擊后的效果，非常逼真。同時(shí)在移動(dòng)設(shè)備上能夠高度仿真的實(shí)現(xiàn)各種手勢(shì)效果。

3.Quickly Simulate
JustinMind提供了一鍵生成，不用再像Axure那樣多步操作，點(diǎn)擊后直接在瀏覽器窗口打開(kāi)。

4.Great Extras
網(wǎng)上有各種各樣的組件、模板，可以根據(jù)需要選擇相應(yīng)的進(jìn)行使用。

歡迎加入到我們的Justinmind中文愛(ài)好者小組，一起為國(guó)內(nèi)用戶奉上各種教程、資源和組件庫(kù)：http://www.wejustinmind.com/

轉(zhuǎn)自: UX 一淘體驗(yàn)中心

收藏已收藏{{ postmeta.bookmark }} 點(diǎn)贊已贊{{ postmeta.postlike }}

更多精彩內(nèi)容，請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App

游某

你如何定義自己，就如何定義這個(gè)世界； 你如何定義這個(gè)世界，就如何定義你的產(chǎn)品。

342篇作品 4751872總閱讀量

揭秘產(chǎn)品運(yùn)營(yíng)中爆款產(chǎn)品如何塑造市場(chǎng)王者

10-094177 瀏覽

?拼多多做本地生活，盯著美團(tuán)打？

07-263631 瀏覽

一文講透產(chǎn)品經(jīng)理如何用好ChatGPT

03-2719186 瀏覽

等不及的第一批游客，已經(jīng)飛出國(guó)門了

01-102563 瀏覽

戶外品牌TOP1，會(huì)員復(fù)購(gòu)率三連增長(zhǎng)，蕉下如何實(shí)現(xiàn)私域業(yè)績(jī)高增長(zhǎng)？

06-273157 瀏覽