為方便產品經理、設計師、開發及專案相關人員能夠看到直觀的效果，進行更有效的溝通；提供直觀的產品設想，說明使用者將如何與產品進行互動，在互動設計的過程中一定會產出各種各樣的產出物，如流程圖、思維圖、紙上的草稿、甚至高保真演示稿。
這裡簡單分享下自己在專案過程中的互動demo設計的一些心得。
製作互動demo的軟體有很多，個人比較喜歡且習慣的就是axure。axure操作簡單明瞭，對於初學者來說，非常容易上手；它也擁有強大的互動演示動作，對於高階使用者來說，製作非常高保真的演示demo, 也是非常有成就感的。
balsamiq
提供了豐富的手繪風格的web常用元件，能建立接近於紙上手繪的原型，讓人有眼前一亮的感覺，個人建議初稿方案的時候可以考慮用這個更能吸引人。
mockups
其他還有一些工具，就不做介紹了，因為個人也沒有使用過，比如：
microsoft office visio、pencil sketch、design studio、prototype composer、lucid spec、irise professional edition、adobe reader…
每個軟體都是各有特色，也有利弊，但軟體都只是工具，用哪個都無妨，只要符合自己的習慣就好，關鍵是產出物。
工具之後，就是demo稿的設計了。在平常的專案中，我基本上都是使用axure 工具，也是大家常用的工具。而互動demo也只要出到相對中保真的狀態即可，所謂的相對中保真，就是產出交付物中能體現出使用者在每個頁面上期望看到的內 容，以及這些內容在頁面上的相對優先順序，並要提供流程說明和操作方式及響應狀態的表述。
不是粗糙的草稿方案，也不要出太高保真的視覺效果。草稿方案，可以用手繪或者接近手繪效果的工具(balsamiq、mockups)，不見得都需 要用axure; 而高保真的原型需要花費更多的精力，也不夠高效，除非是用於匯報演示方案、或是為可用性測試製作高保真原型。
很多新人互動設計師都比較容易忽略這一點，沒有按照柵格規範來布局，這樣容易導致的結果就是：視覺設計師在按照柵格排版時，發現在互動稿中能排下的內容，在視覺稿中排不下了，這樣就還得返回去改互動稿，或是需要重新設計布局。
所以要養成習慣，在設計初時，一定要先根據柵格進行布局，同時也要保證互動稿中的字型大小、間距盡量符合視覺要求（比如間距最小10畫素等），以免給視覺造成不必要的困擾。
有些產品人員或設計師為了能方便，拼湊各種競品的截圖，組成乙個頁面。這樣即不規範，也大大降低了互動稿的檔次，還會對視覺設計師也有一定的干擾，個人是非常厭惡的。
另外，互動階段的產出方案，應該更聚焦在資訊布局、內容層次、操作流程。不太建議在互動稿上使用色彩（除了文字或特殊狀態），避免對視覺設計師造成不必要的干擾。如果真的有一些關於想法，可以通過文字描述，或者直接告訴視覺設計師需要營造什麼樣的氛圍，達到什麼效果。
讓色彩、質感、具體形勢交給視覺設計師，多點空間讓視覺設計師去盡情發揮。
axure提供了豐富的動作指令碼支援，使得動態模擬真實介面互動變成可能, 能實現狀態切換、時間動畫以及其他一些驚人的小玩意。
但有時候我們需要思考，在日常專案中是否需要花費這麼多的精力和時間？
這也取決於於這個原型是用於什麼情境。如果原型是用以進行早期的可用性測試，或為爭取資源的高保真演示匯報demo，也許需要我們快速產出接近於實際介面的可操作效果。
而如果只是用於流程中的互動物，提供給視覺設計師或前端工程師進行開發，那麼過度的設計和效果只能是浪費精力。
把常用的控制項、功能組建、圖示、標註等製作成通用的標準小單元，插入到部件庫（widgets），在製作互動demo時，只需要調出需要的控制項即可，這可以大大的提高你的效率。
關於原型控制項，每個原型工具都有，可以網上搜尋或者呼叫下他人分享的。但個人建議，還是根據自己的習慣或產品設計規範，製作一套自用的標準控制項庫。
大量的頁面進行統一的更新也是相當麻煩的一件事。在製作時，直接用master製作復用的模組，來取代複製黏貼，在需要調整時，只需要調整master檔案即可。
master是axure提供的類似於自定義元件的功能，你可以在master設計常用的互動元件，然後在不同的頁面引用，如頁面頭尾、選單等會在 大部分頁面公用內容，非常適合做成master，然後在各個介面中拖曳相應到指定位置。這樣當這些共用內容需要修改時，只需修改mater即可。
demo，跟實際產品一樣，是會迭代和不斷被修改的，所以，一定要記得存檔。即使是在同乙個原型上做修改，也一定要做記錄，這對後續回顧很重要。
後話：互動demo設計，是每個互動設計師最最基本的技能，這也是乙個梳理思路很好的方式，但不是唯一的形勢，axure也不是唯一工具。只要能清晰表達產品思路、介面ui、流程邏輯及互動狀態的好用工具都是值得去嘗試的。
12條關於網上購物支付流程設計的建議
written on 2010年6月1日 15 32 by 溫妮 tags 網上購物 網上購物支付流程 支付流程設計 1.不要讓使用者先註冊再去選商品。ticketmaster 中，點 返回 按鈕出現這樣的報錯，就會讓使用者有受挫感。當使用者點 返回 按鈕時，不僅不能老讓他們碰到出錯提示，而且如果前...
有效測試的50條建議 編制測試計畫（6）
不同的測試工作又不同的測試目標，不同的測試階段也有不容的測試目標，我們必須清楚此次測試工作的目標是什麼，這個目標是基於系統必須要滿足的標準。對測試目標的了解，可以通過以下幾個方面 1，理解系統。理解系統不僅僅指此次的需求，必須從整個系統高度來了解正在測試的系統的功能性和非功能性的需求。我們可以利用設...
給新手設計師的10條建議
以下的內容應該同時適用於網際網路企業和設計諮詢公司。關乎觀念轉換，關乎身在兵位胸為帥謀。01.不要等待別人的指令，再也沒有老師來布置任務和檢查作業了。這個是我接觸到的每乙個新人剛來的時候共通的狀態，任務做完了就開始發呆，等著被要求檢查 作業 但事實上你的每乙個舉動都在和周圍的每個人展示你的 能力 都...