如何打造體驗(yàn)優(yōu)質(zhì)的品牌類小程序
為幫助品牌類小程序打造高品質(zhì)體驗(yàn)，助力開發(fā)者實(shí)現(xiàn)更好的經(jīng)營，智能小程序官方針對(duì)品牌類小程序提出了體驗(yàn)方面的建議，來指導(dǎo)開發(fā)者低成本高質(zhì)量的改善小程序體驗(yàn)，助力品質(zhì)感知及關(guān)鍵指標(biāo)提升。
遵循指引，優(yōu)化品牌類小程序體驗(yàn)，可助力小程序達(dá)成以下目標(biāo)：
提升品質(zhì)：助力品牌類小程序進(jìn)行體驗(yàn)改善以符合官方要求，并進(jìn)一步提升品質(zhì)感知；
促進(jìn)轉(zhuǎn)化：結(jié)合典型品牌類小程序?qū)嶒?yàn)數(shù)據(jù)發(fā)現(xiàn)，按照官方建議優(yōu)化體驗(yàn)后，試點(diǎn)小程序的支付成功轉(zhuǎn)化率 （支付成功 UV /DAU）有了很明顯的提升，部分甚至達(dá)到77%以上。
內(nèi)容索引
一、增強(qiáng)品質(zhì)感知：
打磨體驗(yàn)細(xì)節(jié)，塑造高品質(zhì)感知
保證體驗(yàn)一致性
提升品牌可靠度
二、提升功能體驗(yàn)：
完善功能，避免基礎(chǔ)功用缺失、不可用
避免打斷干擾，提升體驗(yàn)順暢度
優(yōu)化功能細(xì)節(jié)，提升體驗(yàn)品質(zhì)感
三、打造閉環(huán)體驗(yàn)：
小程序內(nèi)部實(shí)現(xiàn)體驗(yàn)閉環(huán)
與百度APP實(shí)現(xiàn)體驗(yàn)閉環(huán)
一、增強(qiáng)品質(zhì)感知
1. 打磨體驗(yàn)細(xì)節(jié)，塑造高品質(zhì)感知
精細(xì)化設(shè)計(jì)小程序基本信息，優(yōu)化呈現(xiàn)方式，突出品牌優(yōu)勢(shì)。
注重小程序頭像、名稱、簡(jiǎn)介設(shè)計(jì)，在有限空間突出品牌及小程序優(yōu)勢(shì)，增強(qiáng)入口吸引力。
正確
小程序頭像清晰明確符合品牌風(fēng)格；簡(jiǎn)介簡(jiǎn)短明了突出特色，打造高品牌初步認(rèn)知。
錯(cuò)誤
小程序頭像不清晰不符合品牌風(fēng)格；簡(jiǎn)介冗余，無法展示完整。
強(qiáng)化關(guān)鍵頁面的視覺效果，營造品牌沉浸感知。
建議品牌類小程序在關(guān)鍵頁面（如：首頁、登錄中間頁、活動(dòng)頁、商品詳情頁等）進(jìn)行沉浸式設(shè)計(jì)，可極大提升頁面視覺效果，增強(qiáng)品質(zhì)感知。
您可直接使用智能小程序官方提供的自定義導(dǎo)航組件：查看文檔。
正確
首頁使用自定義透明導(dǎo)航，提供更沉浸更高級(jí)的品牌視覺感受。
錯(cuò)誤
首頁未使用自定義透明導(dǎo)航，影響品牌的視覺表達(dá)和呈現(xiàn)。
細(xì)節(jié)需貼合品牌氣質(zhì)，各處可加強(qiáng)品牌透出。
注重細(xì)節(jié)設(shè)計(jì)，小程序各處都應(yīng)符合品牌整體氣質(zhì)。同時(shí)，還可加強(qiáng)品牌透出力度，助力用戶建立品牌感知。
示例 1：默認(rèn)用戶頭像應(yīng)符合品牌氣質(zhì)。
示例 2：登錄中間頁可加強(qiáng)品牌視覺透出。
示例 3：加載狀態(tài)可加強(qiáng)品牌氛圍透出。
改善全面屏適配問題，塑造產(chǎn)品高質(zhì)感知。
建議為小程序做好全面屏適配，避免誤操作。
正確
保證適配全面屏機(jī)型，防止底部關(guān)鍵按鈕誤操作。
錯(cuò)誤
未進(jìn)行全面屏機(jī)型適配，底部關(guān)鍵按鈕容易誤觸。
注重邊緣場(chǎng)景體驗(yàn)設(shè)計(jì)，避免出現(xiàn)體驗(yàn)終點(diǎn)。
示例1：商品已下線的情況
正確
為已下線商品提供兜底頁面，避免出現(xiàn)空白頁。
錯(cuò)誤
已下線商品未提供兜底頁面，出現(xiàn)空白頁導(dǎo)致體驗(yàn)終斷。
示例2：網(wǎng)絡(luò)異常的情況
正確
為網(wǎng)絡(luò)異常的情況提供兜底頁面，避免出現(xiàn)空白頁。
錯(cuò)誤
網(wǎng)絡(luò)異常的情況未提供兜底頁面，出現(xiàn)空白頁導(dǎo)致體驗(yàn)終斷。
2. 保證體驗(yàn)一致性
小程序應(yīng)保證內(nèi)部流程體驗(yàn)一致，打造統(tǒng)一的體驗(yàn)感受。
示例：同類環(huán)節(jié)下，登錄形式應(yīng)保證一致
正確
購買流程下，均采用半層面板的登錄形式，保證體驗(yàn)一致。
錯(cuò)誤
購買流程下，不同入口喚起登錄，登錄流程及登錄方式均有差異。
小程序應(yīng)保證內(nèi)部布局樣式一致，打造統(tǒng)一的視覺感受。
示例1：小程序內(nèi)部的彈窗樣式應(yīng)保持一致
正確
小程序內(nèi)部的彈窗提醒樣式完全一致。
錯(cuò)誤
小程序內(nèi)部不同的彈窗提醒樣式有差異（彈窗圓角、文案標(biāo)題、文案字號(hào)、按鈕顏色均不一致）。
示例2：小程序內(nèi)部的按鈕樣式應(yīng)保持一致
正確
小程序內(nèi)部的按鈕樣式完全一致。
錯(cuò)誤
小程序內(nèi)部不同的按鈕樣式有差異（按鈕圓角、文案字號(hào)、按鈕顏色均不一致）。
小程序應(yīng)保證內(nèi)部文案表述一致，打造統(tǒng)一的閱讀感受。
示例：小程序內(nèi)部的文案表述應(yīng)保證一致且明確
錯(cuò)誤
小程序內(nèi)部不同頁面的文案表述不一致，按鈕順序不一致（①和③）；
小程序內(nèi)部同一頁面的文案表述不一致（②和③）。
3. 提升品牌可靠度
為小程序配備百度保障標(biāo)志，提升用戶對(duì)品牌的信賴。
您可直接使用百度APP官方提供的保障能力：查看文檔。
配備百度保障標(biāo)志后，會(huì)在關(guān)鍵環(huán)節(jié)透出，提升品牌可靠度，增強(qiáng)用戶對(duì)小程序的信賴。
為小程序申請(qǐng)開啟“官方認(rèn)證”，提升用戶對(duì)品牌的信賴。
目前該權(quán)益面向 A 級(jí) 和 B 級(jí) 小程序開放。
更多詳細(xì)介紹您可查看智能小程序官方提供的品牌關(guān)鍵詞能力：查看文檔。
審核通過后，在百度APP搜索關(guān)鍵詞時(shí)，將展現(xiàn)小程序單卡及對(duì)應(yīng)的“官方”標(biāo)志。
二、提升功能體驗(yàn)
1. 完善功能，避免基礎(chǔ)功用缺失、不可用
避免核心轉(zhuǎn)化路徑——登錄，出現(xiàn)不可用的情況。
接入小程序官方登錄能力，能夠?qū)崿F(xiàn)自有帳號(hào)體系與百度帳號(hào)體系的互通。
您可直接使用智能小程序官方提供的登錄能力：查看文檔
您還可以使用內(nèi)嵌登錄組件，支持不同場(chǎng)景下獲取手機(jī)號(hào)信息，一鍵完成登錄。
您可直接使用智能小程序官方提供的聯(lián)合登錄/手機(jī)號(hào)授權(quán)內(nèi)嵌組件：查看文檔
同時(shí)，還應(yīng)該保證功能可逆，避免不可退出登錄的情況。
示例：需要登錄的小程序也需要配備對(duì)應(yīng)的退出登錄功能，否則會(huì)導(dǎo)致用戶不安全感。
避免核心轉(zhuǎn)化路徑——支付，出現(xiàn)不可用的情況。
接入小程序官方支付能力，獲取聚合支付方式。
您可直接使用智能小程序官方提供的支付能力：查看文檔。
您還可以使用內(nèi)嵌支付組件，將支付渠道內(nèi)嵌在小程序訂單提交頁內(nèi)，縮短交易鏈路，提升支付轉(zhuǎn)化率。
您可直接使用智能小程序官方提供的內(nèi)嵌支付組件：查看文檔
正確
訂單提交頁的首屏可展示支付方式時(shí)，建議使用內(nèi)嵌支付組件，此時(shí)底部主操作按鈕為"確認(rèn)支付"，可減少用戶操作步驟，提高轉(zhuǎn)化機(jī)會(huì)。
錯(cuò)誤
訂單提交頁內(nèi)容較多，支付方式首屏不可見，用戶不便選擇支付渠道。此時(shí)，不建議使用內(nèi)嵌支付組件。
通過百度收銀臺(tái)完成交易后，將自動(dòng)推送支付狀態(tài)通知，提升用戶安全感知。同時(shí)，通過支付通知還可以便捷復(fù)訪小程序，提升回流效果。
避免客服能力缺失，不可用的情況。
示例1：提供電話客服能力。
示例2：提供在線客服能力，且保證正常維護(hù)，有回復(fù)。
正確
在線客服能夠迅速準(zhǔn)確的回答用戶的提問。
錯(cuò)誤
配置的機(jī)器人客服能力較弱，答非所問，無法幫助用戶解決問題。
避免小程序內(nèi)部搜索、篩選功能缺失，應(yīng)保證用戶檢索內(nèi)容簡(jiǎn)便快捷。
和位置強(qiáng)關(guān)聯(lián)的服務(wù)需支持定位能力。
避免隱藏價(jià)格的情況，商品價(jià)格、優(yōu)惠信息應(yīng)透明可見。
正確
直接展示商品價(jià)格。
注意
未直接展示商品價(jià)格，難以促成轉(zhuǎn)化。
避免售后功能缺失、不可用的情況。
示例1：提供退貨退款的能力
示例2：提供查看物流的能力。
2. 避免打斷干擾，提升體驗(yàn)順暢度
重視關(guān)鍵轉(zhuǎn)化流程（如：登錄、支付等）的設(shè)計(jì)，避免體驗(yàn)斷點(diǎn)，提升體驗(yàn)順滑度。
示例1：打造順暢的登錄體驗(yàn)，避免打擾
正確
沒有無意義的打斷和提醒，點(diǎn)擊需要依賴登錄的內(nèi)容直接喚起登錄流程；并且在登錄完成后可以延續(xù)前置操作，避免體驗(yàn)斷點(diǎn)。
錯(cuò)誤
點(diǎn)擊需要依賴登錄的內(nèi)容未直接吊起登錄面板，僅進(jìn)行彈窗/toast未登錄提醒，用戶操作成本高。
錯(cuò)誤
頻繁無意義的toast提醒，打斷用戶；且登錄完成后未延續(xù)前置操作，出現(xiàn)體驗(yàn)斷點(diǎn)，導(dǎo)致重復(fù)操作。
示例2：非必要不強(qiáng)制登錄
正確
不依賴用戶信息的內(nèi)容允許用戶不登錄即可查看，避免強(qiáng)制登錄。
錯(cuò)誤
不依賴用戶信息的內(nèi)容強(qiáng)制要求用戶登錄后方可查看。
示例3：選擇合適的登錄方式
正確
使用半層面板可縮短用戶步驟、減少體驗(yàn)打斷感，但無法透出自有品牌，建議用于依賴登錄的功能流程之中。
正確
使用登錄中間頁可縮短用戶步驟、增強(qiáng)品牌感知，但會(huì)放大體驗(yàn)打斷感，可用于依賴登錄的一級(jí)頁面或登錄專屬流程中。
示例4：簡(jiǎn)短的購買轉(zhuǎn)化流程，避免冗余步驟
正確
避免無意義的支付提醒和頁面跳轉(zhuǎn)。
錯(cuò)誤
支付流程中存在無意義的彈窗提醒和頁面跳轉(zhuǎn)，會(huì)打斷用戶，延長(zhǎng)操作路徑，增加用戶放棄支付的可能。
3. 優(yōu)化功能細(xì)節(jié)，提升體驗(yàn)品質(zhì)感
優(yōu)化加載體驗(yàn)，避免卡頓、打斷、不協(xié)調(diào)感。
分場(chǎng)景優(yōu)化小程序內(nèi)部加載體驗(yàn)，降低用戶等待感知，提升體驗(yàn)流暢感知度。
示例1：全頁面或頁面局部加載體驗(yàn)
正確
可采用LOGO動(dòng)畫、LOGO掃光等方式加載，加強(qiáng)品牌透出。
注意
采用toast加載的方式缺乏品質(zhì)感。
示例2：首頁、商品詳情頁（等圖片較多頁面）可使用骨架屏加載
示例3：圖片加載使用LOGO占位圖，增強(qiáng)品牌透出
精細(xì)化區(qū)分異常情況，減少操作，提供兜底方案。
正確
精細(xì)化區(qū)分異常情況，提供對(duì)應(yīng)解決方案。
錯(cuò)誤
所有異常情況均未進(jìn)行明確提醒。
區(qū)分設(shè)計(jì)分享外鏈的內(nèi)容，保證接收者觀感，提升鏈接回流吸引力。
您可直接使用智能小程序官方提供的 web-view 分享能力：查看文檔。
正確
分享外鏈與小程序內(nèi)部頁面內(nèi)容一致，透出關(guān)鍵吸引點(diǎn)，有助于提升回流引力。
錯(cuò)誤
分享外鏈文案及圖片未進(jìn)行區(qū)分設(shè)計(jì)，缺乏吸引，不利于分享回流。
如果小程序獲取了用戶的頭像和昵稱信息，建議在已登錄的對(duì)應(yīng)場(chǎng)景下進(jìn)行展示。
正確
獲取用戶的頭像和昵稱信息后，若用戶已登錄，可在個(gè)人中心、評(píng)價(jià)等需要展示用戶信息的場(chǎng)景下進(jìn)行頭像和昵稱外露展示。
錯(cuò)誤
獲取用戶的頭像和昵稱信息后，并沒有進(jìn)行使用，導(dǎo)致不必要的信息獲取。
三、打造閉環(huán)體驗(yàn)
1. 小程序內(nèi)部實(shí)現(xiàn)體驗(yàn)閉環(huán)
保證關(guān)鍵流程體驗(yàn)閉環(huán)
示例1：保證優(yōu)惠券領(lǐng)取及使用體驗(yàn)閉環(huán)，促進(jìn)轉(zhuǎn)化提升
示例2：保證售后體驗(yàn)閉環(huán)，增強(qiáng)信賴度
2. 與百度APP實(shí)現(xiàn)體驗(yàn)閉環(huán)
調(diào)用百度APP-發(fā)票組件，幫助用戶快速獲取/新增發(fā)票抬頭。
您可直接使用智能小程序官方提供的發(fā)票組件：查看文檔。
您可查看更多與百度APP實(shí)現(xiàn)體驗(yàn)閉環(huán)的內(nèi)容，為品牌小程序打造更優(yōu)質(zhì)的體驗(yàn)。
您可查看智能小程序官方體驗(yàn)白皮書《如何應(yīng)用百度 APP 基礎(chǔ)能力打造閉環(huán)服務(wù)體驗(yàn)帳號(hào)》：查看文檔。
來源：百度智能小程序
