原創聲明:本文為作者原創,未經允許不得轉載,經授權轉載需注明作者和出處
此文是官文增刪、重構、搬運而來!對于用戶良好體驗的保證,
微信官方為小程序做的預定義行為
,達到了令人發指的程度!筆者自認為沒什么能補充的,特此搬運,以求在以后的工作中能夠有所借鑒。
基于小程序輕快的特點,在充分尊重用戶知情權和操作權的基礎之上,如何建立友好、高效、一致的用戶體驗呢?
每個頁面都應有明確的重點,以便于用戶每進入一個新頁面的時候都能快速地理解頁面內容,應盡量避免無關的干擾因素。
以查詢為例,頁面內容可以出現的應該是:最近搜索詞、熱點搜索詞,這些可以提升用戶操作體驗的內容。
過多與用戶的目標無關內容,易造成用戶的迷失。下圖案例,廣告的內容基本占了整個版面的50%,極度可能被拒絕上架。
在用戶進行某一個操作流程時,應避免出現用戶目標流程之外的內容而打斷用戶。比如:用戶在使用租車服務時,彈出來的抽獎活動
小程序的全部頁面,均會自帶有微信提供的導航欄,統一解決當前在哪,如何回去的問題。在微信層級導航保持體驗一致,有助于用戶在微信內形成統一的體驗和交互認知,無需在各小程序和微信切換中新增學習成本或改變使用習慣。
小程序各種限制跳轉層級,并明確指出建議開發者可以讓用戶2步到想到的地方,這就需要不同導航方式進行配合使用了。
(1)微信導航欄,直接繼承于客戶端,除導航欄顏色之外,開發者無需亦不可對其中的內容進行自定義。選擇的顏色需要在滿足可用性前提下,和諧搭配微信提供的兩套主導航欄圖標。
(2)頁面內導航,開發者在頁面內添加自有的導航需保持不同頁面間導航一致。因盡量簡單,若僅為一般線性瀏覽的頁面建議僅使用微信導航欄即可。
(3)標簽分頁(Tab)導航,可固定在頁面頂部或者底部,便于用戶在不同的分頁間做切換。標簽數量不得少于2個,最多不得超過5個,為確保點擊區域,建議標簽數量不超過4項
。一個頁面也不應出現一組以上的標簽分頁欄
頂部標簽分頁欄顏色可自定義。在自定義顏色選擇中,務必注意保持分頁欄標簽的可用性、可視性和可操作性。
當不可避免的出現了加載和等待的時候,需要予以及時的反饋以舒緩用戶等待的不良情緒。
(1)啟動頁加載,小程序啟動頁是小程序在微信內容一定程度上展現品牌特征的頁面之一,開發者只能定義品牌Logo、小程序名稱。無需開發者開發
。
(2)頁面下拉刷新加載,開發者無需自行開發。標準的刷新樣式和動畫,能向用戶明確的小程序歸屬者,防止造假與作弊。
(3)頁面內加載反饋,開發者可在小程序里自定義頁面內容的加載樣式,自定義加載樣式都應該盡可能簡潔,并使用簡單動畫告知用戶加載過程。
(4)局部加載反饋,即只在觸發加載的頁面局部進行反饋,這樣的反饋機制更加有針對性,頁面跳動小,是微信推薦的反饋方式。
注意事項
:
根據實際情況,操作的結果也應予以明確反饋,可選擇不同的結果反饋樣式。
(1)頁面局部操作結果反饋,可在操作區域予以直接反饋。常用控件,微信設計中心將提供控件庫,其中的控件都已提供完整操作反饋
(2)頁面級操作結果反饋,可使用彈出式提示(Toast)、模態對話框或結果頁面展示
特別注意該形式不適用于錯誤提示
,因為錯誤提示需明確告知用戶,因而不適合使用一閃而過的彈出式提示。在出現異常時予以用戶必要的狀態提示,并告知解決方案,使其有路可退。在表單頁面中尤其是表單項較多的頁面中,應明確指出出錯項目,以便用戶修改。
由于手機鍵盤區域小且密集,輸入困難的同時還易引起輸入錯誤,在設計小程序頁面時因盡量減少用戶輸入,利用現有接口或其他一些易于操作的選擇控件來改善用戶輸入的體驗。比如:
除了以上所提到的種種原則,建議接入微信的小程序還應該時刻注意不同頁面間的統一性和延續性,在不同的頁面盡量使用一致的控件和交互方式。
統一的頁面體驗和有延續性的界面元素都將幫助用最少的學習成本達成使用目標,減輕頁面跳動所造成的不適感。正因如此,小程序可根據需要使用微信提供的標準控件,以達到統一穩定的目的。
當然這一切的前提是你的小程序是可以被上架的。至于你的小程序是否可以上架的判斷?請參考 知道嗎?你的小程序可能不能上線! ,更加詳細的內容,請移步騰訊官方規范內容。