編輯導(dǎo)語(yǔ)：消息通知可以將內(nèi)容實(shí)時(shí)送達(dá)用戶(hù)手機(jī)頁(yè)面，但是泛濫的消息通知會(huì)引起用戶(hù)的反感，也違背了這個(gè)設(shè)計(jì)的初衷。如何理解以及設(shè)計(jì)消息通知，作者作了簡(jiǎn)單的分享，我們一起來(lái)看看吧。

消息通知可以及時(shí)地將狀態(tài)、內(nèi)容的更新觸達(dá)到用戶(hù)，用戶(hù)則可以根據(jù)收到的消息做后續(xù)判斷。但是如果沒(méi)有及時(shí)將重要消息觸達(dá)到用戶(hù)或者濫用消息，則失去了消息通知的初衷。

特別是針對(duì)涉及復(fù)雜任務(wù)流程的產(chǎn)品，消息類(lèi)型繁雜，難以全面盤(pán)點(diǎn)消息類(lèi)型，消息系統(tǒng)的設(shè)計(jì)就顯得尤為重要。

希望通過(guò)這篇文章讓各位在設(shè)計(jì)消息通知系統(tǒng)的時(shí)候能夠更加全面高效。

一、如何理解消息通知

消息通知需要為產(chǎn)品服務(wù)，幫助用戶(hù)快速獲取對(duì)應(yīng)的通知信息。收到一條新回復(fù)的提示、工作臺(tái)展示工作進(jìn)度、朋友的來(lái)電，生活中處處是信息的交換。在 App 和網(wǎng)頁(yè)應(yīng)用中最常見(jiàn)的信息交換方式則是消息通知。

消息作為一種信息交換方式，抽象其過(guò)程，即為“在達(dá)到某一觸發(fā)條件下，由發(fā)送方發(fā)送消息給到接收方，接收方可針對(duì)此條消息提供反饋”。需要包含以下關(guān)鍵因素：

1. 消息觸發(fā)時(shí)間與條件（何時(shí)什么事）：如按周期重復(fù)的時(shí)間點(diǎn)，或系統(tǒng)狀態(tài)變更、用戶(hù)操作結(jié)果等；
2. 消息發(fā)送方（誰(shuí)發(fā)現(xiàn)的事）：可能是系統(tǒng)、第三方服務(wù)商，或者某個(gè)用戶(hù)；
3. 消息接收方（誰(shuí)需要知道）：即接收方，可能是系統(tǒng)中的全部用戶(hù)，也可能會(huì)根據(jù)權(quán)限劃分推送到某個(gè)用戶(hù)群組，或者是某個(gè)特定用戶(hù)；
4. 消息觸達(dá)渠道（怎么找到他）：短信、電話(huà)、App 內(nèi)通知等；
5. 消息通知內(nèi)容（告訴他什么）：短信的文本、電話(huà)對(duì)話(huà)內(nèi)容、通知消息的文案等消息通知；
6. 消息操作反饋（他可以干嘛）：主要分為只讀與操作反饋。只讀，即當(dāng)前消息用戶(hù)在瀏覽后不需要做更多的操作，主要以了解為主；操作反饋，即當(dāng)前消息需要用戶(hù)瀏覽，且在瀏覽后做相應(yīng)的后續(xù)操作。

好的消息系統(tǒng)要滿(mǎn)足什么條件：

1. 全面：通知的消息項(xiàng)要完整全面，用戶(hù)才能放心地通過(guò)消息通知系統(tǒng)了解消息更新內(nèi)容；
2. 及時(shí)：消息的觸達(dá)方式要及時(shí)有效，在消息相關(guān)事件發(fā)生后，用戶(hù)能在第一時(shí)間獲取到信息并提供操作反饋給到消息發(fā)送方；
3. 高效：能通過(guò)合理的消息發(fā)送途徑、允許用戶(hù)設(shè)置及合并相似信息等方式避免過(guò)多消息侵?jǐn)_用戶(hù)，讓用戶(hù)能夠高效處理消息通知。

