好設計是如何提高轉化的？小米商城APP首頁設計分析

Sponsor

前言：對于自營APP商城設計，能增加用戶參與感、打造品牌感、并且提高轉化率應該是最重要的需求了。說起來簡單，那要如何實現呢？今天我們以「小米商城APP」的首頁設計為例，探討它是如何如何通過設計打造品牌感，增加用戶參與感，從而促進產品的銷售轉化。

產品定位

了解一款APP產品首先要了解它的產品定位，從小米商城的slogan“讓每個人都能享受科技的樂趣”不難看出小米的產品定位是性價比高的科技類產品。

另一方面，從商業模式來看，小米商城是B2C自營電商，與其他B2C自營電商平臺不同的是，小米主打高性價比，以好口碑深入大眾，撬動市場，以互聯網思維賣產品，把硬件產品當互聯網軟件產品賣。

由此可見，科技、高性價比是小米商城產品定位的兩大關鍵詞。

目標用戶

目標用戶是產品模式和功能制定的重要考慮因素，小米商城的目標用戶可以分為三類人群：

1、米粉用戶

這類用戶是小米的忠實粉絲，也或許是雷總的粉絲，他們認同小米文化，喜愛小米產品，熱衷購買和傳播小米產品，是小米商城最有價值的用戶群體。

2、科技發燒友

這類用戶本身就是科技愛好者，喜愛探索新鮮前沿的科技產品，熱衷購買科技類創新性的產品，對于深度發燒友還會專研參數配置，并會在論壇探討分享。

3、追求小資用戶

這類用戶追求品質，喜愛有設計感的產品，如果了解到小米有什么產品好看又好用，他們會為了保證品質和服務，選擇從官方購物平臺購買。

全品類商城與自營商城設計差異

雖然了解了小米商城的定位與目標用戶，但還需要從產品的商業模式上去推導設計，比如淘寶與小米商城的首頁設計大有不同，原因就是因為商業模式不同，致使產品的設計存在差異。

1、全品類與自營首頁設計區別

自營類商品其實是全品類商城的一個分支，全品類商城首頁衍生了很多獨立平臺，所以全品類商城首頁設計形式上更注重流量分發，而自營類是垂直領域，所以會更突出商品，并且創造商品賣點，打造爆款。

全品類電商產品因為品類眾多，用戶長時間使用會形成“逛”的習慣，從運營的角度，首頁運營板塊就會以千人千面的形式出現各類產品，所以首頁在設計上需要放置更多的產品，甚至要不停的變化產品，以覆蓋到用戶的需求點。

而自營類電商產品，因為品類較少，用戶很難逛起來，也是因為用戶使用自營類產品本身就是帶有目的性的，這樣用戶通常會是“找”的行為，所以首頁的功能上通常會推薦主題產品和打造爆款。

2、自營類商城設計上注重品牌

自營類商城運營的是品牌，能發展壯大的自營電商都成功塑造了品牌形象，所以在產品設計上突出品牌，會與用戶建立信任感，提高轉化，同時也能做到與其他電商的差異化設計。

下圖所示，小米商城、小米有品、網易嚴選三款產品，為了能快速與用戶建立品牌認知，導航欄都放了自家的logo。

另外，還可以從色調，板式，服務等等各個緯度突出品牌形象，總之在產品設計上要與品牌形象貼合，讓用戶處處能感知到品牌。

導航欄設計注重品牌

了解產品定位和目標用戶以及平臺的商業模式，對我們分析一個產品非常重要，這樣更容易從正確的方向理解產品的設計，下面我們帶著對產品定位和目標用戶的理解，開始對小米商城APP首頁設計的全面解析。

小米商城-首頁解析

B2C模式下的品牌電商，首頁設計需要做到可以讓任何一款產品成為爆品，也不會讓任何一款產品出現庫存滯銷。

小米商城首頁的設計與運營緊密聯系，有帶貨能力超強的模塊，如小米眾籌、小米秒殺，也有能快速推廣新品的模塊，如小米新品、新品發布，這些都是品牌電商重要的組成部分。

接下里我們從品牌DNA、布局體驗設計、金剛區設計、登錄前后設計、參與感設計等方面對小米商城首頁進行解析。

