設計師的十大難題之一 ——如何選擇一款好的APP原型設計工具

如今的移動開發愈來愈趨於小規模團隊協做，彷佛只要懂得一些APP開發的人就自稱瞭解了用戶體驗和用戶界面的重要性，一個好的APP原型設計理念很容易被糟糕的界面和體驗毀於一旦，現在市面那麼多的原型工具幫助咱們解決問題，咱們又何樂而不爲呢？但如何選擇原型工具卻成爲設計師們最頭疼的事情，一方面是因爲不懂哪些工具適合本身，另外一方面又沒有多餘的時間去挨個使用。別擔憂，今天就爲你們解決這一大「難題」。

 

首先，要考慮到那些人將會使用你的原型，而後針對不一樣的用途選擇最好的原型工具。

1. 我的或小型的設計團隊：主要要求的是設計理念和設計思路，追求的是高效率，此時手繪和白板是最好的工具，或者Balsamiq Mockups也是適用於這個階段的好工具。

2. 公司高層，客戶，投資人等：原型不要求必定要精美華麗，但至少要美觀，在交互邏輯和元素佈局上儘量追求與真實產品接近。主要流程能夠走通便可，須要能夠在移動端作演示，使用像Mockplus等能夠做出逼真的交互效果而且方便在移動端演示的工具。

 

3. 開發團隊&視覺設計師：要求設計流程完備，最好有操做流程圖。Fluid UI 這種能夠完善設計出各交互元素，並輸出流程圖的工具是不錯的選擇。

 

 

其次，要了解好的移動端原型設計工具應該具有的如下幾個特性（摘自知乎）：

1. 組件庫專門對移動端定製過
2. 方便輸出到移動端查看效果
3. 支持移動端的手勢操做
4. 支持移動端視圖切換的轉場動畫
5. 能夠快速生成全局流程圖

 

還有一些其餘加分的特色：

6. 低保真最好，不要帶太多iOS高光漸變效果
7. 組件庫豐富，有社區能夠看其餘設計師的做品
8. 自帶網格系統
9. 在線協做&版本管理
10. 能作一些異常檢查，好比某個按鈕沒設連接，某個list沒有空置狀態等。

 

 

最後，給你們介紹幾款適用於移動APP的原型設計工具；

 

Fluid UI

 

Fluid UI是一款用於移動開發的原型設計工具，它可以幫助設計師快速高效地完成產品原型圖的設計。

 

優勢：Fluid UI 內置超過1700款的線框圖和手機UI控件，而且還會常常進行更新，適合跨平臺開發者。符合上面1，2，3，4，5，6，7，8。並且是html5版，全平臺支持！

缺點：不夠直觀，免費版只能建立一個1個項目和10個頁面

 

價格：付費版25美圓/月，能夠建立10個項目和無數個頁面以及使用全部組件庫。

 

 

Mockplus:

 

Mockplus是一款快速簡單的原型設計工具，主要適用於新手產品經理和設計師。

 

優勢：封裝3000個圖標和200個組件，操做簡單快速，學習成本低。在最近發佈的版本中支持團隊協做功能，審閱和評論很是方便，據說在即將到來的3.2版本中，支持將Sketch的設計文檔導出爲Mockplus的mp項目文件。導出後，你能夠在Mockplus中打開它。說了好久的頁面流程圖也終於要面世了。Mockplus的頁面流程圖能夠作到：

 

– 即時生成；

– 你能夠選擇展現所有或任意多個頁面的流程圖；

– 智能生成流程連接線，同時也能夠手動調整；

– 展現頁面的批註信息；

– 一次導出頁面流程圖。

 

 

缺點：不支持手勢操做，函數和動態面板。官網教程較少，例子模板沒有具體的操做步驟。

 

價格：基礎版永久免費，付費版118元/年，終身版：699元，無需另外付費更新版本。

 

Balsamiq Mockups

 

這個軟件相信不少人都知道了，它是一款低保真的線框圖工具，主要用於原型設計的初始階段。

 

優勢：內置了大量的模塊，在須要的時候在搜索框裏找，而後拖到畫布裏面進行排序組合，畫圖很快速，功能強大（好比在tab選擇框裏能夠選擇哪一個tab是active，哪些是default的）。很快就能畫出想要的app原型。若是你還以爲BM內置的模塊點少？Mockups To Go 能夠知足你須要的大部分需求！

 

缺點：Balsamiq Mockups裏面畫的只是草稿，沒有配色，沒有設計風格。它只是每一個頁面的佈局，不能進行交互展現。

 

價格：我的版89美圓，能夠根據項目數量來購買。

 

 

Justinmind

 

Justmind是一款爲移動而生的原型設計工具，雖然它沒有像Axure那麼火，可是對移動APP的原型設計支持彷佛比axure更好。

 

優勢：高保真，支持手勢操做。Justinmind的新小部件庫包括全部的蘋果IOS圖標，還添加了Android Nougat UI工具包。而且在版本7.6.0中與Microsoft Team Foundation Server集成，添加一些新的現成屏幕，如蘋果音樂播放列表，庫和播放器屏幕，和蘋果通知屏幕。

 

缺點：學習成本高，定義爲高保真，須要設計人員懂的美工，又要懂的產品。Justinmind導出的html文件限制很強，須要特定的瀏覽器，還須要安裝插件。動態面板無狀態交互。

 

價格：29美圓/月，終身版：495美圓，Justinmind終身版僅支持一年的大小版本更新。 若是你想在第一年後繼續使用新版，則需每一年花費額外的$ 99保持更新。

 

 

總結

 

總之，作原型仍是要看設計人員本身的想法和理念，而原型工具是你在設計路上的「最佳拍檔」，工具終究是工具，看你如何結合本身的設計思路來實現工具的最大價值。以上幾款APP原型設計工具是我的比較喜歡的，若是你是新手上路，那麼我仍是推薦Mockplus，畢竟一開始就學習難的工具也是得不償失。