03 電商年貨節主題標語簡短(電商APP首頁設計，終于有人講明白了！)

、焦點廣告、導航等版塊。

頁頭首先要體現網站主題。用企業名稱、標語、徽號或圖像概括地反映企業形象、經營理念和服務定位。搜索、導航提供了對關鍵頁面的瀏覽鏈接，通過圖標和文字表明產品其他頁面載有的主要信息；用戶能夠在最短時間、最便捷的操作迅速地到達他們所需信息的其他頁面中。

l 頁中： 包括公告、最新活動、個性化產品推薦、友情鏈接等版塊。

在首頁上公告信息，到達率非常高。同時，產品中在進行的各種活動信息，也是吸引用戶停留并購買的重要手段。隨著互聯網產品設逐步創新，數字化，原來千人一面的首頁分類產品列表由簡單羅列，變成了根據用戶喜好和行為習慣進行個性化的商品推薦，產品變得更了解用戶也更能觸發用戶購買行業發生了。

l 頁尾： 包括版權、聯絡方式、計數器等版塊。

版權的常見做法是在首頁底部標示簡短的聲明，再用鏈接附帶一個有詳細使用條款的說明頁面，既避免首頁的雜亂又把重要內容說清楚了。頁面底部的聯系方式，方便用戶與產品相關人員取得聯系，讓產品所屬企業獲得用戶反饋。

頁尾的內容在web端界面設計中是不可缺少的區域，但在移動端首頁基本都被移到了”設置”中進行展示，這是由于移動端界面空間實在太少，而且移動端多以手式向上不斷滑動查看新內容，造成頁尾信息如果放在頁面尾端查看十分不方便。

首頁設計組件介紹

一、搜索欄

大多數用戶發生購買行為有明確的目的性。我知道我想要買什么，所以我需要快速的搜到商品。因此App把最顯眼的位置留給搜索欄。

一個完整的搜索組件設計應該由三個階段組成：

1.找到搜索框

2.錄入關鍵詞

3.搜索結果展示

搜索框的設計需要注意：

電商App的搜索框通常放在界面的最上面，明顯、惹眼，用戶可以直接進入信息錄入階段。

電商App的首頁搜索框，即使用戶需要查找的內容屬于不同類別，在設計上也最好給用戶最簡單的全站內容搜索組件。

搜索框的設計風格應該和整體產品風格保持一致

信息錄入的設計需要注意：

提供多種信息錄入方式，最常見的文字錄入當然還是主流，除此之外最好可以提供語音、圖片錄入搜索等方式。

除了多樣錄入方式，還應配套提供信息錄入提醒設計，如：用戶歷史搜索記錄、搜索關鍵詞熱榜、錄入關鍵詞時聯想響應

搜索結果的設計需要注意：

搜索結果設計重點在于展示不同類型和級別的內容。例如在淘寶搜索賬單，結果包括賬單相關信息，店鋪和資訊等，不同獨立應用加圖標展示。不同內容類別以tab切換的形式展示。

搜索結果過多，可以加檢索組件幫助用戶在搜索結果中進行二次查找，減少花時間翻頁或滑動查詢。另外搜索結果為零的時的空頁面，給用戶設計合適的說明界面。

二、導航

電商App中，必不可少的兩個導航：

l產品主導航

l商品分類導航

產品主導航

電商App中的主導航設計為用戶提供了跳轉相對獨立的信息內容的路徑。例如：

淘寶的主導航項：淘首頁、逛逛、消息、購物車、我的淘寶

京東的主導航項：首頁、分類、發現、購物車、我的

發現、消息、購物車、我的這些內容之間沒有很強的關聯，但又是用戶在電商平臺購物過程中必不可少要查看的信息。

京東、淘寶主導航

同時，從“商品買賣”的業務角度來看，有幾個重要的業務信息，無論做任何電商產品，都應該讓用戶可以快速、方便的查找到是毋庸置疑的。它們是：

1.用戶的購物車---購物車模塊

2.用戶在產品的中的個人信息---我的模塊

3.用戶買賣過程中的交流信息---消息模塊

這些重要的業務信息，多數都放在了電商App的主導航中，即使沒有放在主導航，也一定能夠在首頁的副導航中看到。

商品分類導航

不同類型的電商平臺，商品分類導航有一些區別。

