国产富婆激情视频一区二区三区-国产三级一区二区三区网站-成人免费一区二区三区视频网站-AV天堂精品久久久久暴力

首頁(yè) > 微商城 > 開發(fā)動(dòng)態(tài)

• 以蘑菇街和小紅書為例分析小程序商城的UI頁(yè)面

  作者:廣力云微信閱讀: 時(shí)間:2020-01-07 00:03:26
  近兩年來(lái)，越來(lái)越多的商家投身于小程序戰(zhàn)列中，騰訊也對(duì)小程序的發(fā)展給予了極大地幫助，小程序在電商中更是綻放出了耀目的光彩。隨著許多知名電商企業(yè)都逐步加入到小程序的戰(zhàn)隊(duì)，不少成熟運(yùn)營(yíng)的商家開始對(duì)小程序的UI進(jìn)行重點(diǎn)打造。那么我們以蘑菇街小程序、小紅書這兩個(gè)電商小程序商城來(lái)分析一款商城小程序的UI頁(yè)面的設(shè)計(jì)。
  
  

  　　蘑菇街App和小程序的界面對(duì)比非常典型。如圖：

  

  　　蘑菇街小程序界面的第一印象就是間接、扁平，而且去掉了APP首屏的banner，換成了主題色背景。實(shí)物icon到小程序中都變成了簡(jiǎn)約的線性圖標(biāo)并配上了加大后的字體。接下來(lái)的一欄使用了實(shí)物圖片，但整體增加灰度，頁(yè)面的統(tǒng)一性加強(qiáng)。
  
  　　其次，比App少了水平滾動(dòng)列表，直接在一級(jí)頁(yè)面顯示商品信息，使用用戶的一句話短評(píng)來(lái)代替直播、專題推薦。
  
  　　這樣整體看上去界面顯得更輕量，符合小程序的設(shè)計(jì)需求。
  
  　　再來(lái)看下小紅書的小程序端的界面：

  

  　　一級(jí)頁(yè)面沒有任何引導(dǎo)和功能分區(qū)，只能看商品和搜商品。不得不說(shuō)，在眾多使用橫線劃分欄的小程序中，使用卡片式豎排列的小紅書非常吸引人。二級(jí)頁(yè)面就有點(diǎn)像淘寶的詳情頁(yè)，這種極簡(jiǎn)風(fēng)是很受大家歡迎的。
  
  　　所以，總結(jié)上面小程序商城ui頁(yè)面實(shí)例分析，小程序在ui設(shè)計(jì)上要注意以下幾點(diǎn)?
  
  　　1、 輕設(shè)計(jì)
  
  　　總的來(lái)說(shuō)，小程序相較于App都化繁為簡(jiǎn)，突出主要功能。還可以將并聯(lián)功能改為串聯(lián)/觸發(fā)功能來(lái)實(shí)現(xiàn)頁(yè)面的簡(jiǎn)化。
  
  　　2、 注意統(tǒng)一性
  
  　　小程序的色彩、圖標(biāo)、風(fēng)格應(yīng)和App內(nèi)一致，但是要考慮目標(biāo)受眾的不同做適量更改。減少banner、實(shí)物圖標(biāo)的使用，要實(shí)現(xiàn)頁(yè)面簡(jiǎn)化和色彩統(tǒng)一。
  
  　　3、 是否應(yīng)當(dāng)使用水平滾動(dòng)列表
  
  　　目前大多數(shù)小程序都不采用這樣的做法，但也有像豆瓣評(píng)分這樣的小程序在使用。水平滾動(dòng)列表和垂直滾動(dòng)列表在小程序中是二選一關(guān)系，一個(gè)若為可以無(wú)限拉動(dòng)，另一個(gè)應(yīng)為有限。
  
  　　4、 注意加載動(dòng)效
  
  　　小程序內(nèi)容的輕量也有一個(gè)重要原因：減少打開時(shí)間，用戶對(duì)于小程序的等待時(shí)間要比App少很多。此時(shí)加載動(dòng)效就能夠作為一個(gè)留住用戶的加分項(xiàng)。
  
  　　5、 導(dǎo)航欄樣式
  
  　　小程序的底部導(dǎo)航欄較為死板，配置空間為2-5個(gè)，且圖標(biāo)和文字空間規(guī)定嚴(yán)格?？梢远嗍褂庙敳繉?dǎo)航欄和懸浮導(dǎo)航按鈕。比如頭腦王者就通過(guò)「知乎狗」作為懸浮按鈕導(dǎo)流用戶到知乎熱榜小程序。
  
  　　廣力云多用戶商城系統(tǒng)本著以小程序賦能傳統(tǒng)行業(yè)，讓產(chǎn)業(yè)擁有科技的靈魂的使命，打造特色的社區(qū)拼團(tuán)系統(tǒng)，結(jié)合微分銷與社交電商玩法，利用大數(shù)據(jù)分析為社區(qū)團(tuán)購(gòu)運(yùn)營(yíng)賦能。廣力云，一個(gè)智慧的商業(yè)新零售電商生態(tài)系統(tǒng)。