一、交互設(shè)計(jì)師是什么

交互設(shè)計(jì)師（英文：Interaction Designer）是指參與完成對(duì)產(chǎn)品與它的使用者之間的互動(dòng)機(jī)制進(jìn)行分析、預(yù)測(cè)、定義、規(guī)劃、描述和探索的過(guò)程的設(shè)計(jì)師，即定義人造物的行為方式的工作者。交互指的是產(chǎn)品與它的使用者之間的互動(dòng)過(guò)程，而交互設(shè)計(jì)師則是秉承以用戶為中心的設(shè)計(jì)理念，以用戶體驗(yàn)度為原則，對(duì)交互過(guò)程進(jìn)行研究并開(kāi)展設(shè)計(jì)的工作人員。

二、交互設(shè)計(jì)師的職能

交互設(shè)計(jì)是以一種目標(biāo)導(dǎo)向設(shè)計(jì)，所有的工作內(nèi)容都是圍繞著用戶行為去設(shè)計(jì)的。交互設(shè)計(jì)師通過(guò)去設(shè)計(jì)用戶的行為，讓用戶更方便更有效率的去完成產(chǎn)品的目標(biāo)任務(wù)，獲得愉快地用戶體驗(yàn)。

交互設(shè)計(jì)師的職能

從上圖中可以看出，交互設(shè)計(jì)主要干三件事：定義部分需求、定義信息架構(gòu)和操作流程、組織頁(yè)面元素并制作原型demo。

1、完善需求

需求不只是業(yè)務(wù)需求還有用戶的情感需求 ，在情感分析方面，交互設(shè)計(jì)還是有優(yōu)勢(shì)的，交互設(shè)計(jì)師需要協(xié)助產(chǎn)品人員一起完善需求。

2、定義框架

這部分的內(nèi)容屬于交互設(shè)計(jì)師的核心工作內(nèi)容，也就是我上一章節(jié)所講的框架設(shè)計(jì)階段。這個(gè)階段的產(chǎn)出質(zhì)量直接影響到業(yè)務(wù)目標(biāo)和轉(zhuǎn)化率。如果框架混亂，接下來(lái)的界面怎么優(yōu)化都是無(wú)效的。這好比大型超市的走道設(shè)計(jì)，如果路線規(guī)劃的不好，再多再大的指引圖標(biāo)都是低效的。交互設(shè)計(jì)就是讓用戶快速完成目標(biāo)，提升操作效率，這才是框架設(shè)計(jì)的意義所在。定義框架包括結(jié)構(gòu)導(dǎo)航設(shè)計(jì)、流程的設(shè)計(jì)。

(1)、結(jié)構(gòu)導(dǎo)航的設(shè)計(jì)

把我們的產(chǎn)品想象成一個(gè)巨大的圖書(shū)館，我們需要幫助用戶（有目的性的、目的不明確的，無(wú)目的性的）尋找他們感興趣的圖書(shū)，怎么幫助用戶準(zhǔn)確的尋找完成目標(biāo)任務(wù)，這就是導(dǎo)航設(shè)計(jì)。導(dǎo)航的設(shè)計(jì)任務(wù)一般在新項(xiàng)目或重構(gòu)項(xiàng)目。

導(dǎo)航大概可以分為三種類型：結(jié)構(gòu)導(dǎo)航、關(guān)聯(lián)導(dǎo)航、可用性導(dǎo)航，交互設(shè)計(jì)師的首要任務(wù)就是將業(yè)務(wù)內(nèi)容信息組織分類，劃分出主次關(guān)系，根據(jù)業(yè)務(wù)目的和用戶習(xí)慣定義規(guī)劃全局導(dǎo)航和局部導(dǎo)航的設(shè)計(jì)。

(2)、流程的設(shè)計(jì)

在流程的規(guī)劃設(shè)計(jì)中要遵循：1、以業(yè)務(wù)目的為主要導(dǎo)向；2、兼容到用戶的習(xí)慣；3、盡量讓流程做減法，多一個(gè)流程就會(huì)丟一部分用戶；4、任務(wù)是連貫和清晰的；5、考慮實(shí)現(xiàn)方式的復(fù)雜程度。

