銀川湖海找房信息網
銀川房價_銀川二手房_銀川二手房網_銀川市二手房/價格/出售/信息/房源
購房聯系電話:13995276414【微信同上】
業務合作電話:18995005252【微信同上】

小程序圖標尺寸多大——分享幾個常用的網站!

 二維碼
發表時間:2020-07-27 18:43網址:http://www.684779.tw/1584700.html#_np=2_1193

小程序圖標尺寸多大——分享幾個常用的網站!


經常有人問起小程序設計規范的問題,雖然官方有供給樣式庫的下載,但是停留在16年版,不是最新的。而設計經驗這部分網絡上也沒有比較全面的共享,期望今日的內容能幫助我們更快速地上手。
    隨著2018年小程序的迅猛發展,小程序現已被各大企業廣泛采用,「觸手可及、用完即走」的用戶體驗備受青睞,隨之小程序設計也成為設計師的必備技術,那在進行小程序界面設計時,應該如何快速做設計?過程中又要注意哪些問題呢?
    對於已經開發了App的產品,在進行小程序設計時需遵守小程序的規范,同時要堅持小程序界面設計與App的風格統一性。

小程序圖標尺寸多大——分享幾個常用的網站!

    小程序設計區域
    小程序的「所有頁面」右上角方位,都固定放置了小程序的菜單,在設計界面時需預留出該區域空間。
    「最全的小程序設計規范詳解」共享給正在學UI的你
    NavBar設計
    1.小程序菜單固定樣式
    微信供給了深淺兩種配色樣式,以便更好地融合到各種風格的頁面中,需注意堅持小程序菜單清晰的辨識度。
    「最全的小程序設計規范詳解」共享給正在學UI的你
    線上案例:
    「最全的小程序設計規范詳解」共享給正在學UI的你
    2.交互注意事項
    如果要在小程序菜單附近放置交互元素,要考慮是否有交互沖突,應盡量防止誤觸的可能。
    「最全的小程序設計規范詳解」共享給正在學UI的你
    建議開發者設計的自有導航樣式與微信官方小程序菜單樣式堅持一定差異,以便區分。
    「最全的小程序設計規范詳解」共享給正在學UI的你
    如上圖,小紅書的自有導航樣式個人不推崇,理由如下:
    樣式與官方菜單樣式未區分開,簡單產生疑問;
    NavBar欄兩端對稱在頂部,視覺上顯得過於板滯。
    微信讀書既有微信線條外框的DNA,又區別於官方樣式,是不錯的綜合。以上**個人觀點,還需用戶數據來客觀驗證。
    3.搜索框常見的幾種表現方式
    「最全的小程序設計規范詳解」共享給正在學UI的你
    ToolBar設計
    1.小程序設計規范
    頂部標簽分頁欄顏色可自定義,一般會沿用App的設計風格,以保證兩個渠道的視覺統一性。
    「最全的小程序設計規范詳解」共享給正在學UI的你
    2.常見的幾種表現方式
    「最全的小程序設計規范詳解」共享給正在學UI的你
    TabBar設計
    1.小程序設計規范
    微信有供給小程序的底部標簽樣式,建議標簽數量在2-4個適宜。
    「最全的小程序設計規范詳解」共享給正在學UI的你
    也可根據產品需求選擇或許去掉底部標簽欄功用。
    「最全的小程序設計規范詳解」共享給正在學UI的你
    2.常見的幾種表現方式
    「最全的小程序設計規范詳解」共享給正在學UI的你
    啟動頁圖標
    啟動頁除品牌Logo外,其他元素都由微信統一供給,且不能更改,設計師僅需供給2倍和3倍尺寸的Logo即可。
    「最全的小程序設計規范詳解」共享給正在學UI的你
    加載樣式
    1.小程序設計規范
    全局加載是小程序名稱左側的加載圖標。模態的加載樣式將覆蓋整個頁面,由於無法明確奉告具體加載的方位或內容,可能會引重用戶的焦慮感,建議謹慎使用。
    「最全的小程序設計規范詳解」共享給正在學UI的你
    2.常用的加載樣式
    需奉告用戶具體加載的方位形狀,減輕用戶焦慮情緒。
    「最全的小程序設計規范詳解」共享給正在學UI的你
    對於沒有開發App來說,可依據官方推出的《微信小程序設計攻略》來設計,以確保快速設計出符合規范的小程序。
    小程序設計應遵從友好、高效、一致的設計原則,每個頁面都應有明確的重點,清晰明確地奉告用戶身在何處,又可以往何處去,確保用戶在頁面中遊刃有餘地穿梭而不走失。
    渠道設計網站推薦
    最後,推薦幾個常用的渠道設計網站。
    1.BAT各渠道小程序設計規范網站
    微信小程序設計攻略:https://developers.weixin.qq.com/miniprogram/design/
    「最全的小程序設計規范詳解」共享給正在學UI的你
    付出寶小程序設計規范:https://docs.alipay.com/mini/design
    「最全的小程序設計規范詳解」共享給正在學UI的你
    百度-智能小程序設計規范:
    https://smartprogram.baidu.com/docs/design/overview/introduction/
    「最全的小程序設計規范詳解」共享給正在學UI的你
    2.其他常用的設計規范網站
    蘋果-人機界面攻略:https://developer.apple.com/design/human-interface-guidelines/

小程序圖標尺寸多大——分享幾個常用的網站!

    詳細介紹了iOS設計規范,同時還供給了UI設計資源下載。
    「最全的小程序設計規范詳解」共享給正在學UI的你
    安卓-MD設計攻略:https://material.io/design/
    「最全的小程序設計規范詳解」共享給正在學UI的你
    螞蟻設計:https://design.alipay.com/#ds
    供給移動和Web端的設計組件,還有設計案例和心得的文章供學習。
    「最全的小程序設計規范詳解」共享給正在學UI的你
    微信樣式庫:https://weui.io/
    供給微信內的網頁和小程序設計規范。
    「最全的小程序設計規范詳解」共享給正在學UI的你


本文鏈接:http://www.684779.tw/1584700.html#_np=2_1193

最新銀川二手房
銀川租房信息