淺談WEB頁面三種程度的提示彈窗

2 評論 48937 瀏覽 423 收藏 6 分鐘

在設計WEB頁面時,經常會使用到彈窗提示,根據提示的深度層次,大致可分為三種,接下來介紹一下三種程度的彈窗樣式與進階樣式。

1、你一定要告訴我你知道了

你讓我幫你拆家里的墻,我說拆了之后房子會變得不安全,你確定要拆嗎?你說要拆,拆了之后你沒給我結工錢,然后讓我去拆另一堵墻,我說:你必須給我結了上一次的工錢,我才能接著給你干活。這是必須讓你知道的原則

(1)最常見的是刪除,內容被刪除之后一般不可恢復,所以刪除之前要告訴用戶操作的后果并再次讓用戶確定行為。

QQ截圖20160109151944
(2)用戶未到達操作條件卻點擊了某些按鈕,且提示語較長時(不過這種情況有時候不用彈窗而是直接跳轉到去創造條件的頁面,比如未登錄時我點擊評論,直接跳轉到了登錄頁面)。這個時候可以用彈窗告訴用戶應當怎么滿足條件,比如:規定可推薦3條數據,推薦三條后,再次點擊推薦時,要指導用戶該如何去做。

3
進階樣式:

關于刪除的彈窗,有人說每次讓用戶再次確認好像是質問,并且在用戶使用熟練后都已經知道了后果,為什么還要一次次提示呢,因此下面兩種形式可供參考:

使用恢復操作代替再次確認的彈窗,可顯示在頂端或者底部:

4

在彈窗中增加“不再提示”勾選項,當用戶感覺到彈窗提醒多余時,可自行選擇(但我認為不是所有的彈窗都可以加“不再提示”,例如上方的刪除適合,而提示信息則不適合。):

5
每個人的眼光都有不同,做的實際項目也都不同,最好根據場景去選擇樣式。

2、有些事還是你知道了比較好

有些操作是可恢復的,或者有些必須讓用戶知道的提示內容較為簡短,可以采用較輕量級彈窗,不需用戶確認。

(1)可恢復的操作,減少用戶確定的步驟(如果操作后頁面變動較大,用戶可以感受到操作后的變化,我感覺可以大膽的去掉這些彈窗)

例如:系統中將課程下架,或將用戶拉黑,這些操作是可恢復性的,可以在頁面的底部顯示提示信息框,3-4秒后自動消失。關于這種提示框中的內容,我認為最好不要說“下架成功”,“拉黑成功”這些比較雞肋的話,說一下操作的具體結果會比較好一點。

20160109152233

(2)用戶未到達操作條件卻點擊了某些按鈕,且提示語較短時

例如:在填寫表單時,必填項未填寫完全時點擊了保存,彈出提示框,位置為了醒目可在頁面中間,3-4秒后自動消失。

8
3、甲:那個誰,你交的作業我收到了。乙:這你也告訴我

很多軟件系統中將大部分的操作都設置了反饋,將操作的結果(不是后果)告訴用戶
例如:下面是幾個操作的結果,一般放在頁面的底端,2秒后消失。但是很多時候通過頁面變化就可以看出結果,我認為這種提示能少就少吧。

9
總結:以上代表本人看法,經過訪問,那些讓我們糾結的交互細節,很多用戶都沒有在意(我們竟然用產品,測試的眼光去猜測用戶的體驗),在不違反人類習慣,法律法規的前提下,我們可以根據具體項目和心情去規定吧,好任性,哈哈!??!

 

本文由 @耿瑞超(微信號:13373926389 原創發布于人人都是產品經理?,未經許可,禁止轉載。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 關于操作反饋,我倒是有一點不同意見。web端的產品,還是toB的多一些。這一類的反饋多了未必有多討厭,但是少了可能就會很糟糕,所以在拿捏不準的情況下,多加一些倒也無妨

    來自廣東 回復
    1. 嗯嗯,是的,重要的地方不能吝嗇提醒

      來自北京 回復