藍(lán)藍(lán)設(shè)計( www.alimai.net )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供有效的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點這里

 

@琛桑要做芝麻藝人 ：作為入行不久的交互設(shè)計師，我發(fā)現(xiàn)自己在交互設(shè)計的實踐中無法顧及到方方面面，是存在思維盲區(qū)的。其中有欠缺經(jīng)驗的原因，也有自身知識局限的問題。進(jìn)入開發(fā)階段后，每次需要修改交互時，心里都會有些慚愧，感覺為小伙伴們帶來了不必要的工作量。

然而現(xiàn)實中，交互設(shè)計的改動是難免的（因此一般一個項目會不斷迭代交互文檔），尤其是在時間安排緊促、產(chǎn)品需求不清晰的情況下。怎樣在交互設(shè)計階段盡可能思考周全，減少視覺設(shè)計與開發(fā)的返工呢？抱著提升自我、拯救伙伴的態(tài)度，我結(jié)合自己在移動端app的項目經(jīng)驗進(jìn)行了一些總結(jié)。這并不能涵蓋交互設(shè)計的所有方面，主要著重于設(shè)計時個人覺得容易疏漏的地方。

交互設(shè)計在我看來分結(jié)構(gòu)層面和細(xì)節(jié)層面，兩者在發(fā)現(xiàn)思維盲區(qū)、排查交互設(shè)計問題時的角度有所不同。

結(jié)構(gòu)層面

結(jié)構(gòu)層面的交互設(shè)計是指，通過解析產(chǎn)品需求與核心目標(biāo)，梳理交互邏輯，設(shè)計使用流程、框架結(jié)構(gòu)和基礎(chǔ)功能。其目的是保證產(chǎn)品的可用性?？梢韵胂?，若在開發(fā)過程中對結(jié)構(gòu)層面的交互進(jìn)行改動，成本是比較大的。

一些不成熟的結(jié)構(gòu)層面的交互設(shè)計，我覺得容易出問題的地方主要是：

1. 沒有很好地把握平臺特性。

尤其是Android平臺較iOS復(fù)雜些。比如由于Android手機(jī)對App性能消耗的要求更苛刻，設(shè)計時應(yīng)盡可能地選擇性能耗費少的框架結(jié)構(gòu)；又如大部分Android手機(jī)屏幕上有虛擬按鈕，因此在完成界面設(shè)計后要考慮代表“返回”的虛擬按鈕會把頁面跳轉(zhuǎn)到哪里，使用上是否會帶來困惑。在設(shè)計軟件結(jié)構(gòu)的初期，就需要與開發(fā)人員溝通設(shè)計稿，以便盡早發(fā)現(xiàn)問題。

2. 頁面結(jié)構(gòu)復(fù)雜。

手機(jī)屏幕可謂寸土寸金，合理刪減一個元素，對用戶來說就減少一個思維思維負(fù)擔(dān)或迷惑點。即使方案看起來OK，也需要不斷反問自己：這種功能布局是最簡單的嗎？頁面最主要的操作是什么，是否明顯突出？其他功能或入口是否必要？頁面的組織是否清晰有規(guī)律？……不過需要注意的是，合理簡化結(jié)構(gòu)的提前，是對用戶使用場景有很好地了解。

3. 設(shè)計師與用戶使用經(jīng)驗的差異。

設(shè)計師對自己設(shè)計的產(chǎn)品十分了解，因此容易覺得一切使用起來都理所當(dāng)然，或者覺得別人稍微試一下就知道是怎么回事了。但事實上，很多人并沒這么“聰明”。這就需要邀請對產(chǎn)品和項目不熟悉的“小白”來玩玩交互Demo，看看Ta是否能輕松知道你的產(chǎn)品是做什么的，完成核心功能時是否順暢，哪里會遇到磕絆。

細(xì)節(jié)層面

細(xì)節(jié)層面的設(shè)計附屬于功能點之下（如具體信息的排布，異常狀態(tài)的處理等），可以進(jìn)行獨立優(yōu)化而不影響整體的結(jié)構(gòu)，幫助用戶更好地達(dá)成目標(biāo)。細(xì)節(jié)層面要考慮的東西很多很雜，設(shè)計往往不難，難的是想全。因此，需要有一個系統(tǒng)的思維框架來幫助我們查漏補缺，而不是想到什么是什么。

