專業科班的答案!一個完整的交互設計流程是怎樣的?

編者按:初學交互設計的新人,因為沒有做過任何的設計項目,所以不知道整個交互設計師的工作流程會有哪些內容,今天這篇文章請了專業科班出身的設計師來科普他們在實際項目中的工作流程,強烈建議閱讀。

Spell(高級產品設計@Salesforce):先說下我的背景吧。我是國內軟體工程本科+美國UW HCDE master,現在在矽谷做用戶體驗設計並且教用戶體驗課程。在這裡我想給出我負責的幾個項目里所用到的流程,這些也是我教給學生的流程。

我自己教課的經驗以及我和其他教授討論的結果就是,About Face在北美各大最頂尖的交互設計/HCI院校都是學生的必讀物不假,但是教授在啟發學生真正去做項目的時候,往往會告知他們:

1. 這些步驟並不是每步都是必須的,要根據項目去分析你所使用的方法

2. 這個過程中每一步都是和用戶相關的,切莫主觀臆斷。

所以其實業界對於方法論的認識,和學術界是有偏差的,業界的步驟可以被總結為:

1. 認識產品所要解決的問題

像我以及眾大神們經常強調的一樣,交互設計的初衷就是解決用戶的問題。不論設計什麼產品,能夠被用戶認可的途徑只有這個產品解決了他們生活中的一個問題。

交互設計的第一步,不論是對成熟產品還是初創產品都一樣,就是定義這個設計到底要解決用戶的什麼問題。像之前很多人提到的一樣,這一步的做法有:用戶訪談,實地考察,發放問卷等等。

這一步可以說是整個流程中最核心的一步。

比如當年在亞馬遜的時候,我們想研究一下在義大利市場的亞馬遜存在哪些問題,於是我們的用研人員就去了義大利。在實地考察的過程中發現了很多有意思的事情,比如義大利家用電腦其實普遍比較落後,快遞系統也和美帝有很多不同等等,那麼翻譯成用戶的實際問題,就變成了用戶看到的信息過載的網頁往往需要更長時間載入,而他們在意的關於快遞的很多信息卻不能直接從網站上得到等等。當然這只是研究發現的很小一部分,舉這個例子的意思是說,只有真正的在用戶所處的環境里,看到他們到底在做什麼,如果使用產品,有哪些問題,才能為自己的設計打下基礎。

2. 收集能解決這一問題的用戶相關的信息

了解了自己要解決什麼問題之後,還要確定自己到底要為誰解決這個問題。近些年面試有個很大心得,就是即使在矽谷這個用戶體驗已經被炒的熱的不能再熱的地方,很多人仍然不知道如何了解自己的用戶。當聽著面試者給我大談特談persona的時候,我就很想告訴他們,你那個訪談了三五個用戶的東西,根本也不是persona。下面這個是Weebly的persona,原文在此Persona Cards by Ryan Hunter。至於做的怎麼樣我大家可以自己體會一下。(我會說我的好朋友兼美國同事和他們的CEO有個人糾葛我很難給出公正評價咩)

了解用戶的途徑其實特別多,很多人為了表現自己特別熟悉UX的各種方法,而在選擇著華而不實的調研的途徑。其實了解用戶是誰的最好途徑,就是通過協作。做市場,銷售,用戶支持等各個崗位的人,都會對這個問題有自己的見解。在這個基礎上,再通過訪談以及觀察確認到底誰才是你真正的用戶,往往比你直接start from scratch(從零開始)要有效的多。

有一張很經典的圖,送給大家。圖片來自About Face 4,是Cooper加工過的版本。這個具體問題要講其他估計得能講上好幾個小時,歡迎大家來切磋。

3. 提供這一問題的解決方案

其實這一階段,可能是我認知中和傳統設計理論和方法中最貼近的一個階段。線框圖,不同方式的建模,頭腦風暴,流程圖,到原型圖,所有的設計方法在這個階段都可以用。

不過對於複雜的系統,我想特彆強調一下線框圖和流程圖的巨大幫助。我有幸在老東家帶著大家做了個用戶數量龐大的產品,複雜系統中的分支情況和邊緣條件,往往不是設計師在設計過程中最直覺去考慮的內容,而線框圖和流程圖,可以很大程度的幫助這一過程。同時,也是跟PM已經程序員撕逼大戰的時候的利器,一個定義好了的線框圖,可以最大程度的避免需求一改再改。(反正一直改需求的PM可能也不是好PM哼╭(╯^╰)╮)

4. 驗證所提出的解決方案

