最近在做項目的第一輪迭代,而自己主要是負責項目前端這一塊,因為要與客戶討論客戶需求,所以需要使用一些原型設計方便我們的討論,因此邂逅了MockPlus,通過使用MockPlus我覺得這是一款非常好用而且便捷的軟件,于是在這里把它推薦給大家,順便給大家演示一遍它的基本使用過程。
工具:MockPlus2.2.6
一:我使用的版本是2.2.6,所以在此演示也是2.2.6版本,打開MockPlus,新建一個項目,頁面隨之會跳轉到一個選擇頁面,我們以制作網頁原型為例,所以選擇網頁。
二:頁面之后會跳轉到如下頁面,圖中紅筆標出為項目及項目下頁面,我們雙擊即可修改項目名稱,如果項目下需要多個頁面,點擊圖中藍筆圈出的加號,即可添加新的頁面。
三:首先我們只做一個簡易的登錄頁面,如下圖,從組件欄中選中矩形框直接拖拽到頁面當中,調整到合適大小,雙擊矩形框可以修改矩形框中提示字。選中矩形框還可以在右下角“屬性”一欄中修改矩形框的屬性。
四:按照三中提到的方法,再拖入兩個輸入框和一個確認按鈕,并修改其屬性,完成登錄界面的設計。
五:在項目下新建一個頁面,命名為“個人中心”,按照三四的方法進行設計,如下圖。
六:回到登錄頁面,選中登錄按鈕時,按鈕右上角出現一個小框,點擊其中小圓點,連線到個人中心,如圖所示,這樣可以保證預覽時點擊登錄就可以直接跳轉到“個人中心”頁面。
七:保存,點擊頁面上方小三角,進行演示,嘗試一下,是不是點擊登錄的時候就可以直接跳轉到“個人中心”頁面呢?
是不是感覺很好用啊,今天就給大家講這么多,MockPlus可以實現的功能還有很多,這里就不一一講了,需要大家自己去挖掘。