3、組織頁(yè)面元素并制作原型demo

經(jīng)過(guò)了需求的完善和框架的設(shè)計(jì)，之前的這些工作還是停留在抽象的想法階段，怎么把想法轉(zhuǎn)達(dá)給項(xiàng)目組的其他人員呢？交互還需要把想法和規(guī)劃表達(dá)出來(lái)，那么最好的方式就是制作原型Demo。把Demo做出來(lái)，讓產(chǎn)品，開(kāi)發(fā)，測(cè)試直觀的看到產(chǎn)品的雛形, 再?gòu)V泛的接受意見(jiàn)，對(duì)原型進(jìn)行不斷的修正，改進(jìn)，做簡(jiǎn)單的用戶測(cè)試?yán)^續(xù)挖掘情感需求。

三、交互設(shè)計(jì)師工作內(nèi)容

交互設(shè)計(jì)師工作內(nèi)容包括：對(duì)產(chǎn)品進(jìn)行行為設(shè)計(jì)和界面設(shè)計(jì)。 行為設(shè)計(jì)是指各種用戶操作后的效果設(shè)計(jì)。具體表現(xiàn)為：

1、分析業(yè)務(wù)需求，深入研究用戶的使用偏好、習(xí)慣和需求，設(shè)計(jì)產(chǎn)品的信息展示架構(gòu)、人機(jī)交互界面結(jié)構(gòu)、用戶操作流程、交互反饋細(xì)節(jié)等；

2、輸出清晰的產(chǎn)品交互原型和交互說(shuō)明文檔，對(duì)產(chǎn)品的整體用戶體驗(yàn)與交互設(shè)計(jì)質(zhì)量負(fù)責(zé)；

3、與產(chǎn)品經(jīng)理、視覺(jué)設(shè)計(jì)師和開(kāi)發(fā)工程師合作，跟進(jìn)產(chǎn)品的開(kāi)發(fā)與落地；

4、結(jié)合用戶反饋、競(jìng)品分析、用戶研究等多角度信息，對(duì)產(chǎn)品的交互體驗(yàn)和功能進(jìn)行改良，持續(xù)優(yōu)化產(chǎn)品的可用性、易用性和用戶體驗(yàn)；

5、參與交互規(guī)范的制定，輸出交互規(guī)范文檔。

四、交互設(shè)計(jì)師的職業(yè)要求

交互設(shè)計(jì)師所需的知識(shí)按照交互設(shè)計(jì)的一般流程，即從需求分析開(kāi)始，到信息架構(gòu)、流程設(shè)計(jì)，到原型設(shè)計(jì)，再到可用性測(cè)試，大致包含以下幾方面。

1、熟練使用原形制作工具，熟練運(yùn)用交互設(shè)計(jì)各種方法；

2、對(duì)交互有熱情和興趣，有一定知識(shí)積累和眼界。富有激情和創(chuàng)造，勇于挑戰(zhàn)。

3、有很強(qiáng)的執(zhí)行力，出色的溝通意識(shí)和表達(dá)能力，能與團(tuán)隊(duì)和不同職能部門密切合作。并對(duì)工作有規(guī)劃、有結(jié)果、有積累。

4、豐富的相關(guān)經(jīng)驗(yàn)和項(xiàng)目背景，能快速理解產(chǎn)品、運(yùn)營(yíng)模式。熟悉視覺(jué)與前端技術(shù)，了解開(kāi)發(fā)常識(shí)。

5、建立交互數(shù)據(jù)分析模型、建立監(jiān)測(cè)規(guī)則，整理結(jié)果。通過(guò)深度的分析和發(fā)掘?qū)W(wǎng)站、產(chǎn)品和流程的體驗(yàn)進(jìn)行優(yōu)化

6、通過(guò)數(shù)據(jù)指導(dǎo)對(duì)UED產(chǎn)出和產(chǎn)品設(shè)計(jì)。對(duì)運(yùn)營(yíng)模式進(jìn)行策略影響，增強(qiáng)業(yè)務(wù)合作方對(duì)交互數(shù)據(jù)的認(rèn)知。