二、如何盤(pán)點(diǎn)消息通知

設(shè)計(jì)全面、及時(shí)、有效的消息通知系統(tǒng)需要對(duì)消息的六個(gè)關(guān)鍵因素進(jìn)行全面盤(pán)點(diǎn)，通過(guò)分步的方式逐步完成消息通知系統(tǒng)的設(shè)計(jì)。主要分為以下三步：

1. 盤(pán)點(diǎn)系統(tǒng)中包含的消息項(xiàng)：包含其觸發(fā)條件、通知來(lái)源及通知對(duì)象。需要盤(pán)點(diǎn)完整消息項(xiàng)從而保證消息系統(tǒng)的完整性；
2. 確定消息觸達(dá)渠道：包含各消息項(xiàng)的觸達(dá)渠道。讓所有消息都能觸達(dá)到用戶(hù)的同時(shí)，能夠讓重要信息更易觸達(dá)，保證消息通知的及時(shí)性；
3. 撰寫(xiě)通知內(nèi)容與操作反饋：包含各消息項(xiàng)的通知內(nèi)容與操作反饋。讓消息內(nèi)容能夠有效地傳達(dá)給用戶(hù)，讓用戶(hù)能快速反饋、操作。

盤(pán)點(diǎn)的過(guò)程，即對(duì)消息通知清單的梳理。與產(chǎn)品、研發(fā)等團(tuán)隊(duì)成員的溝通也將使用該清單。最終目標(biāo)即完成下方表格的填寫(xiě)：

1. 盤(pán)點(diǎn)系統(tǒng)中包含的消息項(xiàng)

當(dāng)前步驟需要對(duì)系統(tǒng)中可能會(huì)有的消息項(xiàng)進(jìn)行完整的盤(pán)點(diǎn)。盤(pán)點(diǎn)消息項(xiàng)可以通過(guò)按消息類(lèi)型走查方式完成。市場(chǎng)上比較有共識(shí)的消息的分類(lèi)方式主要分為禁止、警告、成功三類(lèi)。但是在實(shí)際設(shè)計(jì)工作中還需要配合以下的消息分類(lèi)方式去更完整地盤(pán)點(diǎn)消息項(xiàng)：

（1）盤(pán)點(diǎn)出的每個(gè)消息項(xiàng)都需要補(bǔ)充以下四個(gè)關(guān)鍵因素

1. 觸發(fā)條件：結(jié)合產(chǎn)品核心場(chǎng)景梳理完整?？赏ㄟ^(guò)狀態(tài)圖或泳道圖查缺補(bǔ)漏（詳見(jiàn)下段內(nèi)容）;
2. 通知來(lái)源：可能是某個(gè)內(nèi)部系統(tǒng)，可能是某個(gè)用戶(hù)組，也可能是某個(gè)具體用戶(hù)。用戶(hù)組的劃分需要提前與產(chǎn)品、研發(fā)同事溝通完成；
3. 通知對(duì)象：可能是全部用戶(hù)，也可能是某個(gè)用戶(hù)組或具體用戶(hù)。由觸發(fā)條件中的場(chǎng)景決定；
4. 重要性：需要與團(tuán)隊(duì)溝通得出，可使用“高”、“中”、“低”的分類(lèi)方式。

盤(pán)點(diǎn)完成的消息項(xiàng)使用下表進(jìn)行整理，方便產(chǎn)品、設(shè)計(jì)、研發(fā)之間的溝通。

（2）用流程圖或泳道圖查缺補(bǔ)漏

對(duì)于 ToB 或 ToG 類(lèi)含有復(fù)雜狀態(tài)轉(zhuǎn)換以及任務(wù)流的產(chǎn)品，除了使用分類(lèi)的方式盤(pán)點(diǎn)消息項(xiàng)，還需要對(duì)照流程圖或泳道圖查缺補(bǔ)漏，避免消息類(lèi)型的遺漏。

