《Wire Flow Wireframe Design》- 讓 UI 設計變簡單!

作者 | 發布日期 2015 年 06 月 08 日 | 分類 Android , APP
pic0608_Wire Flow Wireframe Design001

在 UI 設計初期,客戶、設計師和工程師之間若能經過完善的溝通協調,就能降低摩擦、減少修改的時間和人力成本,而 Wireframe 則能讓我們以簡單的幾何圖形來呈現頁面結構,討論過程中可以快速繪製,也能讓專案執行更順利,目前 Android 用戶可以利用這款《Wire Flow Wireframe Design》來進行簡易的介面設計,讓 App 開發變得更省時、更便利。



icon0608_Wire Flow Wireframe Design001

設計版面是由方格線構成,以便使用者調整大小、對齊格線。點選右下角的綠色圖示,內有線條、圖形、文字等 5 種元件可供選擇,單指長按螢幕即可插入、移動元件,雙指拖曳則能改變其大小;此外,畫面右上方還有移除、復原、編輯等功能鍵,操作方式相當簡單明瞭。

pic0608_Wire Flow Wireframe Design002    pic0608_Wire Flow Wireframe Design003    pic0608_Wire Flow Wireframe Design004    pic0608_Wire Flow Wireframe Design005

 

在文字編輯的部分也相當人性化,我們可自定義文字框的大小和位置,在編輯視窗中點選「Add New Line」則可增加列數。頁面設計完成後,可切換到瀏覽模式來檢視細節,以一般用戶的操作慣性來模擬,再進行細微的調整;若是想在同個專案(Project)增加新的頁面,只要往左滑動,點選「+」即可,對於 App 開發新手來說,是個相當好用、便利的 Wireframe 工具。

pic0608_Wire Flow Wireframe Design006    pic0608_Wire Flow Wireframe Design007    pic0608_Wire Flow Wireframe Design008    pic0608_Wire Flow Wireframe Design009

(截圖自:《Wire Flow Wireframe Design》)

 

Android – Free

qr0608_Wire Flow Wireframe Design001
如果你喜歡我們的分享和文章,請幫我們按個讚
Yi Chou

Yi Chou

懵懂地進入出版業,自此開始了寫手生涯,之後持續在科技產業耕耘、用文字傳遞新知;雖然年齡逐漸增加,但也期許自己,不讓皺紋輕易地刻在心上。
Yi Chou

發表迴響