一、工具簡介
在較為詳盡的原型設計活動中，我們往往需要將系統的部分核心功能給予實現或表層上的展示，比如用戶的登錄界面、論壇、訂單界面等，即便不需要完全實現，僅僅是展現設計中是否具有相關功能，就需要一定的編碼工作。而原型又需要設計的易於修改，這就可能導致一旦投入太多在原型的設計以及修改上，將會消耗團隊過多的時間以及導致成本增加。而墨刀，作為一款可以直接在web上使用的原型設計工具，它不需要用戶從最底層的代碼進行原型的設計，而僅僅需要通過一些簡單的教程，將自己需要的組件拖拽，甚至頁面間的跳轉也只是需要通過拖拽即可完成，全程幾乎沒有任何需要編碼的部分，不論你是否有編程的基礎，經過一個小小的教程之后，你都能通過墨刀進行原型開發！而墨刀的功能也不僅僅是進行開發和保存，它還有豐富的素材庫，讓你更快一步搭建起你的理想原型，同時也可對設計的原型在線分享，方便他人對原型進行評價，同時數據存儲於雲端，不用隨身攜帶自己的電腦，且可團隊工作，共同進行一個原型開發。
二、設計過程展示
這是初始頁面，如你所見，你可以在此新建自己的項目文件夾，也可以對項目進行鎖定，平台會保存你的修改記錄，同時你也可以瀏覽你所標”星號“的項目和你所收藏的素材。
點擊進入項目文件夾：在此你可以對自己的原型項目進行預覽、編輯、標星等操作
現在要從0開始，建立一個”食堂外賣“項目的原型，以此來介紹一些基本的組件和功能的使用方法。新建了項目后，空白的頁面如下圖所示：
主要使用的部分是如上圖紅色箭頭所示”頁面“部分和”組件“部分。”頁面“部分主要是用於添加或刪除在你的原型中所需要轉跳的各個頁面，比如，我現在需要建立”登錄“、”論壇“、”用戶信息“三個界面，點擊新建頁面，並對頁面進行名命。
現在對”登錄界面“這個頁面進行編輯，在”組件“中，尋找自己所需要的組件，直接拖拽到你想要它所在的位置即可，在這里我選擇了文字組件，顯示需要輸入的信息類型；單行輸入組件，用於讓用戶輸入內容；以及用戶類型的選擇框，來讓用戶選擇以何種方式登錄平台。最后則是確認登錄的登錄按鈕。
而我們在登錄之后往往需要轉跳到其他頁面，這時候只需選中需要點擊后跳轉的組件，選中后，旁邊就會出現一個”閃電“的圖表，鼠標懸停在上面就會出現拖拽的提示，將其拖拽到自己想要跳轉到的頁面即可。
將經過上一步的設置后，點擊登錄即可跳轉到用於發布接單信息的論壇界面，下面開始設置論壇界面，首先設置一個我們比較常見的輪播圖，可拖動、可自動播放。選中該組件后，將其拖到自己需要其所在的位置，在選中該組件后，在右邊的編輯框中，在箭頭所指位置上傳自己想要展示的圖片，當然也可以從在線的素材庫中選取。這樣就能完成一個完整的輪播圖組件了，同時你也可以在編輯框中對組件的其他參數進行編輯。
下方的消息則顯示的是配送員所發布的可以接單的信息，將消息通知的組件拖動到相應位置，雙擊其中的文本框就可以編輯文本，單擊選中圖片區域，即可在右側編輯區上傳圖片。同樣也可以為點擊此消息框加上事件，拖動左邊的閃電圖標，引到想要轉跳到的頁面，這里，我將其設置轉跳到”選擇菜品並下單“頁面
使用卡片組件作為菜品的展示，編輯方法類似上述過程：
下面編輯用戶信息界面：在加入了幾個簡單的組件后，需要添加一些圖標，在右側工具欄中選擇”笑臉“的按鈕就可找到圖標庫，在其中選擇自己需要的圖標組合，點擊進入，拖動自己需要添加的圖標即可。
再在下方插入導航欄：在組件中選擇你所需要的導航欄組件，將其拖動到需要的位置，再將原來組件中默認的，自己不滿意的圖標刪去，在圖標庫中選取自己喜歡的圖標拖到相應位置即可，最后，給圖標加上事件即可，使其完成在頁面間的跳轉。
什么？你還覺得很費事？？好吧，還有更舒服的方法讓你進行設計！點擊素材庫，進入官方素材庫。並在此選擇你心儀的素材或者模板。
就拿左下角的生鮮電商模板來看：點擊保存，即可保存到你的原型文件夾中。但是如果您只是喜歡其中的一些組件或頁面，也可以在保存后，將相應的組件設為模板，以供使用。
此時，你就可以選擇在模板的基礎上進行修改，或者使用已經設計好的漂亮的組件來對自己的設計進行補充！在這里我使用模板中部分組件，來完善之前設計的原型。回到自己的編輯頁面后，選擇“我的組件”，將所需要的組件拖動到指定位置，進行編輯即可！是不是很方便呢？
三、對完成了的原型的操作
基本的頁面設置基本就如上所述，需要給組件或者圖標添加事件，都是使用”閃電“圖標拖動的方式。完成了基本的框架，此時點擊左上角的”保存“對原型進行保存，再點擊右上角的”運行“，查看原型效果
這樣一來，我們就完成了一個比較簡單的項目的原型了，而完成后，我們可以選擇分享原型，以便進行討論。在分享界面，你可以設置各種包括權限在內的有關分享的參數。
如果需要對原型進行下載的話，則點擊下載，設置相應的參數（還可以直接轉為APK，真是強大啊）
然而除了對原型本身的操作，在墨刀上，你還可以進行基於原型的工作流圖的繪制：點擊工作流，導入自己的原型，就可以進行工作流圖的繪制了！
這就是墨刀原型開發工具的一些基本使用方法和基本的介紹，謝謝各位閱讀！
https://free.modao.cc/app/b8d5bce04a0be419019836f696c7f47469ed9a40?simulator_type=device&sticky 這是本文中完成的原型項目，歡迎大家查看~