??在第八周的課堂上，王文娟老師在校園系統上發布了對于自行選擇的原型設計軟件進行資料查找以及自學的任務。因為之前的課程學習需要，我們已經大概掌握了原型設計軟件Axure的使用，因此在這里，我選擇了另一原型設計進行介紹，與Axure有很高相似度的原型設計軟件：Mockplus。

?

引言：

? ? Mockplus（摹客）是一款簡潔快速的原型圖設計工具。適合軟件團隊、個人在軟件開發的設計階段使用。其低保真、無需學習、快速上手、功能夠用。并能夠很好地表達自己的設計。

? ? 了解一點Axure后，為何許多人仍轉而使用Mockplus呢？主要是關于Axure和Mockplus比較的兩句話：

? ? ?如果你是一名設計師，需要的是高仿真、像素級的原型設計，選擇Axure；

? ? ? 如果你是一名程序員，需要的是一款方便和同事更精確、高效地討論交互設計的工具，選擇Mockplus。

產品理念介紹：

1、審閱協作

? 創建原型圖、邀請、批注圖釘，之后就可以協同工作了。所有的討論、意見、版本，都會保留。

2、無縫真機預覽

? ?可直接實現設計和移動設備之間的通訊，直接預覽，不需要任何第三方設備。在設計過程中，設計者拿出手機就可以隨時和Mockplus對接，將原型傳遞到移動設備，觀察原型在移動設備中的真實狀態。

? ? 其擁有200多個組件、海量圖標，全部支持手繪素描風格。更好地強調傳遞一種設計原則即：“我這是草圖，僅僅是原型，不是最終的產品，需要你的確認”。對于團隊交流、客戶溝通，這會有好的效果，也非常重要。

3、組件交互

? ? 視覺上定位于低保真，但致力于高保真的組件交互能力。表達交互時依然能夠準確、完整，并同樣簡單上手。Mockplus支持基于頁面的交互和動畫效果。MockplusV2版本，將支持基于組件級別的交互和動畫，可即時觀察交互效果，大大降低學習成本。

4、模版重用

? ?支持模版功能，可以把當前的設計存入模版庫，下次使用時，直接拖入工作區即可。模版還可以分享到團隊的其他成員已經所有Mockplus所有注冊用戶，從而提高整個團隊乃至所有用戶群的生產力。V2版本支持組件、頁面、圖片素材三個方面的模版和重用。

一些MockPlus特別功能

一、格式刷和粘貼樣式

在Mockplus中，你可以通過兩種方法來復制樣式，提高工作效率。一個方法是使用格式刷，另一個方法是粘貼樣式。

格式刷

1.?選中一個已設置好相關屬性（如：背景色、邊框色、文本大小等）的組件。

2.?點擊主工具欄上的“格式刷”按鈕，此時，光標會變為“十字”。

3.?移動光標到需要復制樣式的組件上，點擊即可。

如果需要退出，請按下Esc鍵或者單擊鼠標右鍵。

粘貼樣式

1.?選中一個已設置好相關屬性（如：背景色、邊框色、文本大小等）的組件。

2.?右鍵菜單選“復制”（或者Ctrl+C）。

3.?選中需要復制樣式的組件，右鍵菜單“粘貼樣式”（或者快捷鍵Ctrl+Shift+V）。

二、備份

? ? ? ?在編輯原型過程中，Mockplus會自動備份你的文件，并保存為歷史版本。

? ? ? ? 默認情況下，Mockplus每隔15分鐘為您備份一次，備份文件大小在200M以內，超出200M后將不再備份并提示你清理不需要的備份記錄。

你可以在設置窗口中設置間隔時間和備份文件大小。

?

?

三、抽屜組件

? ? ? ?抽屜組件是一種特殊的彈出面板，可以模擬手機App中推入拉出抽屜的效果，主要用于手機項目。抽屜中有且僅有一個面板組件，可通過往面板中添加組件的方式定制抽屜。一般而言，編輯抽屜組件需要連續兩次雙擊。先雙擊抽屜圖標進入抽屜，再雙擊面板進入抽屜中的面板。

