互動設計是一個過程，它不僅僅是畫線框圖。下面是YJBYS小編整理的互動設計的方法，希望對你有幫助!
互動設計的流程
如果一提到互動設計，你就想到畫線框圖或原型圖，那你只對了五分之一。互動設計是一個過程，從開始到結束有一套系統的流程。原型圖只是其中的一個環節。
當接到一個設計專案，怎麼開始?都應該做哪些工作?怎樣儘可能的保證交付物滿足既定的功能以及使用者體驗層面的易用性?
第一步，是任務分析，列出介面所要完成的所有任務。第二步按各任務確定頁面流程，建立資訊架構。接下來是建立統一的頁面佈局包括分割槽等。然後在頁面佈局的基礎上進行原型設計，可以是低保真和高保真的原型圖。最後編寫設計說明。
下面以設計一款動感相簿介面為例，逐步講解各個環節。
1. 任務分析
第一步任務分析。這裡要做的是對於將要設計的這個新介面的所有任務的分析，也就是使用者在介面上能進行的所有操作。這個分析在功能需求的基礎上進行，需求方一般提供一個功能點的'列表。
任務分析最常見的是任務列表，另外有任務流程和任務場景等。下面以任務列表為例。
列出所有主要任務，以及每個主要任務的子任務。再把子任務細分到各個步驟。形成下面這個列表。
主要任務1
子任務1
步驟1
步驟2
子任務2
步驟1
步驟2
主要任務2
…
以動感相簿為例，任務分析列表如下：
1. 瀏覽相簿
1) 瀏覽相簿列表
2) 選擇相簿
3) 瀏覽照片
2. 建立新相簿
1) 新增照片
a) 選擇已有相簿
b) 選擇照片
c) 排列順序
d) 新增字幕文字
e) 選擇動畫效果
2) 新增模板
a) 瀏覽模板
b) 選擇模板
3) 新增音樂
a) 瀏覽音樂列表
I. 試聽音樂
II. 選擇音樂
b) 增加新音樂
I. 開啟本地檔案
II. 選擇音樂
4) 預覽(略)…
5) 命名(略)…
6) 儲存(略)…
3. 修改相簿(略)…
任務列表包括所有功能點，並對每一個功能點的邏輯關係進行整合。必要時會對各任務的使用頻率和其它影響設計的重要因素進行分析，這裡不做解釋了。
2. 頁面流程
任務分析完成後，進入設計的第一步，即設計頁面流程。頁面流程是設計的開始，也是重要的一環。它決定整個介面的資訊架構和操作邏輯。
頁面流程是上一步任務分析的自然轉化。一般來說，一個主要任務就是一個頁面，其它子任務也可以轉化為頁面。
以動感相簿為例，頁面流程如下：
頁面幾乎是把任務分析照搬過來了。所以上一步做好了，這一步很輕鬆，而且越往後越輕鬆。
注意這個流程圖應該包括所有將要設計的新頁面，一個不少，一個不多。它不僅確定頁面內容，頁面數量，還確定各頁面之間的關係。如果在後來設計具體頁面原型時，發現這個流程圖多了或少了頁面，或者頁面關係發生了變化，說明你的功夫不到家(這個比較難，我一般不苛求我們的設計師)。根據原型圖來建立或者修改頁面流程圖，不是在做設計，而是在寫設計說明。
3. 頁面佈局
第三步頁面佈局是具體頁面設計的開始，在上一步知道有哪些頁面需要進行設計後，這裡對頁面進行劃分，對內容進行組織。最重要的一點是確定頁面分割槽。
以動感相簿為例，頁面佈局如下：
總佈局，即通用佈局，適合所有頁面。
具體頁面佈局，在不與總佈局衝突的情況下，有更細節的佈局。
頁面佈局賦予零碎的內容以邏輯性，以分割槽的形式把頁面各區域所對應的功能區確定下來，減少具體設計時的隨意性。這是設計嚴謹與否的表現所在。把類似的操作放在一起，對於使用者來說是可以預見的，使用者能夠判斷哪個操作在哪個區域，減少盲目尋找帶來的困難和疑惑。
4. 原型設計
這一步是大家熟知的，即具體頁面的設計。這一步設計把所有的介面元素表現出來。可以有低保真和高保真原型圖。低保真即是線框圖，高保真多是接近最終效果圖。
下面是動感相簿的低保真原型圖。
5. 設計說明
最後一步需要做的是對所有頁面進行詳細的描述，包括對頁面上所有元素進行說明，比如預設狀態，跳轉頁面，字號字型，尺寸等。這裡就不解釋了。這是交給開發人員的文件，以及測試人員進行測試的依據。