1、品牌DNA

當前小米公司有著非常強大的品牌勢能，給人們留下了性價比高、高端、簡約、科技、堅持的好印象，這些都可以看作是小米的品牌DNA，因此在設計小米商城APP時，設計需要貼合小米品牌DNA，讓用戶使用產品時能感受到小米的品牌力。

打開小米商城APP，處處能感受到小米的品牌元素，橘色的品牌色、小米的產品圖標等，都在傳遞著小米的符號，整體UI的設計秉承了小米硬件產品的一貫風格，如簡約的風格、高質感元素等，細節上體現品質。

2、布局體驗設計

用戶瀏覽電商產品首頁，第一屏流量最高，隨著往下走第二屏、第三屏…跳失率會越來越高，根據數據統計通常產品第三屏之后流量會大打折扣。

雙十一期間截圖

上圖的數據并不能代表所有產品的數據，好的設計形式可以影響數據的變化。

如何減少跳失率，要從用戶在當前位置的所思所想出發，做好第二屏到第三屏的功能制定和引導設計非常重要。

小米商城首屏最后的位置可以看到第二屏的內容標題，能夠起到引導性作用，并且放的是最有吸引力“小米秒殺”和“新品發布”雙十一期間增加了運營模塊，雖然這兩塊在第二屏，但看到的同樣是最有吸引力的雙11促銷信息。

引導用戶查看內容

另外在不增加運營板塊時會發現，小米商城重要板塊不會放到第三屏，在第二屏下面已經開始出現精選（猜你喜歡）閑逛區，因為是太多板塊用戶會感覺首頁很亂，不容易對各板塊功能形成認知，其次就是隨著跳失率的增加，重要板塊也會失去好的轉化效果。

打造沉浸式體驗

多數用戶在第三屏時會失去再向下探索的動力，這時系統通過算法給用戶推薦用戶喜歡的內容，會再次吸引到用戶，重塑用戶向下探索的好奇心。

用戶在“猜你喜歡”版塊心態是無目的的閑逛，當用戶不想再向下探索時，隨時可以側滑屏幕切換到其他品類，這樣也大大減少了用戶首頁閑逛的跳失率，營造出了一種沉浸式的交互體驗。

閑逛區（猜你喜歡）沉浸式體驗

同時因為用戶在此版塊是“逛”的心態，所以設計上采用瀑布流，也可以稱為Feed流，這樣的設計形式重點突出的是圖片，也就是商品本身，參數配置會弱化或不出現，因為用戶閑逛時是沒有目的的，當一個商品對他吸引后，用戶才會主動點擊查看詳情。

如果用戶是有目的搜索某個或某個品類商品時，此時列表流更為合適，因為用戶是有目的性的查找商品，他是認識這款或這類產品的，所以必定會開始關注產品的參數配置等，列表流的左右結構，能非常合理的呈現出參數配置等信息。

總結：當用戶無目的“逛”時會關注產品本身，所以這時需要重點突出產品圖，使用瀑布流更合適；當用戶有目的查找商品時，因為已對商品有一定的認識，所以不僅希望看到圖片，同時也希望能夠直觀看到產品的參數配置，這點對科技類產品的展示尤其重要。

3、金剛區設計

小米商城-金剛區

金剛區的圖標設計直接用產品來代替，真實的手機、電腦、筆記本等，這樣不僅能與眾多電商平臺的金剛區有差異化，更加能夠把入口功能表現的有識別性、直觀性，能夠使用產品模型作為圖標元素，這本身形成了一種優勢。

“觸碰想象，感受真實”金剛區的圖標設計符合小米的設計理念，設計師從圖標的設計營造出了貼合目標用戶認知的氛圍，讓用戶感受到了歸屬感。

金剛區圖標的布局設計與產品定位和用戶特征非常吻合，第一個圖標是“小米新品”，對于米粉來說，這應該是最關注的功能入口，關注新品的用戶也是最容易購買新品的人群，從產品的角度來講，新品也是需要大力推廣宣傳的，所以新品入口放置首位無可厚非。

第二個是“小米眾籌”，此功能入口對于追求性價比的用戶是最有吸引力的，因為眾籌價低于零售價，符合性價比屬性，此模式是先付錢再生產，解決了庫存、物流成本等。