7、有較好的溝通能力、團(tuán)隊(duì)合作能力。

五、交互設(shè)計(jì)師工作流程

一個(gè)規(guī)范的交互設(shè)計(jì)師的工作流程是：需求分析→設(shè)計(jì)初稿→設(shè)計(jì)細(xì)化→設(shè)計(jì)評(píng)審→設(shè)計(jì)走查→效果評(píng)估。

1、需求分析

在這個(gè)階段，交互設(shè)計(jì)師要配合產(chǎn)品經(jīng)理做好市場(chǎng)調(diào)研工作，深刻理解需求，因?yàn)橹挥欣斫饬诵枨?，才能做出符合自身產(chǎn)品特性的好設(shè)計(jì)。同時(shí)也要對(duì)競(jìng)品進(jìn)行一定的調(diào)研與分析，充分的競(jìng)品分析完善你的用戶場(chǎng)景，幫你更好地了解產(chǎn)品用戶。尋找你的產(chǎn)品與競(jìng)品之間的共通性及差異點(diǎn)，找到自己產(chǎn)品的競(jìng)爭(zhēng)優(yōu)勢(shì)，可以幫你清晰自身產(chǎn)品定位，打通自身產(chǎn)品賣點(diǎn)。

工作內(nèi)容：需求討論、競(jìng)品分析、數(shù)據(jù)分析、用戶調(diào)研

2、設(shè)計(jì)初稿

了解了關(guān)鍵用戶信息，交互設(shè)計(jì)師在這一步會(huì)梳理產(chǎn)品任務(wù)流程圖、產(chǎn)品結(jié)構(gòu)圖，以進(jìn)行管理信息和組織信息，為方便繪制原型圖，同時(shí)也要輸出交互設(shè)計(jì)最重要的交互文檔。

工作內(nèi)容：系統(tǒng)架構(gòu)圖、用戶流程圖、導(dǎo)航設(shè)計(jì)、頁(yè)面布局、重要的交互方式。

3、設(shè)計(jì)細(xì)化

細(xì)化產(chǎn)品功能、內(nèi)容，得出交互原型，進(jìn)行測(cè)試驗(yàn)證。這個(gè)階段，需要對(duì)產(chǎn)品的信息、功能進(jìn)行優(yōu)先級(jí)排布，進(jìn)一步細(xì)化產(chǎn)品形態(tài)，得出詳細(xì)的功能、流程設(shè)計(jì)，并畫(huà)出設(shè)計(jì)原型，交互Demo，并交與用戶測(cè)試。

4、設(shè)計(jì)評(píng)審

設(shè)計(jì)評(píng)審的參與者有：產(chǎn)品、設(shè)計(jì)、前端、后端、測(cè)試，主講人為設(shè)計(jì)師。設(shè)計(jì)師對(duì)自己的設(shè)計(jì)產(chǎn)出進(jìn)行詳細(xì)講解，包括導(dǎo)航設(shè)計(jì)、用戶使用流程、設(shè)計(jì)細(xì)節(jié)、異常狀態(tài)等（不講視覺(jué)，因?yàn)樵跇?biāo)注里有）。主要照顧的對(duì)象是前端、后端、測(cè)試。前后端關(guān)心能不能、好不好實(shí)現(xiàn)，接口怎么寫。測(cè)試關(guān)心邏輯是否清晰。

一般情況下，需求評(píng)審?fù)旰?，后端就已?jīng)開(kāi)始工作了，此時(shí)后端最關(guān)心的就是，設(shè)計(jì)方案是否會(huì)影響到自己的實(shí)現(xiàn)方法。如果有，一般是比較介意的，因?yàn)樗倒?。所以，在跟產(chǎn)品經(jīng)理之前做設(shè)計(jì)溝通的時(shí)候，如果有后端實(shí)現(xiàn)方法的變更，要及時(shí)同時(shí)后端。這個(gè)一般產(chǎn)品經(jīng)理能判斷出來(lái)。

5、設(shè)計(jì)走查

