激情六月丁香婷婷|亚洲色图AV二区|丝袜AV日韩AV|久草视频在线分类|伊人九九精品视频|国产精品一级电影|久草视频在线99|在线看的av网址|伊人99精品无码|午夜无码视频在线

高校合作1：010-59833514 ?咨詢(xún)電話：400-810-1418 服務(wù)與監(jiān)督電話：400-810-1418轉(zhuǎn)接2

小程序設(shè)計(jì)規(guī)范解析，設(shè)計(jì)師必看！

發(fā)布時(shí)間：2024-08-29 11:06:31 瀏覽量：131次

經(jīng)常有人問(wèn)起小程序設(shè)計(jì)規(guī)范的問(wèn)題，雖然官方有提供樣式庫(kù)的下載，但是停留在最新版本，不是最新的。設(shè)計(jì)經(jīng)驗(yàn)部分在網(wǎng)絡(luò)上分享并不多，希望今天的內(nèi)容對(duì)大家有所幫助。

隨著最新的小程序的快速發(fā)展，小程序已經(jīng)被廣泛采用，用戶(hù)體驗(yàn)備受青睞。小程序設(shè)計(jì)成為設(shè)計(jì)師的必備技能，那么在進(jìn)行小程序界面設(shè)計(jì)時(shí)，應(yīng)該如何快速做設(shè)計(jì)？過(guò)程中又要注意哪些問(wèn)題呢？

對(duì)于已經(jīng)開(kāi)發(fā)了App的產(chǎn)品，在進(jìn)行小程序設(shè)計(jì)時(shí)需遵守小程序的規(guī)范，同時(shí)要保持小程序界面設(shè)計(jì)與App的風(fēng)格統(tǒng)一性。

Nav Bar設(shè)計(jì)

1. 小程序菜單固定樣式

微信提供了深淺兩種配色樣式，以便更好地融合到各種風(fēng)格的頁(yè)面中，需注意保持小程序菜單清晰的辨識(shí)度。

線上案例：

2. 交互注意事項(xiàng)

如果要在小程序菜單附近放置交互元素，要考慮是否有交互沖突，應(yīng)盡量避免誤觸的可能。

建議開(kāi)發(fā)者設(shè)計(jì)的自有導(dǎo)航樣式與微信官方小程序菜單樣式保持一定差異，以便區(qū)分。

如上圖，小紅書(shū)的自有導(dǎo)航樣式個(gè)人不推崇，理由如下：

  • 樣式與官方菜單樣式未區(qū)分開(kāi)，容易產(chǎn)生疑惑；
  • Nav Bar 欄兩端對(duì)稱(chēng)在頂部，視覺(jué)上顯得過(guò)于呆板。

微信讀書(shū)既有微信線條外框的 DNA，又區(qū)別于官方樣式，是不錯(cuò)的綜合。以上僅限個(gè)人觀點(diǎn)，還需用戶(hù)數(shù)據(jù)來(lái)客觀驗(yàn)證。

3. 搜索框常見(jiàn)的幾種表現(xiàn)形式

Tool Bar設(shè)計(jì)

1. 小程序設(shè)計(jì)規(guī)范

頂部標(biāo)簽分頁(yè)欄顏色可自定義，一般會(huì)沿用App的設(shè)計(jì)風(fēng)格，以保證兩個(gè)平臺(tái)的視覺(jué)統(tǒng)一性。

2. 常見(jiàn)的幾種表現(xiàn)形式

Tab Bar設(shè)計(jì)

1. 小程序設(shè)計(jì)規(guī)范

微信有提供小程序的底部標(biāo)簽樣式，建議標(biāo)簽數(shù)量在2-4個(gè)適宜。

也可根據(jù)產(chǎn)品需要選擇或者去掉底部標(biāo)簽欄功能。

2. 常見(jiàn)的幾種表現(xiàn)形式

啟動(dòng)頁(yè)圖標(biāo)

啟動(dòng)頁(yè)除品牌Logo外，其他元素都由微信統(tǒng)一提供，且不能更改，設(shè)計(jì)師僅需提供2倍和3倍尺寸的Logo即可。

加載樣式

1. 小程序設(shè)計(jì)規(guī)范

全局加載是小程序名稱(chēng)左側(cè)的加載圖標(biāo)。模態(tài)的加載樣式將覆蓋整個(gè)頁(yè)面，由于無(wú)法明確告知具體加載的位置或內(nèi)容，可能會(huì)引起用戶(hù)的焦慮感，建議謹(jǐn)慎使用。

2. 常用的加載樣式

需告知用戶(hù)具體加載的位置形狀，減輕用戶(hù)焦慮情緒。

對(duì)于沒(méi)有開(kāi)發(fā)App來(lái)說(shuō)，可依據(jù)官方推出的《微信小程序設(shè)計(jì)指南》來(lái)設(shè)計(jì)，以確?？焖僭O(shè)計(jì)出符合規(guī)范的小程序。

小程序設(shè)計(jì)應(yīng)遵循友好、高效、一致的設(shè)計(jì)原則，每個(gè)頁(yè)面都應(yīng)有明確的重點(diǎn)，清晰明確地告知用戶(hù)身在何處，又可以往何處去，確保用戶(hù)在頁(yè)面中游刃有余地穿梭而不迷路。

平臺(tái)設(shè)計(jì)網(wǎng)站推薦

推薦幾個(gè)常用的平臺(tái)設(shè)計(jì)網(wǎng)站：

1. BAT各平臺(tái)小程序設(shè)計(jì)規(guī)范網(wǎng)站

微信小程序設(shè)計(jì)指南：點(diǎn)擊咨詢(xún)

支付寶小程序設(shè)計(jì)規(guī)范：點(diǎn)擊咨詢(xún)

百度-智能小程序設(shè)計(jì)規(guī)范：點(diǎn)擊咨詢(xún)

2. 其他常用的設(shè)計(jì)規(guī)范網(wǎng)站

蘋(píng)果-人機(jī)界面指南：點(diǎn)擊咨詢(xún)

安卓-MD設(shè)計(jì)指南：點(diǎn)擊咨詢(xún)

螞蟻設(shè)計(jì)：點(diǎn)擊咨詢(xún)

微信樣式庫(kù)：點(diǎn)擊咨詢(xún)

熱門(mén)課程推薦

熱門(mén)資訊

請(qǐng)綁定手機(jī)號(hào)

獲取驗(yàn)證碼
x

同學(xué)您好！

您已成功報(bào)名0元試學(xué)活動(dòng)，老師會(huì)在第一時(shí)間與您取得聯(lián)系，請(qǐng)保持電話暢通！
確定