第一排剩下的是三個手機圖標，其中位于中間位置的“至尊新品”是動效展示，也是因為要強調和推廣新款手機。

“小米秒殺”放在第二排第一個，是因為此模塊也非常重要，是一大流量入口，秒殺功能板塊是利用時間的緊迫感來刺激用戶轉化，走量能力極強，正因如此，在頁面的下方有專門的“小米秒殺”板塊。剩下的四個圖標是小米生態鏈中四個類別的產品入口，代表了大多數產品。

4、登錄前后設計

新人首次打開產品，促進第一單購買

小米商城新用戶第一次打開產品時，會直接彈出“新人專享福利”彈窗，點擊查看都是性價比極高，且生活中常用的物件，性價比高是為了促進與新用戶的第一筆交易，推薦常用物品是為了讓用戶在生活中看到用到這些常用物品時，可以想到物品的購買渠道，從而提高復購。

新人登錄前，首頁內容促進第一單購買

如果用戶不小心關閉了彈窗，沒關系在首頁最重要的位置也會看到“新人福利”板塊，如果享受新人福利，那在購買前一定要做的是要注冊登錄的，所以新人福利，不僅可以促成與新人的第一筆訂單，而且也有助于引導新人成為注冊用戶。

新人登錄后，繼續促進第一單購買

從下載小米商城到登錄后，會有三次提示有新人福利，上面介紹了前兩次，第三次是當登錄后會直接跳轉到“新人專享福利”，目的還是促成一單有性價比的交易，給用戶留下第一次好的購物體驗，最終變成有價值的用戶。

不包郵是用戶最大的痛點

據調查電商購物，用戶最大的痛點就是不包郵，同樣一件商品，99元包郵比90元+8元快遞費組合更容易讓人接受。

上圖小米商城的新人福利，都在強調包郵，消除用戶痛點，讓用戶的首次購物真正的感受到小米商品的性價比。

個人中心登錄前后有意思的設計

小米商城登錄前后在個人中心有個地方的設計非常有意思，看下圖未登錄前的5個圖標設計，相信身為設計師的你一眼就能看出“錢包”的圖標偏小，這是為什么呢？

登錄后才發現，較大的四個圖標都會換成數字，數字的大小正好與錢包圖標的大小視覺上一致，設計師似乎很淘氣。

登錄后數字與圖標大小視覺上一致

5、參與感設計

小米商城的商品具有低頻購買的屬性，如手機、家電等，好在商品的種類相對較多，小米也在不斷的研發新品，為了促活，小米商城在設計上有很多參與感的設計。

小米商城有“星球”板塊，可以理解為是一個基于產品討論為導向的社交平臺，這樣的功能就是讓用戶有參與感。

當對比華為商城和OPPO商城后，發現華為與OPPO只是把產品呈現出來，卻很少有讓用戶有參與感的設計，而小米商城處處都在打造參與感設計，如游戲化設計、互動平臺等等，當然這些功能的設計與小米主打性價比和粉絲屬性的用戶有關。

在小米商城的首頁用戶可以打開紅包雨游戲功能、答題領紅包功能、智取盲盒機功能等，這些雖然都是營銷策略，但因為趣味性、游戲化的設計也大大提高了用戶參與感，從而增加了銷售機會。

最后

對于負責流量分發的首頁，不僅要引導用戶瀏覽和購買商品，給用戶創造優秀的產品體驗，首頁也是體現公司品牌形象的關鍵點位，品牌形象能夠讓用戶了解你、信任你、感受到價值，從而促成購買轉化，這些都可以用設計助力表現。

以上講的是UI設計前的探索工作，也是非常有必要的工作，產品設計者只有真正了解了產品的底層架構，才能精準的把控設計，在各方面掌握好平衡。

作者 | 吳星辰
來源 | 互聯網設計幫 （ID | Internet-Design-Gang）

贊助商鏈接

喜歡這篇文章嗎？歡迎分享到你的微博、QQ群，并關注我們的微博，謝謝支持。
版權：除非注明，本站文章均為原創文章，轉載請聯系我們授權，否則禁止轉載。