互聯網產品的交互設計指南(下)

設計研究

大多數的研究是定性的,而不是定量的。通常的情況下,都不會要求交互設計師做設計研究,設計師們一般都會更加信任自己的直覺以及創造產品的經驗。在我們熟悉的領域或者是小型項目中,這或許是要正確的方法。但是如果到了大的、不熟悉的領域里,設計研究就可以幫助避免創造錯誤的設計。

研究方法

觀察

觀察也是最簡單的設計研究方法,不動聲色的去觀察用戶,例如去商場里去觀察用戶是如何購物的。觀察者應該精心的去選擇環境,要在不太會引起人們注意的地方進行觀察。結合用戶實際的使用場景去觀察用戶,記錄下用戶在特定場景中是如何做的。

訪談

訪談是用戶研究的最基本也是最常用的方法,與人們交談、傾聽他們的故事是發現人們態度和體驗的最好方法。我們可以引導被訪談用戶講故事,請用戶講述一些在特定時刻特定情境與產品或服務交互的故事,或者我們可以根據某些主題進行訪談。我們還可以讓用戶繪畫出對某個產品或服務的使用體驗,讓用戶表達出他們所認為的產品。

關于用戶研究這塊兒,網上有大量的文章,這里只列舉最基本的兩個。

構思和設計

構思

知道了用戶的需求和期望,制定好了戰略,現在要做的就是去設計什么了,開始構思并且產生概念。產生設計概念目前各大設計團隊的方式會是頭腦風暴,頭腦風暴不是為項目尋找一個完美的設計,而是盡可能的產生許多的概念。在這個階段最重要的是產生數量而不是質量看,要從不同的角度去產生盡可能多的想法。對于一個新的產品,有必要花費幾天開展頭腦風暴來產生幾百個想法。

頭腦風暴最便捷的工具就是紙和筆。我們需要快速地草草記下一個想法,把它放在一邊,再去想另外一個。在進行頭腦風暴時,不必局限于團隊中的設計人員,可以邀請相關人員、開發人員、工程師甚至局外人都會提出一些讓你意想不到的想法。只要確保參與者都能理解頭腦風暴的原則:1.沒有不好的想法,2.保持關注點,把不想關的想法放到一邊,3.不要在某一個想法上花費太多時間,4.不要在頭腦風暴的時候同時完成其他的任務。

當概念形成后,我們要對產生的概念進行組織,對已經提出的所有想法聚類、命名和排序,以便后續的討論。可以把產生的概念放在一個2*2的矩陣中,來說明連續的區間中每個想法處于什么位置;或者把他們放在表格中,通過屬性來標記這些概念的特性。


交互設計法則

預設用途

事物的外表都能表現給我們一種提示,表明它是如何工作的以及我們應該如何與之交互。預設用途是一種屬性,這些屬性能提供某種與對象或者功能進行交互的提示。椅子因為它的形狀,就提供了椅子能坐的預設功能;按鈕應為它的形狀,就有按的預設功能;拉手由于它的形狀,提供了一種可以拉的預設功能。交互設計可以看做是提供一種預設用途,以便產品的特征和功能可以被發現并被正確的使用。

反饋

反饋是某種提示,意味著某事發生過。對使用產品或者服務的人的任何動作都應該有確認,不管他們的行為多么的輕微:就像移動鼠標的時候光標跟隨者移動,撥打電話時按下手一個按鍵手機上應該顯示一個數字。如果沒有立即明顯的反饋,用戶往往會重復剛做過的動作,例如按下按鈕兩次,這樣做是會引發問題的,例如購買物品的時候會兩次或者多次匯款。人們需要反饋。

數字產品的響應性由開始動作和產品做出反應之間的時間(延時)來確定,延時可以做如下描述:1.及時,產品或服務的響應時間<=0.1秒,用戶認為反饋是及時的,并且可以在沒有察覺到中斷的情況下繼續完后任務。2.延遲,產品或服務的響應時間在0.1秒~1秒之間,此時用戶會注意到延遲。如果這樣的延遲不頻繁的出現用戶會忽視它,反之,用戶會感覺到產品或者服務是很遲鈍的,例如撥號時按下數字鍵后,需要1秒才會顯示在屏幕上,所有的按鍵都是1秒后才會顯示,用戶會變得很沮喪甚至會放棄產品。3.中斷,1秒之后還是沒有反應,用戶會覺得他們正在做的工作中斷了,他們的注意力會從手頭的工作上轉移到其他的產品或是服務上,例如用戶點擊“提交”來完成交易,幾秒過后還是沒有反應,用戶會擔心這筆交易并且懷疑是不是網站出了問題。4.異常終止,如果出現超過10秒的延遲,用戶會覺得手頭上的工作徹底中斷了。

用戶的心智模型

心智模型指的是用戶對系統或對象是如何工作的理解。心智模型通常是由用戶根據設計師提供的提示信息來建立,這些提示信息以預設用途和反饋的形式給出。設計師能使用這些提示信息顯著的控制用戶的心智模型,隱藏或者揭露出產品的內部工作方式。

費茨定律

費茨定律建立了手指和鼠標一類設備的指向行為模型。目標越大,指向它的速度越快,目標越近,指向它的速度越快。費茨定律對于數字設備的三個指示:1.按鈕等可點擊對象需要合理的大小,例如iOS規范中的44*44px規則移動APP按鈕做多大尺寸(引用學UI網的一個教程,如有侵權請聯系我)。2.屏幕的邊和角的位置適合放菜單欄和按鈕這樣的元素。3.出現在用戶正在操作的對象旁邊的控制菜單或工具欄可以被打開的更快,例如點擊鼠標右鍵出現在旁邊的菜單。