如，顧客線(xiàn)上購(gòu)買(mǎi)商品并收取商品的商品相關(guān)狀態(tài)變化如下圖所示，每個(gè)狀態(tài)都可對(duì)應(yīng)著一條消息項(xiàng)：

△線(xiàn)上購(gòu)物過(guò)程中的消息流程圖示意

當(dāng)系統(tǒng)內(nèi)包含多角色，且角色間流程有交互時(shí)，則可以使用泳道圖的方式進(jìn)行梳理。在泳道圖中的每一條狀態(tài)變更線(xiàn)，都對(duì)應(yīng)著一個(gè)狀態(tài)變更提醒。其中角色間交互的線(xiàn)，由于需要角色主動(dòng)處理方可進(jìn)入下一流程狀態(tài)，這條消息一般會(huì)成為一條待辦消息。

（3）什么類(lèi)型的消息不要納入消息通知系統(tǒng)

需要注意的是，雖然通知的完備性很重要，但某些消息在前期梳理時(shí)就需要從清單中剔除，包括：

1. 單純問(wèn)候類(lèi)消息，如“好久不見(jiàn)”等
2. 不需要用戶(hù)知道的消息，如系統(tǒng)后臺(tái)數(shù)據(jù)更新等

2. 確定消息觸達(dá)渠道

確定要推送給用戶(hù)的消息類(lèi)型后，需要給各消息匹配適合的通知方式。不同的通知方式會(huì)有不同的適用場(chǎng)景，可對(duì)照下表結(jié)合第一步整理的重要性配置消息的觸達(dá)渠道：

消息觸達(dá)渠道的配置結(jié)果到第一步的表格中：

平衡通知量：

一個(gè)好的消息系統(tǒng)需要能有效觸達(dá)的同時(shí)不過(guò)分侵?jǐn)_用戶(hù)。這就要求我們對(duì)系統(tǒng)實(shí)際運(yùn)行中可能會(huì)出現(xiàn)的通知量進(jìn)行預(yù)估，并適量調(diào)整通知方式，讓重要的消息能夠更有效及時(shí)地觸達(dá)到用戶(hù)。

最終調(diào)整后的消息數(shù)量與提醒強(qiáng)度的關(guān)系最好能形成如下圖所示金字塔的模式。

△ 提醒強(qiáng)度與消息數(shù)量的金字塔關(guān)系

（1）合并重復(fù)消息

對(duì)于出現(xiàn)頻率較高，且用戶(hù)不需及時(shí)了解每條消息的消息項(xiàng)，可以通過(guò)合并消息的方式減少通知的數(shù)量。合并主要有兩種方式：合并流程過(guò)往節(jié)點(diǎn)信息和合并同類(lèi)消息。

合并流程過(guò)往節(jié)點(diǎn)消息：對(duì)于一些流程類(lèi)通知，若用戶(hù)在響應(yīng)或查看前，流程已經(jīng)進(jìn)入到下一階段，歷史節(jié)點(diǎn)的信息已經(jīng)無(wú)需了解時(shí)，可合并過(guò)往流程節(jié)點(diǎn)的消息。如淘寶在展示物流時(shí)，針對(duì)同一訂單的物流，僅保留最新的一條。

合并同類(lèi)信息：對(duì)于同類(lèi)型消息過(guò)多，且用戶(hù)不需要一一查看，只需在用戶(hù)有需要的時(shí)候提供入查看完整內(nèi)容時(shí)，自動(dòng)合并同類(lèi)型的消息，減少對(duì)用戶(hù)的打擾。如 Instagram 在展示用戶(hù)動(dòng)態(tài)信息時(shí)，會(huì)合并同一天同一類(lèi)型的消息。

△兩種合并消息方式

智能推送：有條件的系統(tǒng)可根據(jù)用戶(hù)行為分析及用戶(hù)畫(huà)像，進(jìn)行智能推送。如基于用戶(hù)畫(huà)像按類(lèi)型推送運(yùn)營(yíng)類(lèi)消息，基于用戶(hù)接受消息數(shù)量，判斷是否合并消息推送等。

