用什麼工具和什麼方法能夠實現高效的，快速迭代的交互原型設計方案？

12-26

其實覺得eico的這種原型設計探索方式很有效率，將設計方案列印出一張張大圖，然後交互設計師，GUI，軟體工程師，產品經理這樣一起溝通方便快速迭代，希望eico的童鞋們能夠分享下交互設計原型的「方法論」和「工具論」

一直以來都是用axure做原型。如果希望原型能更方便有效的迭代，僅在原型製作的方面我覺得需要考慮以下幾點：
1，梳理並細分產品的功能模塊，使之與原型的頁面結構形成一致的映射關係。這樣可以讓原型跟隨需求進行的調整，取捨和移動。

2，原型盡量使用簡單的組件，減少動畫效果，減少動態面板的嵌套。多使用文字對原型進行輔助說明。（如圖B部分，我的原型一般都是將所有關鍵路徑都鋪開，利於查看或修改，旁邊有文字注釋，如果有需要演示的特殊動作，則單獨做一個演示動畫，如A部分）

3，有規律的給組件添加標籤（命名），善於利用母板和標註

謝邀~
1、關於方法論
方法論有比較多，騰訊、百度、網易、阿里等UED團隊的博客都有分享過，比如騰訊CDC的這篇就很不錯：http://cdc.tencent.com/?p=3441，又比如騰訊MXD的這篇：http://mxd.tencent.com/2011/03/web_design_for_touch_screen.html，百度無線的這篇：http://mux.baidu.com/?p=1938，其他的您可以到他們博客掏一掏。

2、關於工具
原型圖不過是產品策劃與設計的結果產出，在作圖之前，就會先想清楚用戶需求與使用場景、產品定位、功能點和流程等，這些想清楚後，原型圖就可以直接像用公式轉換一樣轉換過來了，具體可以參考上面那篇騰訊CDC的文章。
您提到的列印成白紙，其實不過是原型圖出來後的工作了。轉換時根據功能點、流程等進行轉化，但轉化出來的，滿足功能與流程的要求，用戶體驗卻不一定能滿足，所以才會出現您所說的將原型圖列印出來和其他同事進行討論。其實比起列印，更好的方法還是用Axure等工具，直接生成模擬真實的、可點擊可錄入的原型網頁，讓不熟悉的同事使用一次，然後觀察與交流。

我以前會覺得交互設計是最重要的，因為可以用一大堆很炫的工具畫很炫的圖，但現在基本是用80%的時間思考，用20%的時間作圖，有時候甚至連Axure都不用，直接用windows自帶的畫圖工具、QQ截圖功能。

曾經也會遇上一些設計和邏輯相衝突等方面的難題，當時很在意，花了大量的時間去探索，後來回頭想想，其實大可不必：要麼是邏輯沒理清，要麼可以借鑒並改良業界的標準方案，要麼可以直接用最簡單的方案上線然後看數據看用戶反饋進行優化。

我不是職業的交互設計師，但對於我們這些小產品，這些方法，我覺得夠用了。更多的時間，我覺得應該花在更重要的地方。不是貶低交互設計師，因為我覺得交互設計師就要去大型公司的大型產品團隊，或像CDC這樣的研究團隊。

在產品設計過程中，做原型的時候，我們可能會去找大量的axure控制項以減少自己畫圖形的時間，也為了讓原型傳達的設計思路更為準確。每次做新的項目，從立項、產品策略思維導圖到功能列表，我們都需要針對不同的產品定位去做一個新的策劃，而原型設計的效率基本上是由過往的經驗和對項目的理解程度決定的。有時候沉浸在一個功能點上不能自拔，而忘記了這個功能點的上下文，使用場景和這個功能在不同狀態下的表現形式。

如果仔細去看自己設計出來的原型，其實有80%的設計工作都花在了產品的無太大差異的基本功能上面了，而剩下的20%的部分是產品設計創造性，差異化的或者說要重點去設計的好玩，酷的元素的地方。

但是，我們不可避免的需要一筆一划的去把那並不太重要的80%畫出來，而其佔了非常大的時間成本。有沒有一種辦法，把這花掉80%設計時間的部分壓縮到20%左右的時間，同時又能保證原型設計儘可能減少邏輯死角和保證考慮到一個功能在不同狀態下的表現，從而讓我們從無差異化的產品設計中解放出來，把更多的時間投入到產品創造性的設計當中呢？

深度學習有一個理論，如果我們從一個領域總結出一套理論，那麼它是適合這個領域的，如果我們把這套理論遷移到其他領域，也行得通，那麼我們得到的是一個抽象的共性真理。我們都知道，PHP開源的特性讓其成為世界流行的程序語言。它讓代碼可以重複使用，為項目節省了大量的開發時間，減少了不必要的重複開發工作。把代碼開源的理論遷移到產品設計當中，最後得出結論，原型的重複使用也應該被提倡。

開源，是PHP風傳併流行的重要特點之一。當然，它同時必須滿足實用和可被重複使用的條件。我們都很熟悉AK47（俄語：Автомат Калашникова образца 1947 года，意為「卡拉什尼科夫1947年自動步槍），它可以說是武器史上開源的典範，設計者把實用威力強大的AK47設計稿免費公佈於世，導致AK47被大規模複製生產，在黑市上價格最低只需要30USD。AK47的部件非常簡單，容易拆分，可重複使用性強，製造成本低廉。以至於我們在新聞上經常可以看到這一幕，武裝分子的典型裝備。

回到產品設計里，如果我們去觀察，不難發現，同一定位的不同產品的基本功能大多數是一樣的，而差異化的往往是那20%的地方。就像所有的電子商務網站（亞馬遜、京東、蘇寧）都有一套極為類似的導航欄和搜索框功能，同時他們的購物車功能也是大同小易的。