? ? ? ?再論面板，雙擊進入抽屜后，可編輯面板的顏色、邊框等樣式。面板于抽屜組件而言，就像是一張背景畫布。

至于抽屜組件的背景屬性，我們不建議您去修改。因為絕大多數抽屜背景都是這類半透明的灰色蒙層。

彈出面板中支持多種動畫，而抽屜中只有“左側滑出”、“右側滑出”兩種彈出動畫。

抽屜有三種關閉策略：

• 無：通過手動添加交互實現關閉抽屜
• 點擊外部：點擊非抽屜彈出面板區域關閉
• 點擊所有區域：點擊屏幕任意位置關閉

• ?

產品基本功能介紹（自學后制作）

新建項目初始頁面（選擇需要交互的機型和客戶端）

首先一拖一拽將左下角工具欄中的移動部分拖拽至目標位置（并選擇你想要的版本）

? ? ?—————>? ??

接著拖拉工具欄中的方形方框（形狀）將其添加至目標位置 （并可以在右上角選擇你喜歡的樣式）

???—————>???——————>

同樣在工具欄中選擇label（包含單行輸入框、多行輸入框等等）拖拉至目標位置，并進行文字添加以及樣式更改

?

??——————>——————>

根據自己的需求可以對界面進行圖像的布局與繪制（其中工具欄有圖標庫供挑選）

——————>

繼續對界面進行填充（多行文字等輔助）

為頁面底部添加擴展中的熱區（Hotspot）若找不到可以在搜索框直接輸入，并配上點擊圖標（同時可以完成點擊按鈕愛心消失的功能）

第一張界面設置完畢后：

在左邊空白處新建一個頁面，使頁面和頁面之間可以互相點擊交互

點擊Account上方小按鈕并拖動線條并可以使其和頁面鏈接

頁面2布置完后，頁面如圖：

?

?

如果用戶希望能夠自行學習，在產品上便有直接的模板可以提供下載，直接使用并查閱他人模板，便可以學習到如何制作一個良好的界面

在制作完成后，如果想觀看效果，可以點擊上方按鈕：（進入預覽模式進行觀看）

?

使用自學后感想：

? 它關注設計，而非工具，是它帶給設計人員的理念。Mockplus的主要價值是：在正式制作真實軟件產品前，通過原型給大家一個產品的模型展示，而這個模型你可以通過非常簡單快速的方式得到。所以，Mockplus的適用人群是比較廣的，只要你有產品（范圍很廣，可以是某網站，某功能，某個策劃案，某個廣告模型，某個創意等）模型的展示需要。總之，任何軟件公司、軟件從業者，能利用到Mockplus提高效能，并替自己加分。Mockplus是一款快速原型設計工具，支持包括APP原型在內的多種原型與線框圖設計。除了快速，Mockplus廣受歡迎更因為它極低的上手門檻。所以就算是新手也能很快掌握。

? ??而且Mockplus超級簡單，但是功能夠用。我們根本不用專門學習如何使用。工具畢竟是工具，工具只是輔助我們的工作，不要讓工具左右我們的工作，讓工具成為我們的負擔。帶有交互和說明的原型，可以直接指導技術進行開發，同時也可以指導測試編寫測試用例和進行測試指導了。這樣一來，我會對于開發和測試更加感興趣，當我想做一個產品或功能時，直接拿出原型給老師演示，直觀有效的讓領導評估是否可行。這比ppt講解、word說明、郵件交流直觀易懂多了，老師很快就能知道你要做的東西，并評估你的想法是否可行。通過高效使用原型工具Mockplus，大大提高了效率，我們可以提高自己的產能，證明自己的能力。

總結

以上是生活随笔為你收集整理的MockPlus原型设计介绍的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。