前端樣式和交互寫完，就可以進(jìn)行設(shè)計(jì)走查了，設(shè)計(jì)師對(duì)前后端實(shí)現(xiàn)的效果進(jìn)行驗(yàn)收，把不符合設(shè)計(jì)稿的地方記錄下來(lái)提給相應(yīng)的研發(fā)，讓研發(fā)修改。這個(gè)過(guò)程可能會(huì)循環(huán)好幾遍。

6、效果評(píng)估

項(xiàng)目上線后，1-2個(gè)星期就行設(shè)計(jì)評(píng)估，包括定性和定量。通常采用的方式是用戶調(diào)研、可用性測(cè)試、各種用戶反饋渠道搜集。交互設(shè)計(jì)師需要分析用戶反饋問(wèn)題的合理性、是否需要優(yōu)化。對(duì)于值得重視的反饋，需要思考設(shè)計(jì)方案、推進(jìn)實(shí)現(xiàn)。

六、交互設(shè)計(jì)師常用工具

1、axure 原型工具

Axure是交互設(shè)計(jì)師最核心的工具，Web端產(chǎn)品使用較多。通過(guò)它輸出的"原型"（交互稿）是交互設(shè)計(jì)師與產(chǎn)品經(jīng)理、前端開(kāi)發(fā)、后端開(kāi)發(fā)、測(cè)試等人員溝通的最好媒介。"原型"是產(chǎn)品開(kāi)發(fā)前期的重要設(shè)計(jì)內(nèi)容，它直觀的體現(xiàn)了產(chǎn)品的框架結(jié)構(gòu)、界面內(nèi)容以及功能模塊之間的邏輯關(guān)系，且不斷確認(rèn)產(chǎn)品中的模糊部分，為后續(xù)的視覺(jué)設(shè)計(jì)，產(chǎn)品開(kāi)發(fā)提供了準(zhǔn)確的產(chǎn)品信息。主要功能除了繪制"原型設(shè)計(jì)圖"，還包括"操作流程圖"、"信息架構(gòu)圖"等其它內(nèi)容。

2、Sketch （蘋果電腦）

Sketch大部分功能和操作思路，和Axure是一樣的，如果我們期待做更精致的原型界面，或者出高保真原型時(shí)，sketch是個(gè)很好的工具。各種方便的插件，大大提升了工作效率。目前工作過(guò)的團(tuán)隊(duì)基本UI設(shè)計(jì)都是使用的sketch，如果大家使用同一種工具，那么在交流、修改等時(shí)間成本上就會(huì)快很多。

3、Xmind or Mindmanager思維導(dǎo)圖工具

XMind/mindmanager是非常實(shí)用的思維導(dǎo)圖軟件，簡(jiǎn)單易用，功能強(qiáng)大。在進(jìn)行產(chǎn)品規(guī)劃，頭腦風(fēng)暴，任務(wù)分析等工作時(shí)，都需要借助XMind來(lái)完成。XMind的文件可以導(dǎo)出成Word，PPT，PDF，圖片等格式，方便將內(nèi)容與其他人共享。

4、Viso

viso這款工具主要是用于繪制流程圖，操作簡(jiǎn)單易懂，小伙伴們上手練練就能懂。另外就是ProcessOn，這是一個(gè)在線作圖工具的聚合平臺(tái)，它可以在線畫(huà)流程圖、思維導(dǎo)圖、UI原型圖、UML、網(wǎng)絡(luò)拓?fù)鋱D、組織結(jié)構(gòu)圖等等，無(wú)需擔(dān)心下載和更新的問(wèn)題，不管Mac還是Windows，一個(gè)瀏覽器就可以隨時(shí)隨地的發(fā)揮創(chuàng)意，規(guī)劃工作。

5、Figma

Figma是一個(gè)基于瀏覽器的在線工具，與墨刀相似，現(xiàn)在也有桌面版，個(gè)人版免費(fèi)；界面與Sketch相仿，可以制作可交互原型。在國(guó)外是時(shí)下最多人用的交互設(shè)計(jì)軟件之一。但Figma只有英文版，對(duì)網(wǎng)絡(luò)也有要求。很好用的一個(gè)交互工具，只是目前在國(guó)內(nèi)不好推廣。

