好用原型設計軟體 Mockplus 免費畫互動 App 與網頁


前幾天在友站小眾軟件上看到一個免費易用的原型設計軟體:「 摩客 Mockplus 」,由大陸團隊開發,在去年(2014)下半年推出,是一個同時具備線上版、 Windows 與 Mac OS X 電腦版的 Prototype 設計工具, Mockplus 自詡為:「 如果把 Axure 看作一頭大象,Mockplus 是一隻輕快的小鹿。」

原型( Prototype )設計,可以幫助專案企劃時有效的溝通網頁功能、軟體介面、 App 互動,透過畫出原型,讓產品經理、設計師、程式開發師、主管、客戶之間能夠了解產品本身的使用流程,把想像或文字化為具體可用的示範。

相比許多其他 Prototype 原型設計工具,「 摩客 Mockplus 」這個軟體最大特色就是非常簡潔易用,並且可以設計出「具備實際操作互動功能」的 App、 網頁、軟體原型,兼顧了專業與好上手,免費版就基本上夠用,值得有需要的朋友試試看。




  • 快速好上手的 App、 網頁、軟體原型設計軟體

進入「 摩客 Mockplus 」後,完成免費註冊,就能開始使用線上版的原型設計工具。

因為這是由中國團隊所開發的工具,所以一開始預設就是簡體中文版,對台灣用戶來說閱讀應該沒有太大的問題。





  • 專注在設計,而非工具

「 摩客 Mockplus 」的主要介面和知名的 Axure RP ,或是其他線上製圖工具基本上是一致的格局,例如:
左方是圖庫、模板,只要拖曳到中間的繪圖畫面就能隨意組合使用。而且「 摩客 Mockplus 」聚焦在軟體原型的設計,盡可能地考慮了大家規劃介面時的需求,讓企劃人員可以「專注在設計上」,而幾乎不用花時間學習工具操作。





  • 設計「可互動」的原型

說到「 摩客 Mockplus 」最大的特色,就是在免費使用的情況下,就能設計出可以互動操作示範的原型。

如何設計出可互動介面?首先在右方的頁面清單裡,隨時能夠新增刪減 App 、網頁、軟體的多層頁面。


在軟體原型圖上,就可以設定每一個物件的「交互(互動)」連結,例如指定這個按鈕點擊後要連結到哪一個頁面。

透過建立互動連結,就能產生可互動的多層介面原型。





  • 數百個實用的 App、 網頁設計素材

「 摩客 Mockplus 」免費版中就已經內建了數百種圖標,如果升級到專業版又能額外獲得兩倍以上的圖庫。


而無論我們想要設計的是軟體介面、 App 介面或網頁介面,都可以在左方的素材庫里,找到這些介面的原型模板,直接拖曳到畫面中就能開始設計內容原型。





  • 素描或線條風格

在整體的原型風格上,「 摩客 Mockplus 」也支援了大家喜愛的素描風格,或是正統的線條風格。





  • 物件自訂性與註釋

點擊「 摩客 Mockplus 」原型圖中的每一個物件,還能自訂其大小、圖片,或是加上解說註解。

「 摩客 Mockplus 」也允許我們在設計原型時上傳自己的圖片素材來使用。





  • 「線上互動展示」你的 App 原型

而當設計完成後,如果要跟其他人展示你的軟體原型,可以點擊右上方的「播放」按鈕,就能打開獨立網頁開始線上展示,展示過程中就跟真的在操作這個軟體一樣,透過前面的互動連結設定,可以在原型中實際體驗操作的反應過程。

有興趣的朋友可以看看我的粗淺範例效果:https://www.mockplus.cn/project/run/kz95gIW8aejSvYB0





  • 「 摩客 Mockplus 」線上版、電腦版

「 摩客 Mockplus 」不只擁有線上版,我們還可以「下載免費的 Windows 與 Mac OS X 軟體」,在軟體端使用原型設計,並且軟體端還可以下載線上版的原型來繼續修改。





  • 免費版:只能公開、無法導出其他格式

不過「 摩客 Mockplus 」的免費版確實有一些限制,最大的兩個限制就是:免費版設計的原型只能設定為公開,免費版無法把原型圖導出成其他格式。

如果你希望自己設計的原型是私密的,但是又想暫時先試試看免費版,那麼你可以透過邀請朋友新加入「 摩客 Mockplus 」的方式,每邀請一位朋友,就能獲得額外增加一個私密原型圖的額度,最多可以增加 10 個私密原型圖。

有興趣的朋友,可以使用我的邀請連結:https://www.mockplus.cn/referral?r=rw8nlf

整體來說,「 摩客 Mockplus 」是一個兼顧專業與易用的 App、 網頁、軟體原型設計工具,在快速的組合中就能產生可以互動操作的原型圖,有需要的朋友可以試試看。

轉貼本文時禁止修改,禁止商業使用,並且必須註明來自電腦玩物原創作者 esor huang(異塵行者),及附上原文連結:好用原型設計軟體 Mockplus 免費畫互動 App 與網頁


留言

  1. 感覺是個向 Balsamiq Mockups 致敬的產品...

    回覆刪除
  2. Made in china......怕怕,,,不想mock up後,不用一星期有一個複製的網站。
    或者有第三方公司搶了自己的客人.

    回覆刪除
    回覆
    1. 作者已經移除這則留言。

      刪除
    2. 同意 200%
      別為了一時方便 失去整座江山
      狼群已兵臨城下

      希望拒絕使用MIC

      刪除
  3. 謝謝esor介紹~ 已加入。想請教您怎麼獲得自己的 referral code 的? web 版遍尋不著... 是要裝 win 或 mac 版本裡面有嗎? (話說他應該很想要大家安裝,那個線上版入口超級小的,但其實用起來很順暢。頗滿意的 ^^ )

    回覆刪除
    回覆
    1. 能夠告知在哪裡進入線上版嗎?
      我找不到~~

      刪除
  4. 你好!怎么和您联系?我是mockplus公司的,我的联系方式qq:178793913

    回覆刪除

張貼留言

為了避免垃圾廣告留言過多,開始測試「留言管理」機制,讓我可以更容易回應讀者留言,並更簡單過濾掉廣告,但只要不是廣告留言都會通過審核。

這個網誌中的熱門文章

全家沖印、 7-11 列印照片誰好用?立可得與 ibon教學+比較表

微軟 Bing AI 繪圖工具 Image Creator 免費開放,30秒輕鬆生成圖片

Google Maps 我的地圖完全教學!規劃自助旅行攻略

3個 ChatGPT 輸入到輸出實驗,第二大腦筆記用 AI 生成文章報告

Arc 瀏覽器 windows 版測試心得,用四大介面改造升級專注工作流

Google 表單的 10 個專業問卷調查設計秘密教學

如何為筆記命名,建立搜尋規則?我的標題、分類、標籤命名法

Draw.io 中文線上製作流程圖首選!專業水準完全免費

如何用 ChatGPT 加速生成一份有圖有文的簡報,實戰案例教學

Google 表單自動關閉回覆教學:時間人數到達就過期