（4）渠道間消息項(xiàng)的延續(xù)與統(tǒng)一

出于信息持續(xù)性的考慮，觸達(dá)渠道之間有部分關(guān)聯(lián)關(guān)系在制定消息觸達(dá)渠道時(shí)需要注意，如：

1. 若系統(tǒng)包含App、web等不同端，相同通知類(lèi)型的消息要保持統(tǒng)一
2. badge提示需要在應(yīng)用內(nèi)消息通知模塊有對(duì)應(yīng)消息提示
3. push消息的文案需要與應(yīng)用內(nèi)消息中心保持一致

3. 撰寫(xiě)通知內(nèi)容與操作反饋

通知的內(nèi)容需要滿(mǎn)足簡(jiǎn)明易懂的同時(shí)，還要讓用戶(hù)能夠快速處理。根據(jù)大量經(jīng)驗(yàn)總結(jié)，通知內(nèi)容的撰寫(xiě)可使用一個(gè)通用撰寫(xiě)公式：

在應(yīng)用撰寫(xiě)公式寫(xiě)內(nèi)容時(shí)，需注意以下要點(diǎn)：

1. 重點(diǎn)前置：用戶(hù)觸達(dá)的第一場(chǎng)景，可能是手機(jī)的 push 消息，可能是多個(gè)消息的列表。這就要求在撰寫(xiě)文案時(shí)要將重要信息前置，如驗(yàn)證碼、還款金額、事件提醒名稱(chēng)等。
2. 敏感信息保護(hù)：由于無(wú)法確認(rèn)用戶(hù)獲取信息的場(chǎng)景是否私密。對(duì)于金額、個(gè)人信息等隱私數(shù)據(jù)，建議在應(yīng)用內(nèi)或其他渠道提供設(shè)置項(xiàng)，提供用戶(hù)自主選擇是否在消息通知中包含具體數(shù)值。如果要默認(rèn)顯示，需要提前告知用戶(hù)。
3. 來(lái)源信息露出：在郵件、短信等非產(chǎn)品自有渠道推送消息時(shí)，用戶(hù)可能會(huì)不確定消息的來(lái)源是否官方，需要包含消息來(lái)源信息。
4. 提供觸發(fā)時(shí)間：當(dāng)消息的發(fā)生時(shí)間對(duì)用戶(hù)后續(xù)判斷、操作有影響時(shí)，需要在通知內(nèi)容中包含消息發(fā)生的時(shí)間。

除了以上通用注意事項(xiàng)，由于渠道本身的特征差異，還需注意以下渠道相關(guān)的要點(diǎn)：