交互設計的難點和亮點我覺得就是驗證和迭代的過程。說到底有才的人畢竟很多,有創意的方案層出不窮,能經歷用戶和市場考研的方案才是好方案。

測試的過程那就太多了。我先羅列幾個基本我做過的每個公司都會用的:(*如果我的翻譯有誤歡迎指出,我可能只熟悉他們的英文說法)

1、用戶測試(usability testing)

我見過的幾個用戶測試實驗室,基本設置都差不多,就是用戶在一間房間裡面做測試,房間裡面要不就是有攝像頭,要麼就是有隻能單向看到的玻璃,然後其他旁觀測試的同事都會在另一間會議室,要麼看實時直播,要麼就通過玻璃直接觀察。這樣的目的是為了讓用戶在儘可能自然的情況下進行測試。要知道,當年我最怕的就是用戶告訴我:為了做你們的測試,我昨晚很認真的研究了一下amazon!真是淚崩。

2、AB 測試

這個就不是一個交互設計師自己能夠完成的了,需要工程師哥哥們的配合。我個人還是AB testing的忠實粉絲的。只是曾經待過的某互聯網巨頭(說老東家壞話有點心虛此處略去名字了)所有的設計都要經過AB testing,而每次贏得勝利的都是比較丑的那個,當時玻璃心也是收到了一萬點傷害的。畢竟還是有設計師對於美學的追求的。

扯回來。AB testing在很多時候其實都很有用,有個叫GoodUI的組織經常會講一些他們做AB testing的發現,很有幫助,但是每個報告都要錢。下面就是個例子,是說你在自己的網站上面自誇的效果是不如引用別人在社交媒體上的評價的。聽起來誰都知道,但是人家有了數據是不是撕逼的時候就更容易了,比如PM說咱們要寫一大段這樣那樣的話的時候就可以拿出這些數字甩他們一臉了(感覺自己以後很可能全職做產品了這樣說PM真的好么)

3、五秒測試 (five second test)

不知道這個測試現在在國內有沒有人用,我個人非常喜歡。就是你給一個用戶看你的設計五秒,只有五秒,然後讓用戶回答一個問題。我目前覺得這種測試適合非常小的點,比如一個icon用戶到底能不能認出了,別自己做的是嫩牛五方別人以為是麥辣雞這樣。一個很好的做五秒測試的網站是The original Five Second Test a€¢ UsabilityHub,大家可以去試試。

4、遠程測試(remote testing)

遠程測試太熱了,最近我們想買一個服務做遠程測試,結果被價格嚇得一臉豪血。感覺沒法給大家推薦具體用哪個了,我認為非常複雜的產品不適合遠程測試。遠程測試還是2C的產品更好進行測試。

5、熱圖測試(heat map testing)

這個還需要解釋么?就是下面這隻怪物啦

除此之外還有些不具有普世性的測試方法,我就不一一贅述了,比如眼動儀測試什麼的。想最後個在學校的學生以及創業公司的你推薦一個測試方法:游擊隊測試 (guerrilla testing)。其實這個測試特別簡單,就是你拿著你的原型去大街上隨便找人來用,告訴你他們的反饋。當然實踐起來也沒用這麼簡單,你要有很明確的目的,很清楚你想要得到哪方面的反饋,不然一定會被用戶帶著跑偏了的。

圖為我的學生們在洛杉磯做guerrilla testing,全文可以戳這裡https://medium.com/iq-design/how-to-become-a-ux-designer-from-my-experience-of-teaching-ux

5. 改善解決方案

說到最後,交互設計的精髓不就是一直的迭代么,哪裡沒做好改哪裡。對於開發周期很長的傳統行業,互聯網行業賦予設計師最大的自由度,就是隨時沒做好,咱就改唄~具體步驟就是酌情重複前面四步啦~

寫的有點長了,有些地方還沒有寫的特別具體,以後可以慢慢來更新~

作者簡介:Spell,高級產品設計@Salesforce。曾助力微軟,亞馬遜,HTC,Citrix及若干創業公司的產品設計。當下樂趣是將UX的知識傳遞給更多的人,並創立了UXOffer-專註於幫助中國學生獲得最好的HCI/交互設計教育機會。


推薦閱讀:

[人在羽途] 《羽.翼》 簡約簡單的設計仙衣
賦予角色生命——淺談動畫角色設計
橫浜 Adobe MAX 2017
掌握這幾個小技巧,輕鬆玩轉背景設計

TAG:交互設計 | 設計 | 流程 | 答案 | 專業 |