天貓APP首頁 史上最大改版的設(shè)計揭秘來啦


↓戳視頻,快速了解天貓APP有哪些新設(shè)計

前言

尼爾森中國區(qū)總經(jīng)理韋邵曾在在尼爾森消費者研究報告中說到:隨著消費者收入遞增,他們越來越希望買到另他們感到愉悅的有品質(zhì)的商品。

消費升級是今年各大電商平臺都在熱議的的話題,在這個大背景下,作為電商領(lǐng)頭軍的天貓,一直不斷挖掘與迎合消費者的訴求優(yōu)化產(chǎn)品形態(tài),來更好的契合優(yōu)質(zhì)用戶對更好生活追求的意愿。

天貓APP的本次升級就是符合這個大背景下的產(chǎn)品體驗改造的一個開端

人群消費特征


在改版伊始,我們對目標(biāo)人群重新進行了定義。天貓APP要更多的服務(wù)于品質(zhì)用戶,追求品牌的年輕消費群體。

通過這些用戶的一系列購買數(shù)據(jù)的研究發(fā)現(xiàn),他們更喜歡購買B類商品,更注重購買效率,瀏覽更少的商品就可以進行決策購買。

因此,商品的展示形態(tài)上就對設(shè)計師提出了更高的要求:一方面通過各種個性化等手段,讓用戶更快的定位到自己喜歡的商品;另一方面,通過形式的設(shè)計,要幫助天貓商家凸顯售賣商品的商品力,讓目標(biāo)用戶可以快速get最關(guān)鍵的商品信息來判斷是否需要購買。

天貓品牌


5月23日天貓品牌升級發(fā)布會盛大召開,天貓slogan正式更名:理想生活上天貓。天貓希望從一個賣貨平臺的形象逐漸升級成為理解方式的倡導(dǎo)者形象。升級后的天貓和目標(biāo)人群的消費形象特征所匹配,整體的品牌形象定位更國際化,年輕化,品質(zhì)化。

這對設(shè)計師要求也就成為:天貓APP的產(chǎn)品設(shè)計表達是天貓品牌和消費者的一個核心溝通媒介,我們要讓用戶在端上的內(nèi)容消費、購買行為能夠感知天貓帶來的品牌新主張。

電商平臺的品質(zhì)障礙

天貓是一個B2C的電商平臺,跟自營電商內(nèi)容產(chǎn)出和控制上有巨大的差異點。即內(nèi)容的產(chǎn)出根源在商家手中,展示給用戶的商品的信息如商品圖等在之前很長一段時間內(nèi)都是由商家提供平臺,平臺進行具體展示。商家的設(shè)計師水平似乎基本決定了商品展示的最終設(shè)計質(zhì)量。

天貓平臺的設(shè)計師也逐漸意識到商品內(nèi)容本身的設(shè)計的重要性(比如商品圖),如果沒有質(zhì)量強控,對平臺的整體設(shè)計品質(zhì)傷害巨大。我們要提升設(shè)計品質(zhì),僅僅依賴產(chǎn)品框架設(shè)計,是不可能實現(xiàn)的。正視并良好解決商品內(nèi)容質(zhì)量的障礙,是這次的改版的一個巨大挑戰(zhàn)。各品牌質(zhì)量要拉到一致水平,并且也不能喪失各品牌的特征是必須堅持的內(nèi)容處理原則。

以上部分都是改版的背景和現(xiàn)實狀況,我們在本次貓客首頁上分別制定了對應(yīng)的設(shè)計策略。


容器升級

我們認為商品是任何購物性平臺與品牌與消費者之間最原始的鏈接。同時我們也希望能用最簡單的方式來降低用戶認知成本,不再是一層一層的進入入口,而是能直接觸達商品,通過凸顯商品本身優(yōu)勢屬性,來達到效率購物的目的。

所以在容器升級上主要做了兩件事情:框架扁平化與商品坑位升級。


· 框架扁平化

新天貓APP從一級導(dǎo)航開始,每一個tab都聚焦一件事,用戶認知更清晰。

為了加強商品表現(xiàn)力,在容器的信息表達上相較于老版也更加扁平,從復(fù)雜錯落的入口變?yōu)榱丝游坏慕M合,結(jié)構(gòu)極為簡單。利用大數(shù)據(jù)推薦精選商品,讓用戶與商品直接觸達。