1. 電話(huà)：需要設(shè)定客服話(huà)術(shù)標(biāo)準(zhǔn)，一般需要在會(huì)話(huà)開(kāi)始前先告知用戶(hù)來(lái)電是誰(shuí)、有什么目的。在講述完通知內(nèi)容后，還應(yīng)告知用戶(hù)如何處理當(dāng)前信息，如果想了解詳細(xì)內(nèi)容該前往哪個(gè)渠道了解。
2. 短信-來(lái)源平臺(tái)：由于通知類(lèi)短信的發(fā)送號(hào)碼可能會(huì)由于服務(wù)商設(shè)置的問(wèn)題導(dǎo)致有多個(gè)發(fā)送號(hào)碼發(fā)送給用戶(hù)，用戶(hù)無(wú)法根據(jù)號(hào)碼判斷發(fā)件人身份。故需要在短信最開(kāi)始說(shuō)明平臺(tái)來(lái)源，建立品牌認(rèn)知，避免用戶(hù)錯(cuò)認(rèn)為是垃圾短信。
3. 短信-操作反饋：由于大部分短信為純文本短信，相關(guān)操作反饋需要通過(guò)鏈接或者路徑指引的方式提供。若短信包含詳情鏈接，鏈接最好能設(shè)置為保留根域名的短鏈，如：點(diǎn)擊了解詳情：cdc.qq.com/d8djei
4. 郵件：與短信相似會(huì)有來(lái)源可信度問(wèn)題，郵件內(nèi)容需包含品牌元素，同時(shí)發(fā)件的郵箱地址后綴使用產(chǎn)品官方網(wǎng)站。另外需要注意，某些郵件軟件會(huì)設(shè)置不自動(dòng)下載圖片，郵件重要內(nèi)容不要使用圖片。
5. push推送（移動(dòng)端）：是消息在移動(dòng)端的特有觸達(dá)渠道，由手機(jī)系統(tǒng)發(fā)送。發(fā)送的信息格式會(huì)受系統(tǒng)要求有所限制。最新的推送要求可參考相關(guān)設(shè)計(jì)規(guī)范文檔或接口規(guī)范。應(yīng)用的icon與名稱(chēng)系統(tǒng)會(huì)自動(dòng)補(bǔ)充，撰寫(xiě)文案時(shí)不用包含。
6. 微信公眾號(hào)（訂閱號(hào)/服務(wù)號(hào)）：由于微信對(duì)訂閱號(hào)與服務(wù)號(hào)的消息推送方式會(huì)經(jīng)常變化，需要確認(rèn)最新的要求并撰寫(xiě)文案，相關(guān)鏈接見(jiàn)鏈接。

在完成通知內(nèi)容以及操作反饋的梳理后，對(duì)消息梳理表格進(jìn)行更新，補(bǔ)充相關(guān)信息：

自此，消息項(xiàng)的盤(pán)點(diǎn)已經(jīng)完成，后續(xù)可基于該表格與產(chǎn)品、研發(fā)溝通。當(dāng)業(yè)務(wù)出現(xiàn)變更時(shí)，也需要對(duì)表格內(nèi)容進(jìn)行同步更新。

三、如何設(shè)計(jì)消息中心

消息通知的觸達(dá)渠道中，電話(huà)、短信、push 推送的呈現(xiàn)由系統(tǒng)決定。但是若產(chǎn)品有獨(dú)立 App，往往需要消息中心去承載全量的消息列表。本章會(huì)介紹如何設(shè)計(jì)消息中心。

不同應(yīng)用的消息中心處理方式受產(chǎn)品定位、應(yīng)用框架等因素影響，設(shè)計(jì)差異化較大。但是可以通過(guò)按路徑分割去簡(jiǎn)化設(shè)計(jì)：消息中心的入口、消息列表的組織方式、消息卡片的樣式、消息的設(shè)置等幾個(gè)部分。

1. 消息中心入口

主要有底部 tab、個(gè)人中心附近的圖標(biāo)入口、個(gè)人中心的菜單項(xiàng)等三種入口形式：

△ 消息中心的三種入口

1. 底部tab：一般適用于產(chǎn)品核心功能中包含大量用戶(hù)間通訊，或者希望通過(guò)強(qiáng)化消息露出來(lái)促進(jìn)用戶(hù)上傳更多內(nèi)容。對(duì)于重要的消息類(lèi)型可提供數(shù)字 badge 作為未讀消息數(shù)量的提示；
2. 頂部圖標(biāo)入口：一般適用于產(chǎn)品消息數(shù)量較少，或消息對(duì)產(chǎn)品核心場(chǎng)景的影響較少的情況。一般會(huì)在首頁(yè)的頂部，或個(gè)人中心頁(yè)的頂部有一圖標(biāo)作為入口。圖標(biāo)會(huì)包含數(shù)字 badge 作為未讀消息數(shù)量的提示；
3. 個(gè)人中心菜單項(xiàng)：一般適用于當(dāng)產(chǎn)品頂部空間作他用，沒(méi)有圖標(biāo)入口的位置時(shí)使用。

2. 消息列表

