產品研發流程與合作之交互設計

　　產品研發流程簡介

　　下兩副圖是產品研發簡化流程圖，交互設計環節被增加在提出需求與視覺設計之間，可以直觀看到交互設計起到了承上啟下的作用，但實際上交互設計師做了什麼，如何與其他崗位更好的合作，下面將進行詳細的解說。在此之前，我們先記住交互設計的本質：規劃交互行為方式，設計達成行為的最有效形式。

　　沒有交互設計的研發流程

　　有交互設計的快速研發流程

　　產品研發的六個層次

　　產品研發可以分為上圖的六個層次，其實也就是《用戶體驗的要素》中提到的五層理論再加上一個實現層，這樣拆分後，可以比較清楚的分析出產品由抽象到具象的過程，了解各個崗位的職責。下面將詳細分析每個層次都做什麼，交互設計師在各個層次的職責和作用：

　　戰略層

　　內容：定義產品的方向、概念、定位、目標等;

　　一般是老板們高瞻遠矚，產品經理們深思熟慮絞盡腦汁，用研、市場、交互等同學出謀劃策，就不多說了。

　　范圍層

　　內容：策劃產品的規則、入口、功能、內容

　　負責人：產品經理

　　合作者：交互設計師

　　輸出物：需求文檔

　　在需求定義階段，產品經理常會犯個錯誤——依靠描述用戶行為和界面形式來表達需求：

　　產品經理往往必須借住自己對形式的觀察和設想，或者從用戶的角度描述其操作過程，才能明確自己想要的需求，甚至必須借助自己畫的圖來表達需求。為什麼這麼說，看看電腦裡自己或別人的需求文檔就知道了，如圖示(這些都是產品經理交給交互設計師的需求文檔中的)：

　　需求說明示例一

　　需求說明示例二

　　產品經理依靠描述用戶行為和界面形式來表達需求，有三個壞處：

　　1. 你寫的或畫的不一定合理，這方面交互設計師更專業;

　　2. 交互設計師得按照文檔想出一副畫面或故事，繞著彎去研究你到底要啥，期間還得不斷找茬;

　　3. 你浪費了自己的時間，說嚴重點，你浪費了定義產品需求的時間，偏了重點;

　　所以需求文檔中，最好不要完全借助用戶行為和界面形式的描述來表達需求，而應明確寫出產品功能、目標等等，可以加上參考圖輔助理解。如果產品經理們真的很難表達，或不確定自己要什麼，最好就和交互設計師一起先討論，交互設計師可以幫助你分析其他產品為什麼要這麼設計、或者你想要的一個未曾見過的功能可以怎麼表達，討論好了再制定需求，甚至直接出功能和內容列表都可以。

　　產品經理在范圍層的重心，一定得放在怎麼做才能實現產品戰略目標了。

　　結構層

　　內容：需求的內容規劃、主任務的用戶行為操作流程、界面結構或信息架構

　　負責人：交互設計師

　　合作者：產品經理

　　輸出物：流程圖、架構圖等

　　流程圖

　　架構圖

　　交互設計師在這個層面要梳理需求，找出用戶的主要任務，定義好任務操作流程，規劃好界面結構、各自功能、連貫性，期間要不斷預測和規劃功能的表現形式和用戶使用細節。在此過程中，交互設計師可能會發現一些需求不合理之處，產品經理也可能會根據流程圖、信息架構圖等等，發現一些無法達到產品目標的問題，例如某個功能多余、入口過於分散、結構不夠簡單等等，二者一起完善需求、優化方案，力求主線清晰簡單。

　　框架層

　　內容：產品的基本形式，包括布局、控件、位置、大小、一些操作細節;

　　負責人：交互設計師

　　合作者：產品經理、視覺設計師

　　輸出物：靜態線框圖、可演示低保真原型等

　　交互原型圖一

　　交互原型圖二

　　在這一階段，交互設計師就開始繪制用來表達行為的形式了，確保所用形式可以很好的讓用戶知道重點是什麼、下一步要做什麼、怎麼做、不常用的功能去哪找等等，交互設計師這一階段要做到：