如下圖中淘寶、京東平臺，這兩個平臺是成熟的綜合電商平臺，在平臺中不但有各類第三方商品銷售，而且平臺也有自營的品牌和獨立應用在平臺內銷售，如淘寶的天貓商城、餓了么、天貓超市；京東的京東超市、就東到家等。

因此，商品分類導航中的商品分類覆蓋十分廣泛，尤其商品分類導航的C位往往加入了平臺自營的品牌和應用。

垂直類的電商App，商品分類導航中的內容覆蓋面窄很多，以商品類型分類引導用戶查找商品的特點更明顯示。

例如下圖中唯品會的商品分類導航，因為唯品會的產品定位在折扣女士用品，所以導航中的分類都集中在服裝、鞋帽、箱包等商品類別。

另外，在設計上不像主導航設計需要控制導航項數量，商品分類導航中的分類項數量往往大于5個，因此使用雙排、可左右滑動的拖拽導航幾乎成為最常見的商品分類導航樣式。

三、活動

電商產品中的活動類型很多，最常見的有16種：

1. 打折

2. 秒殺

3. 免單

4. 滿減

5. 滿送

6. 滿返

7. 買送/捆綁

8. 搭售

9. 包郵

10. 好評曬圖

11. 試用

12. 抽獎

13. 積分/會員

14. 團購

15. 預售

16. 眾籌

在電商App首頁，見到最多的是前兩種活動：打折、秒殺。而且，首頁的活動往往都帶有極強的時效性表示，例如在規定的時間才可以享受更加優惠的商品價格。

因此，活動在首頁上的設計要向用戶傳達三個要素，即用戶最關心的：

什么時間有活動

有什么活動商品

活動的價格有多優惠。

如下圖的“京東秒殺”的設計就非常完整的呈現了這3個要素。當然，并不是所有的活動表達都一定要遵循這一規律，淘搶購的設計就打破了3要素傳達的規則，隱去了商品促銷價格。

京東秒殺與淘搶購

四、商品推薦

個性化的商品推薦現在在電商App設計中己經十分成熟，推存商業最先被用戶接觸到的地方就是首頁。

用戶在電商App或有意、或無意瀏覽的商品，都會被產品記錄下來。再由商品推薦模塊根據你最近的瀏覽記錄，推薦一些相關的商品、分享或者店鋪。由于每個人關注的商品都不一樣。所以產品對于每個人呈現的界面內容也都是不一樣的。

例如下圖，淘寶通過性別判斷，如果產品發現你是男性用戶，默認推薦“男神范”；如果判斷你是女性用戶，則默認推薦“愛逛街”。

淘寶內容推薦

不僅僅如此，用來展示電商平臺每個細分商品品類推薦商品的區域，也都引入了個性化商品推薦的設計。

在使用全品類商品展示+優惠價格來打動用戶進行消費的同時，現在的電商App往往會再融合情感因素、參考用戶的特點、喜好展示各品類中最可能吸引用戶的商品，促使用戶在產品中“逛街、購物”。

例如京東精選中集合了全品類的商品推薦，以用戶行為進行時實的個性化推薦。

案例：主流電商App首頁分析

一、淘寶

首頁內容：

1.搜索，淘寶把搜索二級頁面關鍵詞直接展示在一級搜索位置下方，相當于關鍵詞搜索功能層級上升；

2.banner；

3.8個平臺型導航，主要是從淘寶誕生，已經可以獨立運營的產品；

4.活動廣告位，占據banner大小的位置，平臺活動快捷入口；

5.淘寶頭條，根據分類滾動推薦產品的文章；

6.二級購物功能區，展示各個頻道，如天天特賣，每日好店。

7.商品列表，安卓和蘋果展示不一樣。安卓每個版塊半屏往下鋪開。蘋果是上方做了分類導航，下方列表。

二、京東

首頁內容：

1.搜索；

2.8個banner；

3.活動廣告位；

4.平臺型功能區，有部分是獨立的應用如京東生鮮，還有部分是京東的商品類別頻道；

5.京東快報；

6.二級購物頻道，放了些主推的購物板塊；

7.活動板塊，鋪開了活動的每個類別；

8.頻道推薦，把頻道納入到10個標簽里，每個頻道都有超過5個二級標簽。

三、蘇寧

很赞哦!（357）