交互原型設計不知如何下手？你需要幾件稱手的「兵器」

原型設計是交互設計師最主要的工作之一，也是體現交互設計師能力的重要一環，原型設計需要儲備大量的知識，比如交互範式、設計原則、平台規範、排版和草圖繪畫，它是產品概念的具象化表達。在這個迭代設計階段，有很多工具可以提高原型設計的效率，下面給大家一一說明。

01 分析與定義

Empathy Map | 用戶分析

Empathy Map可以幫助討論用戶需求，是一種提煉和組織定性數據的方式，是可視化思考的工具。交互原型設計的第一步是通過調研先找到Pain Points。Empathy Map一共有五個需要分析的部分，包括：

Tasks 任務——指用戶需要完成什麼及他們需要回答的問題；

Feelings 情緒——指用戶對於體驗的感受及對他們真正重要的點；

Influences 影響——關於什麼人、什麼事或者地點對用戶如何行為的影響；

Painpoints 痛點——指用戶正在經歷什麼他們希望克服的痛點；

Overall Goal 整體目的——關於用戶最終的目標及他們試圖實現什麼。

下面的Pain Points和Overall Goal是基於上面的三個部分進行的總結。回答問題的時候要先找到Tasks，在分析Feelings和Influences，最後做總結。Empathy Map需要長時間的分析和觀察，最好是團隊合作。

為了做出完整的Empathy Map，需要大量的數據，但是圖1中的語言過於抽象，所以很多人會採用圖2模板來開展初步的用戶分析。從觀察用戶的所看、所聽、所說、所想和所做來進行總結。實際表達的內容上與圖1一致，只是換了一種表達方式而已。

Empathy Map可以以團隊合作的方式進行頭腦風暴式的數據填充，再從這些數據中挑選出最適合的觀點作為Pain Points，最後就可以進入到設計階段了。

大屏幕頭腦風暴 | 功能分析

大屏幕形式的設計方法是在完成了流程圖和信息架構圖後，進行具體UI界面設計時使用的工具。主要功能是通過頭腦風暴來集體討論並設計出界面的架構。參與的人可以有產品經理、UI設計師、UX設計師等所有需要進行功能和外觀設計的交互設計師。

基本的設計順序如下：

1. 需要把界面畫的大一些，貼在牆上。

2. 根據流程圖按順序進行設計。

3. 在產品經理提出主要的界面功能後，其他設計師可利用便利貼進行意見的修改、補充或刪除。

4. 最後由產品經理進行意見整合併確定執行方案。

這樣的方式優點在於可以把每個設計師的專業知識都結合在一起，去決定產品界面的大體框架，具體功能，避免了大量的後期修改，並且這樣討論出來的設計界面質量會很高，但缺點是需要花費大量時間在會議上進行討論。

02 原型設計與測試

紙質原型 | 界面製作與測試

紙質的交互設計界面，優點是可以快速的進行視覺化設計的表達。繪製和測試的方法有兩種。

第一種是先在紙張上繪製連續的界面，完成後用紙質手機模型卡住紙張繪成的「界面」，抽動紙張來模擬界面跳轉。

第二種是可以把彈出的畫面在界面上進行疊加，這樣的方法雖然複雜，但是可以進行即時的修改，測試的時候可以把所有界面都貼在牆上，使用箭頭來引導和跳轉。

Axure | 界面製作與測試

對於界面設計的工具並沒有具體的硬性要求，電腦軟體經常會用到的有Sketch Up、Axure、AI、PS、Briefs等。Axure是一款非常容易上手的軟體，下面給大家簡單的介紹一下：

主菜單工具欄可以進行基本操作，例如：打開、保存、對齊和格式化等。

Pages這一欄，是所有頁面的流程圖，即樹狀圖。可以進行修改、添加、刪除或編輯頁面等操作。

Libraries是元件庫，裡面有很多種默認的元件，按照不同的功能進行了排列，有圖片格式、基本形狀元件、標題、文字、直線和動態面板等。不僅如此，元件庫還可以直接導入rplib文件，提高作圖效率。

Masters其實就是母版。其中標準母版和背景母版最常用，標準母版可以改變界面整體的位置，但裡面的元件為鎖定狀態，而背景母版則是整體位置和元件位置都為固定狀態。

工作區很好理解，就是可以進行設計的面板。

Inspector可以設計界面和界面之間的鏈接方式，是滑動還是彈出等，還可以進行標註和Style設計。

Outline主要是用來對動態面板和功能進行管理，這一點非常像PS和AI里的圖層窗口。

Demonstrate | 用戶測試工具

Demonstrate是一款手機界面用戶測試APP，使用方式非常簡單，不像Axure那樣在電腦上進行繪製，只需把已經設計好的紙質版交互模型拍攝並存入APP，再從APP里創建鏈接分享給朋友即可快速測試並得到反饋。這樣的方式大大提高了工作效率，雖然沒有Axure那麼專業，但是也能滿足基本的測試要求，非常適合不會專業軟體的同學們。相似的APP還有Tapcase、POP、Prott等。

以上就是關於交互原型設計在調研分析階段和模型製作階段中的幾個常用工具及用法的講解，希望對你有所幫助。

歡迎關注SODO官方微信（搜索：sodo_art）

如有設計求職、專業技法、職業提升、求職作品集方面的問題，可私信宇文妍諮詢