6、MockingBot 墨刀

墨刀是一款在線原型設(shè)計(jì)與協(xié)同工具，以前只有網(wǎng)頁(yè)版，現(xiàn)在也有客戶端，但都需要聯(lián)網(wǎng)使用。有點(diǎn)類似于Figma，國(guó)產(chǎn)中文版的一款很好的交互設(shè)計(jì)軟件。

優(yōu)點(diǎn)：墨刀上手難度不高，墨可以實(shí)現(xiàn)元素切換、界面跳轉(zhuǎn)，動(dòng)效平滑，可以調(diào)試參數(shù)；支持win和mac，有桌面版，支持移動(dòng)端預(yù)覽（iOS&AndROId），有Sketch插件等。

不足：也是無(wú)法實(shí)現(xiàn)條件判斷等復(fù)雜交互邏輯（不過(guò)這對(duì)于很多項(xiàng)目來(lái)說(shuō)也不一定要做出來(lái)，有時(shí)間成本和學(xué)習(xí)難度）。

7、Mockplus

Mockplus（摹客）是一款簡(jiǎn)潔快速的原型圖設(shè)計(jì)工具。適合制作低保真原型，界面簡(jiǎn)單，能夠快速上手。

優(yōu)點(diǎn)：界面簡(jiǎn)潔，快速上手，有交互組件可用，可生成單獨(dú)的壓縮包，打開(kāi)即可演示。摩客還有一個(gè)原型托管平臺(tái)，也挺方便，不過(guò)要收費(fèi)~

缺點(diǎn)：無(wú)法實(shí)現(xiàn)復(fù)雜邏輯如條件判斷等情況的交互，市面上可用的組件較少；適合做手機(jī)的簡(jiǎn)單原型，不適合做網(wǎng)頁(yè)的原型。2年前用過(guò)，不知道現(xiàn)在這么樣，平臺(tái)收費(fèi)，開(kāi)發(fā)運(yùn)維不易，支持國(guó)產(chǎn)。

七、交互設(shè)計(jì)師常見(jiàn)問(wèn)題

1、作為交互設(shè)計(jì)師，最有成就感的是什么時(shí)候?

能看到自己在工作中的成長(zhǎng)變化是很容易產(chǎn)生成就感的吧，還有與產(chǎn)品經(jīng)理和研發(fā)的同事們共同探討一個(gè)新功能，偶爾能夠相互帶來(lái)啟發(fā)和新方法的時(shí)候也會(huì)覺(jué)得有收獲，有成就感。

2、交互設(shè)計(jì)師的產(chǎn)出物是什么？

交互設(shè)計(jì)師產(chǎn)出物應(yīng)該是交互設(shè)計(jì)稿。還應(yīng)該包括或包含： 完整的流程圖。更多的指用戶側(cè)的流程，如果有邏輯復(fù)雜、異常流的情況下，必須要提供。

總結(jié)

優(yōu)化猩SEO：交互設(shè)計(jì)的好壞會(huì)影響用戶對(duì)產(chǎn)品的印象，同時(shí)也會(huì)影響用戶對(duì)品牌的看法，作為一個(gè)交互設(shè)計(jì)師，必須要對(duì)用戶體驗(yàn)方面的理論有較深的理解和認(rèn)識(shí)，才能為更好的完成產(chǎn)品的交互設(shè)計(jì)。

參考鏈接：

交互設(shè)計(jì)師_百度百科

https://baike.baidu.com/item/%E4%BA%A4%E4%BA%92%E8%AE%BE%E8%AE%A1%E5%B8%88/3329267

交互設(shè)計(jì)師崗位職責(zé)_交互設(shè)計(jì)師工作內(nèi)容是什么- 職業(yè)百科

https://baike.zhipin.com/wiki/sfab49a48a3676c701Xw~/

交互設(shè)計(jì)師的工作流程 - 知乎

https://zhuanlan.zhihu.com/p/158648034

修改于2023-08-27