從消息中心入口點(diǎn)擊后跳轉(zhuǎn)到消息列表。由于消息的即時(shí)性，需要按時(shí)間維度排列。但是如果產(chǎn)品的消息類(lèi)型較多，可通過(guò)分組合并或者分 tab 的方式提升用戶(hù)觸達(dá)消息的效率。

△ 分組合并消息列表

△分 Tab 合并消息列表

對(duì)于通知類(lèi)型復(fù)雜的系統(tǒng)，還可使用二級(jí)列表的形式對(duì)消息進(jìn)一步分類(lèi)展示，如微信及支付寶，由于其包含大量第三方服務(wù)，消息復(fù)雜，均設(shè)置了二級(jí)消息列表幫助用戶(hù)分類(lèi)查找消息。

△ 二級(jí)消息列表

3. 消息卡片

消息列表中的卡片有兩種樣式可選，一般在一級(jí)消息列表使用小卡片樣式，讓用戶(hù)有更高的瀏覽效率。大卡片樣式則用于二級(jí)消息列表，或當(dāng)前應(yīng)用的消息數(shù)量較少時(shí)。

△消息卡片應(yīng)用示意

4. 消息中心設(shè)置

一般位于消息中心列表頁(yè)右上角，若可設(shè)置項(xiàng)較多，則提供設(shè)置入口在二級(jí)頁(yè)設(shè)置。一些常用的消息設(shè)置項(xiàng)如下：

1. 全部已讀：對(duì)于消息數(shù)量較多，且未讀態(tài)會(huì)影響 badge 的展示時(shí)需要提供該設(shè)置項(xiàng)。點(diǎn)擊后設(shè)置列表消息項(xiàng)全部已讀。
2. 發(fā)起對(duì)話(huà)：若系統(tǒng)包含通訊功能，一般會(huì)在消息類(lèi)表頁(yè)提供發(fā)起對(duì)話(huà)的快捷入口。點(diǎn)擊后跳轉(zhuǎn)到通訊錄或好友列表。
3. 設(shè)置通知提示方式：提供按消息類(lèi)型設(shè)置某些通知項(xiàng)的接受渠道、接收時(shí)間段、各渠道之間的已讀聯(lián)動(dòng)等，如微博；或者讓用戶(hù)選擇消息通知的精確度，是否包含具體信息，如微信可接收“您收到了一條信息”的模糊消息。
4. 打開(kāi)消息推送權(quán)限：一些應(yīng)用有一些狀態(tài)更新或重要的提醒需要用戶(hù)在系統(tǒng)設(shè)置中打開(kāi)當(dāng)前應(yīng)用的通知權(quán)限，會(huì)包含提示用戶(hù)打開(kāi)通知的功能。這些提示需要在用戶(hù)進(jìn)行了如“辦理事項(xiàng)”、“上傳狀態(tài)”等發(fā)起流程的操作后提示。不建議在用戶(hù)啟動(dòng) App 時(shí)就彈窗提示打開(kāi)通知。

四、總結(jié)

本文是對(duì)消息通知系統(tǒng)設(shè)計(jì)的初步介紹，希望能幫助到新手產(chǎn)品、交互、產(chǎn)品體驗(yàn)設(shè)計(jì)師快速了解消息通知系統(tǒng)的內(nèi)容盤(pán)點(diǎn)與消息中心的設(shè)計(jì)方法，制定及時(shí)、高效、完整的消息通知系統(tǒng)。

文中主要覆蓋了常見(jiàn)的系統(tǒng)與場(chǎng)景，若實(shí)施過(guò)程中遇到文中方法無(wú)法解決的情況歡迎留言溝通。

作者：Megan，來(lái)自騰訊CDC主創(chuàng)團(tuán)隊(duì)

推薦關(guān)注公眾號(hào) “騰訊設(shè)計(jì)”（ 微信ID：TencentDesign ），第一時(shí)間獲取騰訊官方的設(shè)計(jì)方法論

本文由 @騰訊設(shè)計(jì) 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載

題圖來(lái)自Unsplash，基于CC0協(xié)議