　　1. 主任務流程突出明確簡單，其他任務完整易懂;

　　2. 滿足可用性要求(易學、易見、易用)、用戶體驗優秀、連貫;

　　3. 邏輯正確完整、極限情況處理完善;

　　4. 可擴展;

　　5. 符合產品所在設備系統及平台的設計規范，例如windows的控件規范、iPhone、安卓的設計指南等等，不要輕易創造不規范的控件;

　　6. 視覺設計師可以在此基礎上美化發揮;

　　這也是為什麼會出現交互設計師這一崗位，因為產品經理或視覺設計師都沒有通常精力來做這些，或者從未做過甚至從未考慮過這些。

　　交互原型圖輸出時，產品經理就可以預測視覺稿是否能達到產品定義時期望的效果，查看交互圖中的對內容和功能的側重是否能滿足產品需求了，審核並提出建議;但有的產品經理會要求交互設計師如何設計，例如說“我就要XX這個樣子的”、“我不能接受這種布局”等等，這個時候，請產品經理認清自己和交互設計師的專業職責，讓專業的人做專業的事，大家應該一起各抒己見、向用戶、成本、時間妥協，討論出對於用戶和產品而言最好的方案，而不是讓對方服從自己主觀的想法。

　　此外，若視覺設計師在此階段就參與討論，對產品會更有幫助。視覺設計師要對產品非常熟悉、了解細節始末，實時關注交互原型圖的進展，提出建議，將更有利於產品快速開發、減少後期因“交互原型圖美化後不好看、不生動、界面太擠”之類的原因而修改交互稿。例如對於“鍛造”這個過程，交互設計師設計成了 A+B+C=D這種長條形布局，而做效果圖時，視覺設計師才說難以體現游戲感，希望能畫個爐子，在爐子的周圍擺上材料，爐子中間為鍛造成品，這個時候又要交互設計師重新設計就浪費精力和時間了。

　　另外，如果該項目較為重要，最好在主要界面交互原型圖輸出後，主動邀請權威角色評審，以免後期才得到意見，再修改就來不及或重復工作。

　　表現層

　　內容：產品外觀、企業形象、視覺情感;

　　負責人：視覺設計師

　　合作者：產品經理、交互設計師

　　輸出物：效果圖、動畫等等

　　在表現層，視覺設計師會根據交互原型圖進行繪制，在交互圖的基礎上，可以對布局、控件的形狀、形式進行微調，設計圖標按鈕等等，此時交互設計師應該實時關注，以確保圖形及色彩的認知效果，以及是否有不太合適的更改，或未達到預設的地方;

　　若交互原型圖已經經過了全員評審，視覺設計師或其他任何人最好不要再輕易修改交互相關內容，因為交互原型圖中的可能每一個元素都是交互設計師經過討論、深思熟慮後設計的，或者環環相扣、連接著更多的行為和內容，牽一發則可能動全身。如果想要修改，最好先想想或問問交互設計師為什麼要這麼做，提出更優化的方案。

　　上圖為玩家列表的交互原型圖和效果圖。交互圖中藍鑽、年費、昵稱的位置格式是QQGAME的藍鑽規范，昵稱上限為24位字符，如果按照效果圖擺放，一個是不符合平台規范，另外在列表中也會因為實際昵稱長短不一，導致藍鑽、年費圖標顯得較亂。歡樂豆數字上限為9位數，為容易閱讀加上頓號分割，效果圖沒有預留上限位置，也去掉了頓號。

　　雖然不建議在交互原型圖經過了全員評審後又修改方案，但實際上，在效果圖發出後，往往仍會因為各種“覺得不好看”、“看起來很擠”、“達不到產品目標”等主觀或客觀原因要修改效果圖乃至交互原型圖布局甚至改動功能，這種風險因素很難避免，只能盡量弱化，特別是權威角色若未持續保持關注、在大型評審時可能會提出顛覆性意見。我的建議是交互設計師輸出主要界面的原型圖且通過全員評審後，