如何挑選一款高效的原型工具?

5 評論 18875 瀏覽 106 收藏 8 分鐘

客觀來講,每種工具能滿足的任務和需求各有不同,“最適合”才是原型工具選擇的黃金法則 。

每當設計一個新的App或網站時,作為對原型設計有一定了解的人來說,我們會傾向于選擇那些“明星”原型設計工具。它們功能齊全、模板酷炫,能夠幫助我們解決大部分設計問題。然而,任何事物都不可能完美,在面面俱到的背后,我們也能看到一些問題,比如:臃腫的文件、不夠靈活的用戶操作等。其實設計大部分的功能,尤其有特色的App或網站時,一款輕量級的原型設計工具不失為最佳的選擇。

除了工具自身的功能和特點外,在決定是否選擇某一款工具前, 還有很多方面需要考慮。比如,這款原型工具的上手難易度如何?這款工具是否能滿足我們的設計需求?它是否符合整個團隊的特點和興趣?下面,筆者整理了一些選擇和評估標準:

  1. 創建原型時間:花費多長時間來創建原型,將極大地影響工具的易學和易用性;
  2. 用戶交互性:針對用戶普通需求和常見功能交互的支持,尤其是針對部件的交互;
  3. 3.協作與分享:與他人在原型設計中的工作協同度和原型分享的功能質量;
  4. 4.可用性測試:原型可以進行可用性測試的質量;
  5. 5.保真度:在模擬目標原型上的效果如何(比如設備外觀、頁面之間的跳轉等)。

客觀來講,每種工具能滿足的任務和需求各有不同,“最適合”才是原型工具選擇的黃金法則 。筆者認為,擁有一個原型設計工具庫對于PM和開發者,尤其是需要針對團隊反饋、客戶需求進行修改的PM和開發者來說,可以大幅提高工作效率。這里跟大家分享幾款高效的原型工具以及各自的特色,看看有沒有你中意的一款 。

1. Axure RP

推薦:★★★★

網站:https://www.axure.com/

作為老牌原型工具,Axure無論在產品功能、還是在品牌影響力方面,都是其他原型軟件不能輕易比擬的。它在7.0版本開始對響應式設計做了更好的支持,UI也進行了微調。AxureRP六合一功能,包括:網站架構圖、示意圖、流程圖、交互設計、自動輸出網站原型、自動輸出word格式規格文件。

特色:

控件及素材控制上靈活、自由,實例資源豐富,交互功能強大。

缺點:

學習曲線陡峭,需要投入較多學習和時間成本。自帶的基礎組件偏少,需要費精力去找素材資源下載,漢化版很難獲得,價格略貴。

原型展示:

http://axureland.com/

2. Mockplus

推薦:★★★★★

網站:http://mockplus.cn/

作為原型工具中的后起之秀,Mockplus倡導“不為工具所累”的理念,提供了海量圖標(3000個)和組件(200個),開箱即可用。最新發布的格式刷和樣式復用,可以無腦操作、批量復制 。Mockplus無論是從產品功能到用戶操作習慣,還是從界面語言到客服支持,可以說是最接地氣的國民原型設計好軟件了。

特色:

低學習成本易上手,簡單拖拽創建原型,高度封裝的交互組件,完全可視化的交互設置,多種原型預覽和演示方式(包括:圖片預覽、二維碼預覽、演示包預覽、HTML離線/在線預覽、手機端APP原型碼預覽),實時高效的團隊協作與審閱。

缺點:

教程和幫助文檔待完善,一些復雜的交互設置不支持。

原型展示:

http://run.mockplus.cn/demo/index.html

3. Proto.io

推薦:★★★

網站:https://proto.io/

Proto.io是一款專用的手機原型開發平臺,支持全交互式的移動程序的原型。這款軟件可以在大多數瀏覽器中運行,由于所有操作都是基于拖放、點擊按鈕和選擇列表的值,有時候要找到想要的設定會有困難。

特色:

基于Web的工具,可以在一個項目中包含多個屏,同時可以創建屏之間的過渡效果。同時有大量的UI元素庫,支持定制,也支持元件與Dropbox同步。

缺點:

原型預覽方式有限(尤其當本地預覽原型時,需要每次都點擊‘SaveProject’然后點擊“Preview”才能看到修改后的效果),只能導出圖片、HTML和PDF格式的文件,通過“層”完成交互設置,有時候過于復雜,并且不直觀。

原型展示:

https://proto.io/en/demos/

4. InVision

推薦:★★

網站:https://www.invisionapp.com/

InVision也是一款基于網頁的原型交互設計工具,制作一個在線原型只需4步:創建一個項目、上傳視覺設計稿、添加鏈接以及在線生成原型。準確來講,InVision不是一個“典型”的原型工具,而是提供一個快速制作原型的環境,可以把UI/UX草圖快速連接起來。

特色:

Web項目可以很好實現團隊協作,支持在線評論和審閱、便于收集反饋意見,針對IOS開發,還支持自定義屏幕圖標和加載頁面。

缺點:

PDF導出支持能力差,無法獨立創建線框圖或UI元素,響應類功能缺失,免費版本只能創建一個項目。

原型展示:

https://marketplace.invisionapp.com/

最后,附上一張原型工具評價總覽圖,希望在你選擇原型工具時有所幫助。

 

本文由 @jongde 原創發布于人人都是產品經理。未經許可,禁止轉載。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 以上都已不用。目前Sketch Ant design / Weui 直接輸出高保真,或者說設計稿。各種符合規范的標準化組件拖拽使用,Web / APP 都可以快速搞定,無需糾結表現形式,又能保證質量。稍微用點心,UI 都省了。我們項目需要快速迭代,目前我一個人,產品、交互、UI一次性全搞定,還糾結什么Axure? 如果想要看交互效果,那就Flinto搞下,快得很。

    回復
  2. 墨刀是不是太牛逼,和他們不是一個級別的?

    回復
    1. 確實

      回復
  3. 咋沒說說墨刀呢?

    回復
  4. ??

    來自上海 回復