網站線稿原型工具Axure使用心得分享
日前比較網站線稿原型工具,親身試用過幾個後,真心覺得「Axure」的功能不但強大,最重要的是上手容易,立馬愛上了這個工具。
和大家分享一下裡頭幾個對於網頁設計工作者超棒的功能:
1. 匯出後側邊有所有階層頁面的連結可以點選。
2. 匯出的檔案是html檔,元素就跟html標籤一樣,不只是假圖而已,十分接近擬真網站!
3. 可增加互動效果例如:點擊效果、滑入滑出效果。
4. 官網有提供其他元件可自行匯入:https://www.axure.com/support/download-widget-libraries
附上一份用Axure官網提供的範例:
http://d7v15s.axshare.com/#p=home
個人針對網站線稿原型(以下我稱為Prototyping)有一些的見解與看法,由於之前是設計師的角色,所以對網站流程還挺有感觸,以往都會省略Prototyping這個步驟,對於小型的企業形象官網影響較不大;但對大型複雜流程的功能型網站,若缺少了這樣一個步驟,會變成大家都用「猜」、或就以自己的想法解讀直接做網站,其實就會造成後續的修改次數增多,甚至可能整個大翻盤,改到最後,除了心情受到影響、氣氛變得低迷外,時間成本又同時持續地增加。
若是事前規劃多了這樣一道工,雖不能說能夠百分百解決在後續修改上的問題,卻可以讓整個網站的架構,無論是開發者或是客戶端都能清楚明瞭。
堅信透過Prototyping與客戶溝通上,除了可以更了解、貼近客戶的需求與想法外,客戶們也同時可以藉由這樣的流程,來審視原先的想法是否有真正地達到目的,不失為一種能夠更高效率地達成雙贏局面的解決方法!
前幾日在FB上看到在Follow的一位前端大神的po文,覺得挺有感的,他提到很常收到的需求都無規劃書,常需要玩「猜心遊戲」。看來這是非常普遍的問題,需要整個不斷的提倡Prototyping的重要性!!!
影片連結(嵌入影片): https://1drv.ms/v/s!Aqu1XtZg0erWgi8m9fV4HEsGbM9D
另外推薦其他也不錯用的線稿原型工具:
1. Draw.io 完全免費、操作容易,且內建元件有很多可以用。(Demo)
2. Marvel 免費版可用兩個Projcet,畫面很直覺,業務使用上覺得這個比Axure還容易。(Demo)
3. Prott 最近很紅的一款,由日本開發。愛料理團隊前期規畫工具就用這款!
4. 墨刀 中國開發的,中文介面完全無語言摸索問題,功能也很強大,產出的Html檔也有直接的互動效果!(Demo)
5. Realtimeboard 我自己是把這款當成大白板來使用,可以一次把全部頁面都擺在上面同時比較與確認和標註文字。
有關Prototype的文章:
快速驗證概念、節省開發成本的方法 – Prototyping (設計大舌頭)
初學者的Prototype (嫁給RD的UI Designer)