萬盛學電腦網

 萬盛學電腦網 >> 網頁制作 >> 交互設計 >> 為用戶傳遞信息:手機產品設計中的反饋提示

為用戶傳遞信息:手機產品設計中的反饋提示

為用戶傳遞信息:手機產品設計中的反饋提示 三聯

  在產品的設計中,“反饋”是很重要的一個交互特征,它是一種界面輸出物,用以給用戶正確的引導信息,幫助用戶判斷和決策。而反饋的形式也是多方面的,視覺、聽覺、嗅覺、觸覺、正面的、負面的,都是在為用戶傳遞信息。而沒有反饋或反饋很差的交互,只會讓用戶產生失效和無助的負面體驗。

  在煤氣中加入硫和笨,為的是通過臭味提供危險信號的反饋。地鐵裡的門在關閉前會發出滴滴的報警聲,是用來告知乘客車門將要關閉的信息。這都是生活中無處不在的反饋。

  今天要和大家討論的是在手機產品中,用戶在信息交互過程中所得到的反饋形式。

  1.反饋的必要性

  在用戶與產品進行交互的過程中, 產品對於用戶的每一次行為都要有清晰的、及時的提示和反饋,從而使用戶獲得操作行為結果的信息。

  如果產品不提供任何信息反饋, 那麼用戶就無法確定自己操作行為的的結果,反饋機制是產品設計中不可或缺的基本元素,它是用戶前進道路的指向標。

  2.反饋的形式

  反饋的形式是多種多樣的,在不同的場景不同操作中要選擇適合的反饋類型。而在手機產品中更要考慮操作區太小被手指遮擋住的情況,反饋一定要明顯,並呈現在可視范圍內。下面嘗試對手機產品中的反饋形式做一些總結。

  2.1 氣球狀通知

  氣球狀通知是一個小型的彈出窗口,用於通知用戶出現非關鍵性問題或控件處於某種特殊情況。

  上圖中的信息提示是用來解釋指向菜單的功能,即該菜單項是做什麼的,屬於說明類的反饋提示,說明文字應簡潔、實用,避免提供用戶顯而易見的信息,需要設定合理的顯示時間。

  上圖的氣球狀通知是當選中某一項功能(或方式)時,界面顯示該功能對應的簡要說明,用來告知用戶選中此項功能將要執行的操作是什麼,此類反饋通知一般觸發後顯示3秒鐘就自動消失了。此類的反饋通常不會太重要,因為很容易被用戶忽略。

  2.2 對話框

  對話框是最常見的反饋和提示形式,它存在的價值在於要引起用戶的高度重視。

  上圖中的反饋提示是當用戶觸發某一項操作且需要用戶進行再次確定及選擇時顯示的對話框,此類反饋的方式一般用在較為重要的提示信息上,需要用戶進一步操作。操作按鈕要盡量突出,確定不會出現死循環和重復操作,提示文字要簡練易懂,以減少對文字的閱讀壓力。

  上圖的反饋屬於過渡類的反饋提示,是通知用戶當前界面所處的一種特殊狀態,告知用戶可以做什麼及產品正在做什麼。

  2.3 按鈕/圖標/鏈接的按下狀態

  按鈕/圖標/鏈接的按下、選中的反饋效果,在手機產品中一樣不能缺少。

  上圖的例子中當用戶按下按鈕或圖標時,該按鈕背景會增加一個按下的指紋,圖標背景會變成高光,這種實時的反饋讓用戶即時直觀地看到操作被響應了。

  2.4 聲音

  聲音同樣能為用戶提供有用的聽覺反饋,但是它不應是唯一的或主要的反饋方式。因為用戶的使用場景可能會迫使他們關掉聲音。尤其手機的使用環境復雜多樣,在地鐵、商場等嘈雜的環境,聲音的反饋就很容易被忽略。同時,過多的聲音反饋也會造成聽覺上的噪音,所以聲音的反饋不應是主要的反饋方式,並要允許用戶關掉聲音。

  比如iPhone發送短信發送成功後的提示音,按下手機鍵盤上的按鍵時的提示音,新浪微博的信息拉取成功後的提示音,後台推送消息的提示音等等,都巧妙的運用了聲音反饋。

  2.5 振動

  振動為觸覺反饋的一種表現形式,讓用戶通過觸覺來感知產品的反饋及回應。

  當我們將手機由聲音調到振動時,聲音的反饋提示就變成了振動提示。比如當有電話打進來時、接收到新消息時、接通電源充電時的反饋提示都變成了振動。

  而有些產品中也可以設置新消息振動提示,打開此開關後,有新消息送達時的提示也就變成了振動提示。

  2.6 動畫

  順滑的動畫會給用戶提供有意義的反饋,幫助用戶直觀地了解到操作的結果。

  上圖的例子都是通過一個顯著的動畫過程讓用戶知道操作是如何執行的,把衣服丟進購物車,把照片扔進垃圾箱等等,這些形象的擬物化的動畫能夠幫助用戶清晰地感知到整個操作執行的全過程。

  上圖中的例子適用在那些會持續很多秒的長流程裡,將等待過程采用動畫的進度形式顯示,展示已完成的進度,並在可能的時候提供解釋信息,以減少用戶的焦慮。

  2.7 燈光

  燈光的提示,在一些特殊環境中有特殊的應用,比如在黑暗的地方或者是用戶視線不在手機屏幕上時,燈光的反饋提示就以它獨特的閃爍方式引起用戶的注意。

  手機指示燈大多是用在提示電量不足,即當手機快沒電的時候,指示燈會按照一定的頻率閃爍紅光。還有充電的時候,紅色指示燈常亮,充滿電之後變成綠色。

  還有一些手機的燈光應用在提醒功能裡,比如有新消息、未接來電的時候,屏幕會自動亮起提示用戶。

  3.反饋的內容

  3.1 信息

  反饋提示的信息應簡潔、實用。避免不帶格式的大段文本,避免提供用戶顯而易見的信息或只是重復屏幕上的文字。

  上圖中的例子可以看到用戶完成操作後給出的清晰的提示信息,告知用戶操作的結果。

  3.2 警告

  警告框用於向用戶展示對使用程序有重要影響的信息。

  警告框浮現在程序中央,覆蓋在主程序之上。警告框的外觀強調了這樣一個事實,它的到來是由於程序或設備的狀態發生了重要變動,並不一定是由用戶最近的操作導致。

  上圖中的警告是告知用戶當前產品的狀態,需要用戶引起重視。警告框通常至少有一個按鈕,用戶點擊後即可關閉窗口。警告框上也總會有標題,並展示額外的輔助信息。

  3.3 錯誤

  錯誤是提示用戶操作出現了問題或異常,無法繼續執行。

  上圖中的例子為輸入的信息有誤,界面給出了相應的錯誤提示,告知用戶為什麼操作被中斷,以及出現了什麼錯誤。錯誤信息要盡量准確、通俗易懂,有效的錯誤提示信息要解釋發生的原因,並提供解決方案以使用戶能夠進行修復。

  3.4 確認

  確認是用於詢問用戶是否要繼續某個操作,讓用戶進一步對所作的操作進行確定和執行,為用戶提供可反悔的可撤銷的退路。

  上圖中的例子是讓用戶對一些執行結果較危險或不可逆的操作進行二次選擇和確認,用戶防止用戶誤操作。

  4.反饋的位置

  4.1 狀態欄

  反饋的提示信息在狀態欄,因為手機屏幕較小,可利用的空間有限,而放在狀態欄則是一種很好的空間利用,但此位置不是很明顯,建議只顯示重要程度不高的信息提示,如好友消息提示,操作結果提示等次要信息。

  4.2 導航欄

  反饋的提示信息在導航欄,此類提示一般為連接狀態的展示,臨時將導航欄的內容代替為連接狀態,表示當前產品正在努力連接網絡拉取數據中。此位置適合顯示臨時的較重要的提示類信息。

  4.3 內容區上方

  反饋提示在內容區上方,導航欄下方,通常為拉取新內容,加載新信息的一種快捷方式,默認的提示信息是隱藏的,向下拉界面時才顯示對應的提示信息,以引導用戶進行操作。此位置的提示需要和內容進行緊密的關聯結合。

copyright © 萬盛學電腦網 all rights reserved