· 商品坑升級

在簡單易懂的頁面框架下,我們重新思考了商品展現(xiàn)以及組合方式。

我們在商品容器上構(gòu)建明確的分區(qū),制定出穩(wěn)定的結(jié)構(gòu),便于理解和記憶,達到能不斷的透傳商品價值的目的。同時也對商品容器做橫向擴展,去滿足不同業(yè)務(wù)及場景的需求。


Tmall BRAND強化

大家一起來猜猜哪個是天貓?

(從左到右依次為:大眾點評、淘寶、天貓、京東)

在電商APP界面越來越趨同,以及天貓品牌升級的大背景下。

此次貓客首頁改版以“Tmall”為載體一直貫穿,從用戶打開APP開始不斷強調(diào)Tmall,同時把Tmall提升到首頁的核心區(qū)域并賦予更多情感化及商業(yè)化的功能,讓用戶從第一感官以及認知上知道這是天貓。

· 打開天貓APP,從閃屏到首頁


· Doodle的運用


↓能支持熱點事件營銷,并結(jié)合搜索關(guān)鍵詞產(chǎn)生商業(yè)價值,成為品牌活動的一個新流量陣地

↓支持多種格式文件

內(nèi)容化設(shè)計

為了保證整個天貓平臺最終呈現(xiàn)給用戶的品質(zhì),不能僅依賴于產(chǎn)品設(shè)計,更應(yīng)該對內(nèi)容做優(yōu)化設(shè)計。

以針對商品圖優(yōu)化為例,我們做了兩件事情:商品圖排版建議與商品打底圖強控&白名單。

· 商品圖排版建議


· 商品打底圖強控&白名單

為了避免首頁出現(xiàn)下圖左側(cè)情況出現(xiàn),我們制定了平臺商品圖規(guī)范輸入給商家,強控產(chǎn)出:首頁所有的商品都保證有一張白底圖作為打底素材。同時為了保證優(yōu)質(zhì)商家品牌調(diào)性及平臺豐富度,我們特地組織成了設(shè)計師審核小分隊,大家一起來人工篩選出那些商品圖有自己調(diào)性,品質(zhì)高的商家,為他們開通綠色通道,允許不使用白底圖,使用帶有品牌特色的商品主圖。

這樣就不僅保障了平臺商品內(nèi)容的整體品質(zhì),也讓品質(zhì)商家保留了自己的品牌調(diào)性。

↓實施商品打底圖強控&白名單后首頁圖片質(zhì)量提升效果

細節(jié)打磨

在設(shè)計過程中,我們也挖掘了很多體驗上的小創(chuàng)新,希望能帶給用戶更有品質(zhì)的小驚喜的體驗感受。下面舉兩個例子分享。

· 首焦banner視差

在新banner模板基礎(chǔ)上衍生出分層產(chǎn)出即可實現(xiàn)視差及重力感應(yīng)效果,讓整個產(chǎn)品更生動富有細節(jié)。

· 新人引導(dǎo)

由于此次改版最大亮點在于商品力的表現(xiàn)上,所以在新人引導(dǎo)這塊我們用了輕互動的形式,讓用戶可以通過小游戲的方式,通過滑動信息模塊來感受商品坑每個區(qū)塊的含義。

原文鏈接

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 分析目的: 了解國內(nèi)各大網(wǎng)購平臺的市場發(fā)展概況和發(fā)展趨勢,了解競爭對手產(chǎn)品的優(yōu)缺點,把握需求的功能點和界面結(jié)構(gòu),不...
    EC餃子閱讀 18,797評論 0 15
  • 寫給七夕,寫給你——中國的情人節(jié) 丁香 2017.08.26 虹飛,鵲起 踏云,我走進你 …… 仰望,九霄青煙縷縷...
    閃閃的星光閱讀 187評論 0 1
  • 導(dǎo)語: 2016年5月13日,非泊化妝品連鎖加盟推介會在成都峨影電影公園正式召開!會議邀請了行內(nèi)資深人士,以及來自...
    非泊fable閱讀 1,033評論 0 1
  • 發(fā)現(xiàn)要老老實實的生活,享受生活真不容易。正如有一句話“努力過上平凡的生活”。 什么是平凡生活?我的理解: 一、睡得...
    c577eea5ec5b閱讀 523評論 2 2

友情鏈接更多精彩內(nèi)容