交互設計師在整個產品中需要做的東西有哪些？

12-06

大家好，作為一個交互設計師，除去前期的洞察戰略及產品需求；確定產品功能；到後面的結構框架元素安排等過程中，交互設計師要出的「專業的交互設計稿」「交互設計文檔說明」到底是什麼樣的？求解答，謝謝大家。

謝邀。我就說下我自己對這部分的理解吧，拋磚引玉。
交互文檔通常包含以下幾部分：
一、設計綜述
二、交互原型
三、可點擊原型/動畫demo
----
一、設計綜述：根據項目的大小、優先順序、時間周期的不同，可以有選擇性的包含以下幾部分
1.需求背景：需求來源、相關的用戶數據、要解決的核心問題
2.設計思路：整體解決思路、用戶分析、核心場景、設計創新點
1）整體解決思路：用腦圖的形式表達你的整體思路，也是支持你整個設計的骨架，我曾經梳理的一份思路圖給你參考：

不是文檔中必須包含的，但是在向團隊其他成員和leader彙報的時候，這張圖能夠讓別人在短時間內明確你的計劃和進度，進而展開討論。

2）用戶分析：可以包含簡單的用戶畫像分析，如果有用研的支持能輸出較為準確的用戶描述最好了。下圖是我曾經做過的兩份分析，比較簡單，能夠說明問題足矣：

國外經典的persona模板如下圖：

3）核心場景：給出核心的用戶場景列表，，按照優先順序排序，之後的交互原型也需要圍繞所列的核心場景去展開。

4）設計創新點：交互設計師並不是把原型畫出來，給出一個穩妥的設計就好了，這樣的話產品經理也能替代了，關鍵在於要輸出創新的解決方案，無論大小項目，爭取做出創新，努力去推動，一次推不成，再推一次，這塊是體現設計師水平的核心部分。

5）信息架構流程圖，沒找到手邊的例子，外網找了幾個供你參考：

二、交互原型：交互文檔中的重頭戲，示例如下：

1.交互稿盡量用黑白灰，減少對視覺工作的影響，如果有需要強調的按鈕，可以選取一種彩色來帶代表以突出強調。
2.交互稿盡量按照場景來分，一個場景一套子流程。不要全部都花在一張大圖上，不易理解。
附幾張國外的交互稿供你參考：

3.交互稿通常需要包含：頻率最高狀態、極限狀態、預設狀態、出錯狀態。儘可能的將各種狀態、邏輯、反饋都考慮全面。把規則都梳理清晰。

三、可點擊原型/動態demo
這塊通常用來做演示和方案的比較，讓其他人能夠在真實場景下去「感受」方案，而不是想像方案。推薦幾個工具：pop，flinto，都是適合移動端的快速生成原型非常方便的工具。keynote做一些交互動畫也是很快速的，AE的製作成本高一些，比較適合一些細膩的動畫，通常視覺用的比較多。

關於文檔輸出的格式：
我的工作習慣是：在交互輸出階段，將上述內容的各個部分都整理到郵件中，發給項目相關人，同時郵件會附上一份附件PDF，這份PDF是A4大小的一份文檔，包含了以上所有內容。

採用這個格式輸出的好處是：他人通常沒有時間去下載文檔仔細閱讀，放在郵件里陳述更有可能被閱讀。而附件的PDF文檔是便於你在任何情況下都能用PAD打開，一頁頁翻看，與他人討論。

答主 @侯雯佩寫的很全。

補充幾個點：衝突case，測試例，用戶路徑分析。

交互設計師的交付物嚴重依賴項目背景、項目階段。而且要看你和什麼樣的設計師合作了。
如果是比較厲害的設計師，不要強求設計師每個階段的輸出，否則效率太低了。
關注2個點：
1、和設計師溝通需求。
2、產品經理作為各個工種的統一介面人，給設計師充分的支持、許可權，這樣交互設計師就能保證開發和視覺設計師能完全理解他的設計。
做到這些，成熟的設計師就會根據項目背景和階段來規劃輸出物了。