雷火平台-中国知名电竞赛事平台

聯(lián)系我們 face+ 關(guān)于 服務(wù) 案例
首頁(yè) 案例 服務(wù) 關(guān)于 face+

好看的微信小程序UI界面,讓人愛(ài)不釋手!

Time: 2019-09-26

眾所周知,每一個(gè)人都有顏控潛質(zhì),只要產(chǎn)品好看,就很容易讓人產(chǎn)生購(gòu)買欲。而手機(jī)應(yīng)用程序界面設(shè)計(jì)如何做到好看又好用,給予用戶極致的體驗(yàn)?zāi)兀吭谖⑿殴俜降脑O(shè)計(jì)文檔對(duì)微信小程序UI界面做了詳細(xì)的說(shuō)明,并提供了大量的用戶界面實(shí)例作為參考。如果開(kāi)發(fā)者能夠理解其中微信小程序UI設(shè)計(jì)基本理念,嚴(yán)格依據(jù)設(shè)計(jì)文檔創(chuàng)建和優(yōu)化小程序,一種美觀且使用的手機(jī)人機(jī)交互模式即可完成。


1.1.png


與傳統(tǒng)的網(wǎng)頁(yè)設(shè)計(jì)不同,小程序UI設(shè)計(jì)最大挑戰(zhàn)在于將桌面重心轉(zhuǎn)移為移動(dòng)使用,在屏幕尺寸和比例、輸入設(shè)備以及網(wǎng)絡(luò)特性等方便有所區(qū)別。因此,微信小程序UI設(shè)計(jì)需要考慮以下幾點(diǎn):

一是排版設(shè)計(jì)上。在移動(dòng)設(shè)備上使用小程序,由于屏幕受限,并沒(méi)有電腦界面那樣具有充裕的空間可發(fā)揮,這就要求UI設(shè)計(jì)師在對(duì)元素和文字排版的時(shí)候,考慮用戶瀏覽時(shí)眼睛的適應(yīng)能力,需要適當(dāng)放大,或者加大間距,讓整個(gè)頁(yè)面更加舒適。另外,微信原聲能夠提供的控件有限,比如Toast、提示 icon、開(kāi)關(guān)、多選框、復(fù)選框等等,其他空間可根據(jù)小程序風(fēng)格去開(kāi)發(fā),但注意千萬(wàn)不要出現(xiàn)刺眼或者突兀的按鈕和文字。

二是以簡(jiǎn)潔為主。在小程序開(kāi)發(fā)過(guò)程中,盡量避免選擇過(guò)于花哨或者繁雜的元素,看起整個(gè)頁(yè)面都是重點(diǎn),但又沒(méi)有突出重點(diǎn),使得用戶的注意力分散,同時(shí)也會(huì)增加用戶流量和載入時(shí)間,這當(dāng)然也會(huì)影響小程序交互的流暢。


4 (2).png


三是留心導(dǎo)航系統(tǒng)設(shè)計(jì)。小程序沒(méi)有導(dǎo)航指示器,給UI設(shè)計(jì)帶來(lái)一定的難度,UI設(shè)計(jì)師要做的是確保用戶的每一步符合預(yù)期,不能讓用戶在界面中“迷路”了。這里也建議頁(yè)面內(nèi)導(dǎo)航中頂部 Tab 樣式和底部標(biāo)簽樣式,每一種樣式在2個(gè)到5個(gè)之間。當(dāng)然,后期多測(cè)試也是非常有必要的。為了保證微信小程序界面顯示效果,盡量將設(shè)計(jì)原型稿放到真機(jī)進(jìn)行測(cè)試和評(píng)估。

四是站在用戶的角度開(kāi)發(fā)。很多微信小程序是基于網(wǎng)頁(yè)網(wǎng)站而打造,如果能夠統(tǒng)一風(fēng)格最好,保持一種熟悉感,給用戶一種“故人重逢”的感覺(jué)。在設(shè)計(jì)中,UI設(shè)計(jì)應(yīng)該明晰用戶當(dāng)前狀態(tài),減少用戶操作上的限制和等待時(shí)間,避免用戶因等待產(chǎn)生焦灼感。

在如今各種各樣的微信小程序橫行時(shí)代,一個(gè)好看的微信小程序UI界面,必定有利于用戶的拉新、留存和激活,以提高市場(chǎng)競(jìng)爭(zhēng)力。







合作咨詢

上海(總部)

上海市浦東新區(qū)郭守敬路498號(hào)22號(hào)樓
021-61057328
service@faceui.com

辦公地址地圖

北京

北京市東城區(qū)后永康17號(hào)A座
010-64015620
service@faceui.com

辦公地址地圖

成都

四川省成都市錦江區(qū)東大街牛王廟段100號(hào)
028-62790929
service@faceui.com

辦公地址地圖
首頁(yè) | 案例 | 服務(wù) | 關(guān)于 | face+ | 智見(jiàn)

Copyright ? 2009-2022 FaceUI design. All rights reserved


滬ICP備13044459號(hào)-5

上海辦公地點(diǎn)地圖
北京辦公地點(diǎn)地圖
深圳辦公地點(diǎn)地圖
在微信中搜索faceui
或保存二維碼在微信中打開(kāi)