為什麼是這樣的呢？實際上它們是依據一套固定的自然思維設計的。我們去商場購物的時候，一般是先定位，看商場的導航，找到每一層或不同區域的分類，然後再到相應的商店尋找自己需要的產品，商店裡有衣架、展架等不同形式的展示方式，然後我們再篩選適合自己的商品。即遵循定位&>查看展示&>驗證的過程。這些導航太過類同，以至於用戶在短暫的導航使用交互過程中幾乎不會去思考不一樣的地方。

電商產品的導航有一套標準化方式的，依據產品的場景邏輯去設計導航的信息架構，從而得出一套固有的屬於這類產品的設計模式，而產品設計的初稿第一次被設計出來以後，再運用到其他項目或者對項目進行優化迭代，只需要在原來的基礎上優化處理即可，當然形態可以有較大的變化，但是形態背後的固有設計思路基本上是固定的。而搜索的功能是可以讓用戶直達產品的捷徑，它是和導航相輔相成的，如果用戶在導航找不到自己想要的類別或者導航里的類別與自己對商品分類的認知不一致（即信息架構不合理），或者希望快速找到相應的產品的時候使用的比較多。

那麼，我們如何去設計一套比較抽象又開源可以重複使用的原型呢？

第一步，確定產品的場景，自然思維邏輯，找准用戶的場景需求點。

第二步，確定一套較為完整的原型設計思路。可以參考下面針對註冊架構的設計思路導圖（拋磚引玉，可以運用到購物車、訂單管理、地圖導航等框架中）

第三步，製作出當前產品的原型。以上面的思路為指導，在原型設計過程中把無差別，普遍性的設計工作不經多餘思考的製作出來。

最後，原型製作出來了，進行相應的易用性分析，重點元素做高權重的優化。然後把原型整理成自己的原型庫，分類和存儲，以後再有碰到類似的項目或者需要優化迭代的時候，單獨對這部分進行優化處理。

這一套開源重複使用的設計方法可以讓我們從無創造性的原型設計工作部分解救出來，節約時間，把重要的時間和思考運用到產品20%差異化，酷、好玩的地方中去。

內容來自geekspree

原型設計的根本目的就是為了降低具體開發的時間成本、人力成本，在設計階段做出一個「模型」來驗證設計師的思想是否可行。所以就這個目的而言，使用哪一種工具都是有道理的。

專業如Axure的原型工具，在我看來，比畫圖板之類的好的地方在於，它能夠適應的產品形態更加豐富，且製作出來的原型更接近實際的產品效果。就這一點而言，如果產品擁有複雜的業務流程、界面元素很多，使用這種工具才能真正讓產品經理、開發人員、用戶界面設計人員之間的討論有一個沒有歧義的對象。但是，如果產品功能相對比較簡單（例如一些非智能手機中的遊戲），反而是「截圖」 + 「畫圖板」 + 「白板」來的更有效一些。

原型繪製工具：Mockplus

用過很多繪製原型的產品，無論是Web時代的Axure還是移動時代的墨刀，甚至高保真神器sketch，統統體驗一遍下來後，最終還是只保留了Mockplus。

不得不承認，Axure是一個偉大的產品，能在一個領域專註打磨十幾年，本身就令人尊重，但相對於更加輕便的，Mockplus，Axure就像是一把面面俱到的瑞士軍刀，但事實上，我只需要個指甲鉗就夠了。很明顯，Mockplus就是那把指甲鉗。

不管是針對Web產品還是移動端的產品設計，Mockplus都有很好的支持，簡單、便捷、上手快，產出比高，應該是對Mockplus最中肯的評價了，在交互上支持的也足夠到位，並且，完美支持移動端的展示，在目前我主導過的三個產品線里，除了最開始的那個是用Axure來搞定之外，剩下的都是靠Mockplus，快速產出快速驗證，大愛不已。

對了，選擇Mockplus還有一個很重要的原因就是，它的畫風真的很讓我歡喜，做高保真原型也並沒有阻力，就目前而言，是一款值得去擁有的產品。

這個事情的關鍵取決於你想不想做，工具無所謂

Axure確實比較強大，但它慢；
justinmand也可以，但它更慢；
不嫌棄的話用用國產軟體Mockplus（摩客）：四個主要特點：交互快、設計快、演示快、上手更快。

必須是 Axure 啊
方便管理，復用，迭代

多用母版，交互也封裝到母版裡面
多用組件樣式
多用全局變數

我的理解，用什麼工具並不是非常重要，重要的是如何將產品和交互理念宣傳出來，並能在組中達成一致。產品和交互理念是第一個要考慮的，宣傳效果是基於你本身對此的深入程度。
工具無非就那幾個，axure，mockups，visio，甚至ppt，ps，紙上草圖等，另外有些專門的白板（比如ipad一個大白板，你可以把你的原型草圖畫在上面）。只要能將你的原型清晰的展示給如設計，技術，測試等，都是可以的，看你更熟悉哪種工具了。工具是為產品和流程服務的

ps：目前axure用的比較多，做交互線框圖還是很不錯的。靜態原型可以考慮用ps做。早期先在紙上或白板上畫吧，因為返修率會比較高。

紙上原型討論修改（手畫起來好像比較有靈感），
axure畫基本原型（PS的效果更好，當然時間成本比較高，不過要小心糾結進畫面效果），
visio展示邏輯（邏輯展示對開發人員是很有必要的），
有比較炫的交互設計可以用PPT, 曾經看谷歌這樣做過，後來試過幾次，模擬效果還是很不錯的。

balsamiq mockups