內容產品:如何設計清晰友好的首頁(二)
在首頁的Redesign之前,首先要思考號首頁應該承載哪些內容,承擔什么責任,達到什么目的。
上一篇文章《內容產品:如何設計清晰友好的首界面(一)》 寫了十點APP首頁存在的幾個問題,總結一下:
- 首頁放置了太多 icon ,導致界面凌亂;
- 頂部功能區功能過多;
- 輪播圖沒有設計規范,與系統狀態欄、頂部功能區“亂作一團”;
- 導航不夠清晰,并且沒有涵蓋所有內容類型;
- 懸浮按鈕太多且功能重復。
下面開始思考如何 Redesign,在這之前,首先要想一下首頁應該承載哪些內容,承擔什么責任,達到什么目的。
以網易云音樂 v6.0.1 為例,首頁是叫做“發現”的 Tab,我將這個界面分為兩大部分:
- 第一部分由輪播圖、導航、推薦歌單、新碟/新歌四個版塊組成的,這是核心區域,負責向用戶展示云音樂最重要、最核心的內容,如歌單和音樂庫;
- 第二部分是“云村精選”,用于滿足用戶的“閑逛”需求,與 Tab 名稱“發現”呼應。這里使用了現在比較容易抓住和留住用戶的視頻信息流,根據用戶行為推薦視頻內容,中間插入直播推薦、歌單推薦、話題推薦、會員專屬內容推薦等,從而達到為其他版塊引流的目的。
得到 v5.7.0 的首頁也叫做“發現”,內容與版塊的安排同樣有規律可循,我也將其分為兩大部分:
第一部分是輪播圖、導航、直播預告/入口、羅輯思維&李翔知識內參組成的核心區域,用戶可以在這里找到自己想要的以及得到APP中最核心的內容;
第二部分我歸納為由“與導航對應的版塊+話題式內容推薦版塊”組成:
- 與導航對應的版塊:得到APP的導航包括聽書、電子書、商城、專題、課程五個部分,“每天聽本書”版塊與導航中“聽書”對應,“最近更新的課程”、“熱門排行榜”與導航中“課程”對應,“電子書獨家特價”與導航中“電子書”對應,“實物商城”與導航中”商城“對應。
- 話題式內容推薦版塊:第二部分更加注重向用戶推薦內容,采用了較為靈活的“話題式”推薦方式,即提煉、設置話題,圍繞話題推薦合適的內容,可能推薦一套課程,也可能推薦某套課程中某一節。例如話題”幫你新增四種思維“中推薦了梁寧的產品思維 30 講整套課程,而話題”跟微信學產品迭代的學問“中則推薦了梁寧產品思維30講中的第 16 節課”系統迭代:微信紅包的意外與刻意“。
在上面的兩個例子中,首頁都承擔著以下作用:
- 讓用戶第一時間知道這是什么類型的 APP,可以提供哪些內容,用戶知道去哪里找自己想要的內容;
- 為用戶推薦內容,向重要內容引流。
回過頭來看十點讀書 APP,暫時還沒有看出首頁內容版塊設置的邏輯和規律,但是可以推測出十點APP想通過首頁達到的目的:
- 用戶可以通過首頁導航、搜索等找到想要的內容;
- 推薦十點號大 V,向十點號自媒體引流;
- 展示和推薦重要的課程。
因此我將以上述三點為原則,展開對十點讀書 APP 首頁的 Redesign。
目前十點 APP 呈現出的內容類型和結構如下圖所示:
通過上圖我們可以看到,十點 APP 劃分了多個類目,每個類目包含 2-3 個層級,且類目與層級間有重合的部分、關系混亂,例如“成長圖書館”中的“傳記”打開后直接跳轉至“人物故事館”類目。
我仔細看了各個類目中的內容,個人認為可將十點讀書 APP 的內容分成以下幾個大類:
- 有聲書
- 精選好課
- 十點電臺
- 熊爺解憂書庫
- 十點號自媒體
由于底部 Tab 欄中的“發現”即為十點號內容信息流,因此無需在導航中設置“十點號”,那么整理后的導航結構如下:
- 有聲書 由“成長圖書館”、“人物圖書館”、“精品有聲書”、“有聲書”合并而來,在內部按照文學、傳記、歷史、小說等屬性進行分類;
- 精選好課 原位于首頁底部的“精選好課”版塊加入頂部宮格導航中,內部按照職場、人文社科等屬性分類;
- 十點電臺 原“治愈電臺”只推薦主播的十點號而非直接推薦電臺節目,用戶獲取電臺內容的路徑較長。新的“十點電臺”直接推薦電臺節目,并將同為電臺類型的“睡前兒童故事”納入其中,內部也會按照電臺屬性分類;
- 熊爺解憂書庫 谷聲熊可以理解為十點讀書自己的 IP 或吉祥物,因為作為單獨的一部分存在,內部按照原有的效率、習慣、理財等進行分類。
導航結構重新優化后也就解決了上面提到三個原則中第一條:用戶可以通過首頁導航、搜索等找到想要的內容。
接下來考慮導航以下部分的版塊布局,結合目前線上十點讀書 APP 的內容布局,可以推測出十點讀書非常重視十點號自媒體內容的展示,向自媒體引流,引導用戶關注大 V,所以后面版塊設置時需要同樣注意向十點號引流。
這里其實考驗的是內容的運營策劃能力,可以借鑒得到APP的模式,利用話題推薦內容等。
綜上所述,我對十點讀書 APP 首界面的 Redesign 如下圖所示:
- “日簽”功能入口轉移至界面左上角;
- 將“下載管理”入口從首頁移除,可考慮收納進“已購” Tab;
- 將“歷史記錄”入口從首頁移除,原因是播放器本身已經保留了用戶的播放歷史,用戶是否有查閱多條、多天前歷史記錄的需求未可知;
- 重新規劃設計宮格導航,避免給用戶過多模糊的選項;
- 按照十點讀書本身的內容體系設計了導航以下的內容版塊,以達到向十點自媒體引流、推薦課程的目的。
以上為全部內容,本文僅用于學習,并不針對任何組織和個人。
本文由@Jalyn 原創發布于人人都是產品經理,未經允許,禁止轉載。
題圖來自Unspalsh, 基于CC0協議。
確實梳理的更清晰。十點app的首頁現狀更像是業務部門主導的,覺得哪塊業務目前比較重要就升格露出,打亂了從用戶體驗出發的布局科學性。
辛苦
十點讀書的產品經理怎么看??
我是認為存在即合理。但是要以用戶體驗為核心吧。凡是能優化用戶體驗的都可以接受。
很多決策要有數據支撐,我寫的只是從用戶體驗、信息架構方面出發,我也很希望可以知道十點這些決策背后的原因~