正所謂無規(guī)矩不成方圓，凡是都有一定的規(guī)則，微信小程序也不例外，今天小編就來與大家分享一下“微信小程序在設(shè)計的時候需要遵循哪些規(guī)則?”的有關(guān)內(nèi)容，希望對大家有所幫助。

1、頁面設(shè)計需要考慮除微信導(dǎo)航以外其它導(dǎo)航頁面的設(shè)計，遵循“導(dǎo)航明確，來去自如”，也就是能讓客戶知道，當前在哪，可以去哪，如何回去等問題。

2、頁面設(shè)計需要遵循重點突出，并且不能出現(xiàn)與業(yè)務(wù)無關(guān)的業(yè)務(wù)入口，正反舉例：

錯誤示例

以上頁面主題是查詢，但查詢按鈕下面卻出現(xiàn)“今日熱點|頭條新聞”的無關(guān)內(nèi)容

正確示例

以上頁面查詢按鈕下面顯示的是最新搜索過的關(guān)鍵詞，與頁面主題匹配

3、頁面設(shè)計無需考慮微信一級菜單的導(dǎo)航，微信系統(tǒng)內(nèi)的所有小程序均會自帶有微信提供的導(dǎo)航欄

標準導(dǎo)航圖

4、微信導(dǎo)航欄自定義顏色規(guī)則，開發(fā)者如果需要自設(shè)導(dǎo)航需要與官方定義的顏色和諧搭配

官方定義導(dǎo)航顏色

5、小程序首頁可選擇微信提供的原生底部標簽分頁樣式，該樣式僅供小程序首頁使用。初期的頁面內(nèi)導(dǎo)航設(shè)計盡可能利用微信自帶導(dǎo)航Tab，添加自有導(dǎo)航可以添加標簽分頁(Tab)導(dǎo)航，標簽數(shù)量不得少于2個，最多不得超過5個，為確保點擊區(qū)域，建議標簽數(shù)量不超過4項。

小程序標準導(dǎo)航樣式

6、小程序已經(jīng)明確定義了標準的啟動頁面和頁面下拉刷新加載樣式，無需開發(fā)者設(shè)計，啟動頁面只能上傳品牌LOGO且不能更改。

小程序啟動頁標準樣式

下拉加載頁標準樣式

7、小程序頁面的加載反饋和結(jié)果反饋應(yīng)提供載入進度和結(jié)果提示，并且每個頁面都要有明確的指引操作和退出提示。

加載頁必須有加載提示如右邊圖

結(jié)果反饋必須有明確提示如：已發(fā)送

8、小程序頁面設(shè)計需要遵循“減少輸入，巧用接口，多用選擇”的原則，最大限度的優(yōu)化用戶體驗，減少或避免不必要的鍵盤輸入。

搜索內(nèi)容建議設(shè)計成按鈕選擇而不是讓用戶手工輸入

持卡人和卡號不建議讓用戶直接輸入而是調(diào)用接口讓用戶選擇

9、小程序頁面的字體盡量與用戶所運行的系統(tǒng)字體保持一致，常用字號為20, 18, 17, 16,14 13, 10(pt)，字體顏色主內(nèi)容 Black 黑色，次要內(nèi)容 Grey 灰色;時間戳與表單缺省值 Light 灰色;大段的說明內(nèi)容而且屬于主要內(nèi)容用 Semi 黑;藍色為鏈接用色，綠色為完成字樣色，紅色為出錯用色 Press與 Disable狀態(tài)分別降低透明度為20%與10%

字體規(guī)范

字體顏色

主內(nèi)容 Black 黑色，次內(nèi)容 Grey 灰色;時間戳與表單缺省值 Light 灰色;大段說明內(nèi)容用 Semi 黑;

藍色為鏈接用色，綠色為完成字樣色，紅色為出錯用色

10、小程序頁面同樣明確定義了列表視覺規(guī)范、表單輸入視覺規(guī)范、按鈕使用原則、圖標使用原則等詳細的規(guī)范。

以上僅為筆者為大家整理出來的小程序設(shè)計最值得重視的諸多要點，如果您對小程序設(shè)計比較關(guān)注，請持續(xù)關(guān)注呆盟說后續(xù)推出的對《小程序設(shè)計指南》更專業(yè)的解讀文章。

以上就是關(guān)于“微信小程序在設(shè)計的時候需要遵循哪些規(guī)則?”的有關(guān)內(nèi)容，希望對大家有所幫助，如果您還想了解更多的內(nèi)容，可以關(guān)注本站，以便您獲取相關(guān)的資訊。