本文是最近在做競品分析，在分析競品的首頁時蝴乔，整理的一些有關首頁的想法记餐。想看別人家的首頁都是什么樣子的就快快來看吧！
基本上每個應用都有首頁薇正，內容的多少和平臺的大小影響著首頁所呈現(xiàn)的內容片酝，大到電商類重內容運營的app如淘寶，其首頁非常復雜挖腰；小到工具類重簡易操作的app如印象筆記雕沿，其首頁非常簡潔。然而優(yōu)秀的首頁都有共同的特點猴仑，我總結為三點审轮，為了方便后面的分析，我把這三點叫做“首頁三準則”宁脊，這篇文章主要通過扒一扒這些特點來分享如何設計一款優(yōu)秀的首頁/讀懂各類首頁断国。
根據(jù)幾種用戶使用場景來分析贤姆，先來看看首頁應該怎么設計榆苞！我總結為以下三點。
一霞捡、首頁三準則
首頁的主要作用是要在最短的時間內讓用戶對內容產生興趣坐漏。
“首頁三準則”
1、對首次使用產品的用戶而言，首頁的好壞關系到用戶對該產品的第一印象赊琳，用戶第一眼看到的是界面街夭，其次是內容。所以躏筏，在這個階段板丽，符合品牌的好的設計感和內容的豐富度會給用戶的印象加分。
2趁尼、繼而一直吸引用戶使用的就是產品到底能為他解決什么問題埃碱，這就和產品所具有的功能/所提供的服務相關，只有當用戶能用該產品切實解決問題并且用起來爽了酥泞，那他才會一直用砚殿。所以，在這個階段芝囤，對首頁而言似炎，核心功能的展示和好的交互體驗顯的尤為重要。
3悯姊、對于深度使用用戶而言羡藐，首頁是信息的集合，用戶希望只要打開首頁就能知曉最近的活動和通知悯许，并且能看到好的內容推薦传睹。所以，內容的推薦和即時更新會讓用戶感到滿足岸晦。
不管是定位為內容型還是導流型應用欧啤，首頁能做到以上三點都會給用戶帶來好的體驗。當然不管在哪個階段启上，當內容達到一個量級的時候邢隧，搜索和導航都可以方便用戶到達想要去的頁面。
二冈在、舉例分析：淘寶
就譬如淘寶倒慧，它是綜合型電子商務平臺，打開淘寶app包券，雖然打開看到的琳瑯滿目的內容和各類入口纫谅，但是不管哪個階段的用戶都能很快的找到自己想要的商品，并且在整個購買過程中都享受到了樂趣（除了最后的支付）溅固，以淘寶為例付秕，簡單舉幾個小例子。
淘寶的首頁內容非常豐富侍郭，除了基礎功能的展示和各種主題板塊询吴，還有大量內容的推薦和更新掠河。
1、當用戶首次到淘寶時猛计，首頁內容的豐富和紅色活潑的設計風格會讓用戶產生熱鬧的印象唠摹，同時，各種主題模塊奉瘤，如淘搶購勾拉、超實惠、天貓必逛盗温、特色好貨望艺、熱門市場等，足夠滿足用戶首次探索的需求肌访。
2找默、當用戶首次探索結束時，淘寶首頁的核心功能展示吼驶，如天貓惩激、聚劃算、天貓國際蟹演、外賣风钻、天貓超市、充值中心酒请、阿里旅行骡技、領金幣、到家等羞反，可以方便用戶快速了解到淘寶的基礎功能/服務布朦，當然配合良好的交互體驗，用戶很快就能適應首頁并熟練的使用昼窗！
3是趴、當深度用戶進入淘寶時，淘寶的內容推薦和更新做的很贊澄惊，結合以前瀏覽過的內容和購買記錄唆途，淘寶的首頁給出了大量的推薦，首頁中主題模塊的展示圖都是根據(jù)該用戶的以往記錄按一定的時間段輪流替換的掸驱，頂部的廣告輪播圖和搜索框提示語也是根據(jù)用戶的喜好而顯示的肛搬，并且最底部的猜你喜歡都做到了內容的即時更新推薦，這不僅讓首頁更人性化毕贼，并且讓用戶感受到了逛頁面購物的滿足温赔。
所以根據(jù)以上三點來思考首頁的設計是很有參考價值的。改版后的簡書也大致符合以上三點哦帅刀，是不是比以前更好懂了让腹？
三、實戰(zhàn)
好吧扣溺，接下來開始實戰(zhàn)了：
分析對象：千丁
千丁簡介：千丁是一款社區(qū)生活服務類app骇窍，旨在做一站式社區(qū)服務平臺。主要功能包括：基礎服務锥余，如：管家電話腹纳、報事報修、物業(yè)賬單驱犹、訪客通行嘲恍、樂購等；生活服務雄驹，如：千丁洗衣佃牛、上門養(yǎng)車、千丁旅游等医舆；以及鄰里社交》溃現(xiàn)覆蓋大約19個城市，237個小區(qū)（根據(jù)app上布局小區(qū)統(tǒng)計）
千丁的首頁整體給人的視覺效果不錯蔬将，頁面內容較豐富爷速，核心功能也體現(xiàn)了出來，并包含了各種內容的推薦霞怀，整體是做到的“首頁三準則”惫东。
（首頁效果圖-1+2+3為完整首頁效果圖，其中分析文字序號對應著圖中內容分解區(qū)域的序號）
>>>>首頁效果圖-1（包含?廉沮、?、?徐矩、?废封、?個分析點）
?千丁頂部布局了搜索框和全局消息中心
1、搜索框可方便用戶快速獲取到所需要的商品或服務丧蘸，點擊搜索框后彈出搜索頁面漂洋，顯示如下：
【分析】：用戶可能需要多次瀏覽某商品或使用同一服務，所以有歷史搜索記錄能方便用戶記憶并搜索力喷。
【優(yōu)化】：該類應用所提供的商品/服務都比較小眾刽漂，用戶在使用時，可能不知道該怎么搜索弟孟，搜索框應有推薦搜索項贝咙。
【再說】：
搜索頁面一般有四種展現(xiàn)方式：
1）只有搜索框；
2）只顯示歷史搜索記錄拂募；
3）只顯示推薦搜索項庭猩；
4）歷史搜索記錄+推薦搜索項窟她。
而這四種方式都適用不同的情況：
第一種和第二種適用于明確搜索，即知道自己要搜索什么蔼水，如淘寶首頁的搜索震糖，點開就知道要搜索的是商品，所以淘寶首頁采用的是第二種方式趴腋；
第三種和第四種適用于不明確搜索吊说，即其實并不明確自己要怎么搜索的，如淘寶微淘/社區(qū)頁面的搜索优炬，這兩個板塊是淘寶打造出的社區(qū)交流板塊颁井，動態(tài)豐富多樣，用戶并不知道要如何搜索蠢护，淘寶微淘采用的是第三種方式雅宾，淘寶社區(qū)采用的是第四種方式。
當然是否需要呈現(xiàn)歷史搜索記錄和搜索內容有關葵硕，如果內容屬于只需要搜索一次屬性那就不用歷史搜索記錄啦秀又，頁面也能更簡潔大方。
2、消息放到右上角一級入口處有助于快速獲取到新消息狀態(tài)
【分析】：千丁在其四個切換卡頁的右上角都布局有消息中心，這可方便用戶快速獲取新消息
【優(yōu)化】：可考慮消息全局化丧肴，在所有的頁面都布局消息中心入口（但得根據(jù)實際情況，如果千丁內用戶不咋溝通昏苏，消息產生較少則指在四個切換卡頁布局消息中心就ok了）
【再說】：應用里一般都有消息提示，但消息入口有深有淺威沫。有些消息中心放在比較重要的位置贤惯，如頂部左上角或右上角，而有些則比較隱蔽棒掠，如個人中心處的某個夾層里孵构。這和應用的定位有關，如果重社交屬性烟很，app內重要的消息（評論點贊之類的）產生較頻繁颈墅，那消息中心得放在重要的位置，因為這樣可以讓用戶之間可以更好的溝通雾袱，方便直接讀取又能即時獲得新消息恤筛；
消息的全局化適合社交消息（評論點贊之類的）產生頻繁的情況，指在應用內的每個頁面都有消息入口芹橡，一般放在頂部左上角或右上角毒坛，消息全局化有助于用戶在使用app的整個過程中都能獲取到新消息狀態(tài)，拉近用戶之間的距離，更積極地溝通煎殷。
?常用基礎功能顯示
【分析】：顯示常用功能屯伞，包含了門禁鑰匙、管家電話豪直、我的積分劣摇、生活繳費。
1）“門禁鑰匙”是業(yè)主每次進出都需要使用到的顶伞，放在第一個位置能方便用戶快速開門饵撑；
2）“管家電話”處第二剑梳，希望實現(xiàn)咨詢到服務的快速響應唆貌，旨在能給業(yè)主提供專屬貼心服務；
3）“我的積分”處第三垢乙，積分的作用是為了提升用戶活躍度并增強用戶黏性锨咙，通過積分獎勵引導已
注冊用戶邀請用戶獲得積分、綁定房間并在應用內活躍追逮；
4）“生活繳費”嘛酪刀，引導業(yè)主主動積極繳費唄哈哈。
【優(yōu)化】：
1钮孵、圖標再設計骂倘，盡量突出些。現(xiàn)常用功能圖標色彩不太突出明顯巴席，和上板塊同為橘色历涝，區(qū)分度不高。
2漾唉、積分規(guī)則頁面可以重新設計下荧库，將積分規(guī)則放到二級頁面內，并加入任務狀態(tài)赵刑，標識出已完成的積分任務和未完成的積分任務分衫，并添加未完成的積分任務入口，這樣既可以引導用戶完成積分任務還能提醒用戶每日的任務完成度般此，從而提高用戶活躍度蚪战。
【再說】：在首頁顯示的功能必然有它的作用，除了常用之外還有希望引導用戶操作的作用铐懊，可以認真關注下屎勘，自身的應用最能幫助用戶解決的問題以及用戶最常用的功能，適當?shù)目梢詫⑾胍龑в脩舻墓δ軘[放在首頁居扒。
?圖文公告板+?文字公告板
【分析】：公告的展示方式很特別概漱，將圖文活動和文字通知分開，圖文活動公告以溢出方式填充整個屏幕喜喂，嵌套文字通知公告瓤摧，頁面更富有動態(tài)竿裂，重要的活動/通知可以即時傳達給用戶。
【優(yōu)化】：將未失效的圖文活動可滑動顯示≌彰郑現(xiàn)只能看到最近發(fā)出的圖文活動腻异，以前發(fā)出的但未失效的活動須點擊“更多”進入列表頁才能看到。
【再說】：一般應用都是采用頂部banner輪播圖的形式來展示最新的活動信息/廣告这揣，千丁采用了不一樣的方式來展示活動悔常，將活動面板與自身的文字通告設計在一起，傳遞出一種整體感给赞，相比banner更好讓用戶接受机打。
?運營板塊（熱門推薦）
【分析】：千丁在該板塊主要是進行：商品組合推薦、單個商品推薦片迅、千丁旅游推薦残邀、活動宣傳等。通過內容的推薦/活動的宣傳來引導用戶進行購買商品/參與活動柑蛇。
【優(yōu)化】：該板塊不管是組合推薦還是單品推薦都采用這種單卡片展示方式芥挣，內容比較分散，用戶所獲取的信息完全來自于千丁運營團隊整理的推薦耻台，且推薦的內容之間缺少關聯(lián)（每次瀏覽內容會比較累）空免。
建議對可以規(guī)范歸類的內容進行歸類，如千丁閃電購（快遞送貨上門）和千丁小賣部（物業(yè)自提）這兩個商品組合推薦可以設定為主題板塊盆耽。其余無法規(guī)范歸類的商品組合推薦可以參考組合運營板塊的設計方式蹋砚，顯示出組合商品的特色≌髯郑活動宣傳之類的可以分散點沒關系都弹，畢竟活動本身的特點就是靈活；
【再說】：用戶喜歡歸類匙姜，事物進行歸類后可以既能方便人記憶畅厢，又能讓內容更精煉統(tǒng)一。對于可以規(guī)范歸類的并且重要的內容最好做好固定分類氮昧，這樣可以讓用戶在第一時間能找到內容并進行消費/享受服務框杜。（這其實就是類似千丁做的主題運營板塊）合理運用布局可以讓內容看起來更清楚，方便用戶更快理解app袖肥。
>>>>首頁效果圖-2（包含?咪辱、?個分析點）
?組合運營板塊（對同類型的商品進行組合推薦）
【分析】：千丁在該板塊主要是進行商品組合推薦，和運營板塊里商品組合推薦是同一類型椎组，不過在布局設計上比運營板塊的更合理油狂，采用了組合布局。
【再說】：組合商品推薦可以采用組合布局的方式，先顯示部分商品专筷，再通過鏈接方式引導用戶獲取更多商品弱贼，這種漸進呈現(xiàn)式組合布局能讓用戶對這個組合內容有個大致的概念（什么類型商品的組合等），且當用戶對該組合商品感興趣時可以查看更多內容磷蛹，滿足用戶的參與感吮旅。
?主題運營板塊（對同類型的商品/服務進行分類推薦）
【分析】：千丁在該板塊主要是進行主題組合推薦，通過對內容進行分類味咳，來推薦給用戶庇勃。
【再說】：設定主題板塊的目的是在于能讓用戶專注地挑選商品/接受服務，淘寶首頁就基本滿滿地都是各種分類主題板塊
綜述：為了好分析槽驶，想到更好的說法之前暫時先這么命名上面三個板塊...這三個板塊所采用的布局樣式都一致责嚷，即以這種單卡片流的方式來展示內容，單卡片流式布局可以讓用戶在瀏覽內容時可以比較專注于當前內容捺檬，讓用戶享受瀏覽快感再层，但單卡片式布局的內容缺少關聯(lián)贸铜，用戶瀏覽易產生疲勞和注意力分散堡纬，且其依賴內容的頻繁更新。單卡片式布局適用于比較靈活并受時間影響的內容蒿秦，如活動分享烤镐。如有特定分類并且內容不怎么受時間影響的建議還是采用主題分類布局內容比較好。
當然也有例外棍鳖，如果你愛自由的話炮叶，也可以整個采用單卡片式瀑布流方式展示內容，如唯品會的今日上新渡处。（有興趣去看看镜悉，不過本寶寶覺得看好累）
>>>>首頁效果圖-3（包含?医瘫、⑨個分析點）
?二手閑置板塊+⑨猜你喜歡
這兩個板塊主要是基于內容推薦的侣肄。
【分析】：根據(jù)內容直接做推薦，前者推薦二手閑置內容醇份，后者是針對瀏覽記錄和以往服務記錄進行個性化推薦
【優(yōu)化】：說是個性化推薦啦稼锅，但事實上內容是固定的，既沒有更新也沒有根據(jù)記錄做推薦僚纷，不過這個得慢慢來矩距，做好智能推薦是必須的。
【再說】：根據(jù)內容進行推薦是很贊的怖竭，但內容推薦具有不確定性且對數(shù)據(jù)的整合分析要求較高（算法等）锥债，內容不多的情況下，前期手動推薦也是挺好的~但手動推薦有其局限性，即內容更新速度慢且推薦的內容不匹配用戶哮肚。
分析版塊里每個分解點分了3個小點（【分析】毅整、【優(yōu)化】和【再說】)來詳細分析。感興趣的朋友可以深入绽左。
【分析】是對分解點的分析悼嫉、【優(yōu)化】是我提出的可以優(yōu)化的點、【再說】則是通過分析整理了一些參考知識點
以上分析均來自我非常正經的瞎YY拼窥，如有雷同純屬巧合戏蔑，如有異議歡迎探討！
