百度智能小程序設計原則-層次感
- 威海自媒體運營與推廣 威海百度智能小程序運營
- 1579
移動設備屏幕尺寸相對小，一屏展現(xiàn)的信息非常有限。設計小程序時，請注意在頁面展現(xiàn)時突出一個重點，幫助用戶快速理解，避免頁面上出現(xiàn)其它與用戶的決策和操作無關的干擾因素，降低篩選信息的難度。
信息設計重點明確
設計界面信息時，請注意根據內容的重要程度設計其層級主次，以幫助用戶更簡單地獲取所需要的信息和作出判斷。可以通過更大的字體、更重的文字體量、更明顯的顏色等為內容賦予更強的展現(xiàn)。（了解更多）
正確
標題文字使用較大字號、加粗，正文文字使用較小字體，有利于信息的閱讀。
錯誤
所有文字都使用較大字號且加粗，閱讀時容易分散注意力，影響信息傳遞。
提煉內容，精簡表達，通過合理的排版突出主次。
正確
通過不同的字體大小和排版，使重點信息更突出。
錯誤
主次信息的混排、冗余的文案穿插，讓找關鍵信息變得困難。
功能操作主次分明
當希望對用戶的下一步功能操作進行引導時，應為推薦的主操作按鈕設計更明顯的樣式。（了解更多）
正確
對用戶可能需要進行的下一步操作的功能進行強化展現(xiàn)。
錯誤
按鈕沒有主次之分，增加用戶選擇判斷成本。
反饋力度強弱適度
在用戶使用小程序時，會出現(xiàn)需要等待的場景。用戶的耐心有限，為避免讓用戶面對一個靜止的屏幕等待未知的結果，需要對當前狀態(tài)及時反饋，告知用戶當前小程序仍在正常運作，以此降低用戶使用過程中等待的焦慮感。
1. 框架啟動加載
啟動小程序框架時，加載反饋動畫與百度 App 通用加載動畫不同，更突出小程序的品牌和特性。
此為百度小程序框架通用能力，除 LOGO 和名稱調用開發(fā)者的小程序信息外，其他視覺動效及交互均由百度小程序框架統(tǒng)一提供，開發(fā)者無需進行額外開發(fā)。
2. 全局加載反饋
百度小程序提供通用加載的組件，也可以由開發(fā)者自己根據品牌定義加載樣式。但此時無法明確告知具體加載位置和進度，自行設計時請注意設計加載動畫，避免頁面靜止從而引起用戶焦慮。
1.加載浮層
2.頂部導航欄加載
3.開發(fā)者自定義加載樣式（示例）
你可直接使用智能小程序相關體驗資產。（下載設計資源 | 查看開發(fā)文檔）
3. 下拉刷新反饋
百度小程序提供通用的下拉刷新組件，使用此組件后，當用戶下拉頁面至一定高度時，可以觸發(fā)當前頁面的整體刷新。
你可直接使用智能小程序相關體驗資產。（查看開發(fā)文檔）
4. 用戶選項反饋
用于反饋用戶操作頁面內選項的狀態(tài)。（了解更多）
多選 Checkbox
單選 Radio
開關 Switch
滑動選擇條 Slider
當選擇項較多時，可以使用浮層選擇器承載內容。
1.單列選擇器
2.時間選擇器
3.日期選擇器
操作結果反饋
同一時間只顯示一個反饋提示，并且應該根據不同的場景和反饋需要的強弱程度選擇不同樣式。
1. 消息提示框
不打斷用戶流程，會自動消失，適用于輕量級的提示。（了解更多）
1.圖文Toast 適用于操作成功反饋。
2.純文Toast 適用于情況說明和提醒。
2. 模態(tài)對話框
作為模態(tài)組件，會打斷用戶路徑并分散用戶的注意，請謹慎使用。（了解更多）
1.單按鈕提示框 用于重要信息周知。
2.雙按鈕提示框 周知并詢問下一步操作。
3. 全屏結果頁
在任務流程的最后一環(huán)，且結果反饋比較重要時，可使用全屏結果頁向用戶明確操作結果，并引導下一步操作。
開發(fā)者可以根據場景需求自行開發(fā)，視覺資源下載也放置了基礎視覺源文件，供快速開發(fā)使用。
1.操作結果反饋（示例） 2.出錯或內容為空（示例）
來源：百度智能小程序