希克定律

希克定律描述的是用戶做決定所需的時間由備選項的數量而定。用戶會對所選內容進行細分。但是如果極端遵循這一定律,會做出可怕的設計。試想下,亞馬遜或淘寶把所有的商品全呈現的主頁里......所以,把相同類別的備選項做適當的分組,可以降低用戶選擇時所需的時間。

7加減2法則

不得不說希克定律看起來違背了7加減2規則。7加減2法則闡述,人們在記憶了5~9項信息之后,人的頭腦就開始出錯。有些設計師在任何時候都確保屏幕上不多于7項內容,這樣做難免有些極端了,因為此法則強調的是人們最多可以在短期記憶中記住的信息的數量。當這些信息被顯示在屏幕上時,人們不必存在于短期記憶里,因為隨時都能看到這些信息。舉一個7加減2法則的應用例子,核對電話號碼或者是銀行卡號時,分組顯示數字會讓人們更易于記憶,(155)-(5588)-(7777)。

特斯勒復雜性守恒定律

定律描述了每一個過程都有其固有的復雜性,這個復雜性存在一個臨界點,超過了這個點過程就不能再簡化了,只有把固有的復雜性從一個地方轉移到另一個地方。例如,發送短息,兩個必要的條件就是你的手機號和對方的手機號,你的手機號是不用輸入的,手機會帶著你的信息,對方的手機號手機也會使用常用聯系人等功能做到簡化。交互設計師需要知道特斯勒復雜性守恒定律,首先,設計師需要承認,無論如何完善,所有過程都有一些不能再簡化的元素;其次,設計師需要找到合理的地方來轉移我們設計的產品的復雜性,用戶在發送每一個短信的時候是沒有必要輸入自己的手機號的。

防錯原則

設計師在為產品設置約束來防錯誤的時候使用防錯原則,迫使用戶調節他們的行為,正確的執行操作。在交互設計中,當使用條件沒有滿足時,嘗嘗通過使功能失效來表示。盡可能的通過圖標提示或其他方式表明哪些條件可以讓功能生效是一個好的方式。

隱喻

隱喻是讓用戶理解抽象數字提供的一種方法,最著名的例子就是計算機桌面。桌面隱喻幫助用戶統一了圖形用戶界面。macOS系統里的圖標就是隱喻最好的例子。


細化的文檔

草圖

設計師最好用的工具就是紙和筆了,在紙張上繪制草圖是具有靈活性和易用性的。(截圖作者看到請聯系我)

故事板

故事板技術借鑒了電影制作和廣告制作,通過把故事和附圖結合起來,設計師可以有效的講述關于產品和服務的故事,并在情境中展示它的特性。故事板上的圖片可以是插圖或者是照片,故事板由這些圖片和附文組成。通過故事板,設計師可以展示產品使用的關鍵時刻。(截圖作者看到請聯系我)

任務流程圖

任務流程圖展現的關系將被構造成線框圖。把任務排列成流程圖,可以幫助我們看到產品的初步雛形。任務流程圖可以表示出產品中的頁面順序以及相關操作的流程,顯示出用戶需要在哪里執行哪些動作,并且顯示了哪里需要包含菜單以及信息。(截圖作者看到請聯系我)

線框圖(低保真原型)

線框圖用來展示產品結構、信息層次、控件和內容。線框圖(低保真原型)通常是交互設計師創造產品時最重要的文檔,線框圖是記錄產品特性的一種方式,這些特性包括相應的技術和商業邏輯。線框圖是產品的藍圖,團隊中人員可以通過它全面的理解產品。

線框圖應該粗略的勾勒出產品形式。包括:內容,能發現和接觸功能的必要控件,訪問、瀏覽和操作以上兩個要素的方法。線框圖中還應包含所有細節的注釋、說明等內容。

關于低保真原型的繪制,我會在以后的文章中分享一些細致、規范性的內容。(截圖作者看到請聯系我)

開發和測試

到這里,交互設計師輸出了DRD后,設計工作又到了另一個方向,跟進視覺、開發以及測試,保證產品按照自己的設計方案上線。此時設計師的角色變成了排除問題,調整設計以適應代碼,以及與團隊成員共同協作。實際上,為了保證產品達到預期的設計效果,設計師應該加入到這些過程之中,因為一旦開發開始了,肯定會出現未曾想到的問題,我們應該隨時出現在工程師、測試人員身邊來共同解決這些問題。

總結

互聯網已經從電腦屏幕的后面來到了我們周圍的各種事物中,交互設計師不僅要在創建未來新事物的準則方面發揮作用,而且還要保證未來的事物運轉良好、要為用戶的愉悅使用而設計。在未來的互聯網世界里,我們將會看到令人吃驚的進步。交互設計師正位于舞臺的中央,這是一個令人激動人心的時代!

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 229,406評論 6 538
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,034評論 3 423
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 177,413評論 0 382
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,449評論 1 316
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,165評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,559評論 1 325
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,606評論 3 444
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,781評論 0 289
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,327評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,084評論 3 356
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,278評論 1 371
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,849評論 5 362
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,495評論 3 348
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,927評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,172評論 1 291
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,010評論 3 396
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,241評論 2 375

推薦閱讀更多精彩內容