墨刀是一款在線原型設計與協同工具,借助墨刀,產品經理、設計師、開發、銷售、運營及創業者等用戶群體,能夠搭建為產品原型,演示項目效果。墨刀同時也是協作平台,項目成員可以協作編輯、審閱,不管是產品想法展示,還是向客戶收集產品反饋,向投資人進行Demo展示,或是在團隊內部協作溝通、項目管理。本篇博客將會對墨刀這款工具的特點,相比其他主流原型設計工具比如Axure的優勢,以及其使用方法進行介紹。
一、墨刀的特點
(1)界面簡約,白藍配色,每塊功能區都有一塊獨立的方格區域。下圖是最初始的新建頁面,也是初始的界面排版。
(2)內容豐富且人性化,基本滿足開發者的基本需求。
從左上角開始說起,最左側的左邊欄是原型設計中的常用組件,這六個分別是文字,矩形,圓,直線,圖片,連接區域。左邊欄右邊的是頁面管理區域,可以管理這次原型設計中項目的頁面,而且非常人性化的在鼠標移動至每個頁面的右側的三個點時會顯示頁面的四個更多功能。
左下角,左側的邊欄兩個按鈕功能分別是刪除此頁面和收起左側頁面管理和元素管理的區域。左邊欄右邊是元素管理,用來管理該頁面上你使用過的所有元素,當鼠標移動到一個元素上時,會顯示鎖定,隱藏,連接事件三個更多功能,且在中間的視圖中,該元素會變藍,方便你查看。
中間是項目的預覽頁面,右側的懸浮框里的圖標是縮略的五個功能,分別為頁面狀態、內置組件、我的組件、圖標、母版。點擊圖標會展開顯示具體的功能,而且最多支持懸浮框左右的兩個圖標展開。
狀態能夠使一個頁面發生變化,例如微信的會話,左拉出現標為未讀和刪除。 組件存放着墨刀上所有能夠用在頁面上的組件,需要使用的組件可以直接使用鼠標拖入,拖入時會顯示組件創建成功以及組件所在的坐標位置。我的組件里可以保存自己的常用組件或者是自己組合的組件。圖標存放着墨刀上能夠使用的所有圖標,同樣也是直接拖動如項目的視圖中就可以使用。母版是一個能夠批量管理相同組件的功能,使用母版后,遇到完全相同的組件,只需要更改任意一個就可以自動修改所有的其他組件。當系統自帶的一些組件或是圖標沒法滿足自己需求時,還可以點擊下方的獲取更多素材,來發現官方或是其他用戶發布的組件和圖標。
最右側是項目的一些基本設置,可以更改項目將要發布的平台,選擇不同的手機型號、電視、或是發布在網頁上等等,也可以快速地更改項目的布局。
二、墨刀相比Axure的優勢
(1)組件
墨刀的組件十分豐富,有很多成熟的組件,比如鍵盤、菜單、開關、導航、通知等等。而Axure的自帶的組件都是比較基礎的,如果需要復雜的組件需要去下載。
(2)交互
墨刀的交互是非常方便的,只需要點擊組件左側的圖標類似閃電一樣的控件,將其拖拽至想要跳轉的頁面就可以,並且在拖拽完成后,會在右端自動跳轉出事件功能,可以簡便的設置交互的條件和效果。而Axure要做交互,則需要設置各種條件,或者輸入各種用例,通過條件,動態面板狀態,隱藏,切換等功能才能形成交互效果。
(3)總結
墨刀由於其組件簡便的使用方法,在用戶需求復雜度不高的時候能更加完整直觀地展示原型效果,而且相比Axure,其簡約的界面設計,以及豐富的功能使得墨刀的上手度不難,對於新手來說,即時沒有豐富的經驗也可以輕松駕馭軟件,完成簡單的原型設計。
三、墨刀的使用方法
做一個非常簡單的手機app
(1)創建一個新頁面
(2)添加底欄
(3)更改頁面名稱為首頁,並且根據需要更改底欄的圖標和文字,並創建首頁下的兩個子頁面——發現和我的頁面
(4)豐富首頁內容,添加組件,且將底欄的發現和我的圖標分別與兩個頁面聯系起來
(5)將發現和我的兩個頁面設置和底欄的交互完善。
(6)完成后運行,在首頁下點擊發現跳轉到第二個圖發現頁面,再點擊我的跳轉至第三個圖我的頁面,三個頁面可互相跳轉,當然還可以對每個頁面添加點擊事件以及狀態變化。