1. 可以從“我”(使用者本身）和“別人”（其他使用者）的角度，檢查功能點是否齊全。

我：用戶間是存在差異的，有些因素將影響用戶在的需求和使用場景，如是否是第一次使用app，是否是會員等。站在不同用戶的角度想想，“我”在這個頁面想做/能做什么事？做一件事的前、中、后階段，在設(shè)計上是否有體現(xiàn)？我是否可以取消、撤銷或退出某個步驟？如果中途這件事做失敗了呢？

別人：“別人”指與你在使用產(chǎn)品是直接相關(guān)的其他人。別人對我做了什么，我需要知道么？對我有何影響？舉個栗子，在一個“教室”功能的頁面中，我可以和其他同學(xué)一起聽老師上直播課。這里老師對我有一些權(quán)限：禁止/允許我打字聊天，讓我上麥發(fā)言/下麥，把我踢出教室，給我發(fā)私聊。當(dāng)老師對我做這些事的時候，我是否能明白是怎么回事？我知道應(yīng)該做出什么回應(yīng)嗎？我收到的提示足夠清晰嗎？

2. 檢查特殊情況。

一方面，想想用戶在使用產(chǎn)品時的主要場景是什么，有哪些影響因素。常見的影響因素有：

網(wǎng)絡(luò)環(huán)境：有無網(wǎng)絡(luò)，網(wǎng)絡(luò)狀況不好，突然斷網(wǎng), 是否為Wifi環(huán)境，Wifi環(huán)境與非Wifi環(huán)境之間的轉(zhuǎn)換等。明確網(wǎng)絡(luò)情況的變化對用戶有怎樣的影響，是否需要讓用戶重新作出操作上的選擇，是否需要進(jìn)行明確的提示。

時間因素：操作的時間限制，某些功能的定時開啟等。需要考慮在不同時段，產(chǎn)品功能會有怎樣的差異，用戶是否可以預(yù)見這樣的差異。假如產(chǎn)品上的支付功能是有時間限制的，一定時間之后訂單將自動取消。那么設(shè)計上是否已經(jīng)明顯地告訴用戶這一點？在訂單頁支付倒計時結(jié)束后，會發(fā)生什么情況？

數(shù)量限制：當(dāng)某個功能對數(shù)量有限制時，操作的時機(jī)就變得很重要。以在app上報名班級（圖1）的操作為例，假設(shè)班級容量為20人，確認(rèn)報名訂單時暫時扣去一個名額庫存，完成支付時完全扣去這個名額。如果當(dāng)你報名班級時，名額已滿，但還有人未付款，這時系統(tǒng)應(yīng)該有什么提示？這和報名班級時，班級絕對性滿員（名額已滿，且所有人完成付款）的情況處理方式是不一樣的。另一種情況是，在你進(jìn)入確認(rèn)訂單頁時，名額未滿，但當(dāng)你按下“確認(rèn)”訂單，此時名額已經(jīng)滿了，也應(yīng)該有相應(yīng)的提示。像這種對數(shù)量敏感的功能，應(yīng)盡量明確地告訴用戶限制條件，當(dāng)前的相關(guān)狀態(tài)是怎樣的（未滿員，暫時滿員，或已滿員？），防止用戶進(jìn)行不必要的操作。用戶若第一時間沒有理解，可能需要進(jìn)一步友好地提示。

圖1. 班級報名關(guān)鍵頁面

另一方面，想想單個頁面元素會有哪幾種狀態(tài)。常見的狀態(tài)分類有：

中間狀態(tài)：在進(jìn)行下載、上傳、導(dǎo)入等操作時，用戶會有等待的過程。在這過程中，界面的狀態(tài)是怎樣的？怎樣讓等待不那么痛苦？是否允許中途取消？

控件狀態(tài)：控件激活、未激活、使用中的狀態(tài)是怎樣的？是否有一些限制？狀態(tài)轉(zhuǎn)變時會發(fā)生什么？其他情況的變化對控件的狀態(tài)是否有影響？以一個教室頁面的文字輸入框（圖2）為例，在輸入框中

輸入文字時，我們會在界面展示上做限制：輸入框最多顯示4行文字，鍵盤收起后保留輸入框狀態(tài)。此外。在上課過程中如果學(xué)生不守紀(jì)律，會被禁言。禁言時輸入框的狀態(tài)是怎樣的呢？是完全不可用，還是可以編輯文字但無法發(fā)送？經(jīng)過仔細(xì)思考以及和開發(fā)的溝通，我給出的方案是：被禁言時，用戶仍然可以輸入文字，只是不能發(fā)送。如果是在文字輸入過程中（鍵盤展開）被禁言亦然，此時仍然可以編輯文字，只是無法發(fā)送。

加載狀態(tài)：加載數(shù)據(jù)（文字，圖片，音頻，視頻，數(shù)據(jù)包等）的過程中，界面元素會有怎樣的變化？長時間加載未成功怎么辦？

刷新狀態(tài)：刷新數(shù)據(jù)是自動還是手動的？執(zhí)行刷新操作時界面哪些原色會產(chǎn)生變化？刷新失敗了呢？

圖2.教室頁面的文字輸入框

以上說的這些方法，也許可以幫我們掃除一些交互設(shè)計上的漏洞。但還有一部分漏洞可能來自我們自身的

心理盲區(qū)

1. 對抗。

聽到與自己的想法不同的意見，人本能的反應(yīng)就是找理由反駁。在和產(chǎn)品經(jīng)理等其他人討論設(shè)計方案的時候，我們也問往往會遇到其他人與自己意見相左的情況。這時，首先要相信對方是對事不對人的，然后靜下心來想想對方說的是否有道理，自己之前的思路是否有問題，或者有沒有兩全其美的方案。

2. 從眾。

人們趨向于采納多數(shù)人的選擇，跟隨多數(shù)人的行動，這樣會感覺更加安穩(wěn)，均分壓力，避免沖突。人都是有思維惰性的，從眾可以把思考問題、做決策的責(zé)任默默地移交給別人。在審核交互方案時，當(dāng)多數(shù)人喜歡某一套方案時，我們可能便選擇了這個方案。但需要清楚的是，一旦之后發(fā)現(xiàn)問題，需要負(fù)責(zé)修改方案的還是設(shè)計師自己，專業(yè)度被質(zhì)疑的還是只有設(shè)計師。因此，他人的建議只能作為參考，自己想清楚了才是王道。

3. 權(quán)威影響。

與從眾心理相似，權(quán)威影響也是一種趨從心態(tài)，其作用有時甚至大于從眾心理。在團(tuán)隊中可能會有幾個你特別欣賞的人，他們的意見你會格外看重。與這些人討論得出的結(jié)論，你會覺得更有安全感，似乎已是最佳方案。越是這樣就越要給自己敲警鐘，主動給當(dāng)前的解決方案找茬。

4. 關(guān)閉。

當(dāng)你覺得一個方案已塵埃落定、大家都覺得ok、一切看起來都那么完美的時候，我們往往會在大腦中關(guān)閉這項任務(wù)，不再去想。尤其是在公開了這套方案后，你等于是在向別人宣布：“就這么定了！” 你也會格外捍衛(wèi)自己的決定。盡管我們可能已經(jīng)用了各種方法去保證方案的完善性，但人無完人，你永遠(yuǎn)不知道什么時候會發(fā)現(xiàn)新的問題。我們能做的，也只是盡量避免大問題，盡量減少剩余的問題。因此，永遠(yuǎn)不要給自己的思維打上句號，只要項目還未截止，就應(yīng)該不斷審視自己已有的設(shè)計。

圖3. 發(fā)現(xiàn)交互設(shè)計中的思維盲區(qū)

總結(jié)下來就是上面這張圖。最后想說這是一個永不“關(guān)閉”的話題，希望大家可以不斷補充，相互學(xué)習(xí)。