消息通知作為產(chǎn)品里面基礎功能之一，是每個產(chǎn)品經(jīng)理都需要掌握的。本文重點介紹移動端消息提醒如何在頁面中運用的，包括模態(tài)彈窗和非模態(tài)彈窗兩種的詳細介紹，希望可以幫到大家。

消息通知和提醒作為系統(tǒng)與用戶之間交流的窗口，在不同事件下用戶都能感知與操作場景和緊急程度匹配的結果反饋或消息提示，做到合理有效的信息傳達。

一個能讓用戶快速上手的APP，除了設計符合產(chǎn)品邏輯、符合用戶操作習慣、足夠簡潔之外，層次分明不失趣味性的消息提醒設計，也是非常重要的。

在這篇文章中，將重點介紹移動端消息提醒如何在頁面中運用的。

01 概念簡述

消息通知：通知是產(chǎn)品中極其重要的一部分，它能快速將內容的狀態(tài)及變化通過不同的方式傳達給用戶，以便用戶在收到信息后根據(jù)所傳遞的內容及時做出應對策略。

提醒：顧名思義，提醒方式，是指用戶需要提醒的時候，出現(xiàn)的一些提醒機制，且盡可能的減少對用戶的打擾。

02 消息提醒的方式都有哪些？

結合工作中常見的消息通知設計，分類如下：

03 模態(tài)彈窗

用戶在完成任務的過程中，界面會出現(xiàn)彈窗打斷用戶的操作行為，用戶必須通過主動點擊才可以進行下一步操作。

模態(tài)彈窗與非模態(tài)的視覺區(qū)分：模態(tài)一般有黑色半透明蒙版，強調彈窗的內容，優(yōu)點是可以很好的獲取用戶的視覺焦點。缺點是會打斷用戶當前的操作流程。

1. 彈窗/對話框提示

對話框用于提供關鍵信息或要求用戶作出決定，信息或要求的優(yōu)先級很高，必須及時處理。主要在打斷用戶后并提供選項操作，對用戶的干擾較大，通常會配備1~3個操作按鈕，而且會把用戶最期待的或產(chǎn)品最期待用戶操作的按鈕突出顯示。

對話框包含：廣告彈窗、活動推廣彈窗、新手指引、改版/新功能指引、確認提示彈窗、升級提示彈窗、APP授權彈窗（定位、通話、通訊錄等）

對話框要遵循以下原則：

• 聚焦：對話框使用戶聚焦在提醒內容上，確保信息被看到、任務被處理；
• 直接：直接傳達信息，幫助用戶處理任務；
• 有幫助：對話框的出現(xiàn)是為了響應用戶的操作，帶有上下文的信息；

2. 操作欄/底部彈窗

底部彈窗與對話框的特點是一樣的（打斷式、干擾大），主要的區(qū)別在位置上，操作欄/底部彈窗在視覺重心上稍弱；操作層面來講更便捷，尤其是對大屏單手操作而言；底部彈窗可以承載更多的簡單操作，如時間選擇器、打星評價、快捷操作等。

04 非模態(tài)彈窗

相比模態(tài)彈窗，非模態(tài)彈窗屬較為輕量，觸發(fā)后以一種非阻礙的的方式呈現(xiàn)，不會打斷用戶的當前操作，主要是給予用戶即時反饋，讓用戶清楚應用當前的交互后狀態(tài)。非模態(tài)彈窗不強制用戶操作，根據(jù)反饋信息的重要程度及意愿，可在一定的時間內自動消失，也可等待用戶操作后消失，常見的有以下幾種：

1. Toast

放在Toast中的文字要簡短、精煉。Toast出現(xiàn)后，過幾秒自動消失，用于無需用戶反饋且可通過用戶重復點擊出現(xiàn)的消息類型。

2. 快捷提示

用于內容推廣、操作引導、用戶消息?？旖萏崾究筛鶕?jù)需要選擇自動消失邏輯、或添加關閉按鈕，也可以在用戶滑動頁面的過程中設計收起態(tài)或通過調整透明度來消除對頁面內容的遮擋。通過這些內容在首屏得以曝光，并為用戶提供快捷入口。

3. 進度條提示

進度條是一種用于表示任務完成進度的圖形界面元素,它可以幫助用戶更好地理解任務的進度和剩余時間。提供用戶一個直觀的反饋,讓用戶能夠更好地掌握任務的進度,從而提高用戶體驗?？傊?進度條可以幫助用戶更好地了解任務的進度,提高用戶體驗。常見于文件上傳、下載、處理進度,也可以用于顯示游戲進度、任務完成進度、問卷填寫進度等。

4. 小紅點（徽標）

徽標的形式不僅只有小紅點，也有紅圈里加數(shù)字，表示新消息數(shù)量。也有直接小紅圈+文字，來更好的傳達信息

5. 空狀態(tài)提示

由于網(wǎng)絡環(huán)境原因、設備原因、數(shù)據(jù)正常且為空、數(shù)據(jù)異常等等造成內容為空時，給到用戶的反饋提示，主要作用為以下幾點：

1. 解釋說明：告訴用戶當前頁面的信息狀態(tài)出現(xiàn)了什么問題
2. 安撫用戶情緒：緩解用戶焦慮、挫敗、疑惑等負面情緒
3. 引導用戶操作：告訴用戶解決方案并引導用戶進行操作
4. 強化品牌：傳達品牌定位、格調和氣氛，與用戶建立情感連接

6. 文字輪播提示

用于宣傳類banner輪播，通知類滾動提示，點擊后跳轉到消息詳情或消息列表。用于信息數(shù)量較多，但用戶不需要一一了解的動態(tài)信息。

7. 校驗提示

校驗觸發(fā)條件的不同和報錯方式的不同，可以組成三種：

1. 輸入校驗即時報錯：實時驗證，顯示錯誤提示，影響較小。
2. 失去焦點即時報錯：減少后臺數(shù)據(jù)傳送壓力，避免頻繁錯誤提示。
3. 操作保存/提交/下一步時全部報錯：減少用戶反饋時間。

05 如何選擇合適的消息提醒？

針對不同的需求類型和提醒目的，如何選擇最合適的提醒呢？大家可對照下表再結合自己的經(jīng)驗來判斷：

06 結語

消息通知設計用于在必要時向用戶反饋操作結果或傳達消息，在不同事件下，用戶都能感知與操作場景和緊急程度匹配的結果反饋或消息提示，做到合理有效的信息傳達。