點擊率提升115%！騰訊動漫8.0改版實戰(zhàn)完整復盤

騰訊動漫 7.0 沒過多久之后，我們就緊鑼密鼓地進入了 8.0 改版的階段。

改版思維的升級

每一次改版都有不同的側(cè)重點，騰訊動漫一路走來已經(jīng)經(jīng)歷了很多次重大改版，與以往不同的是，8.0 改版我們在業(yè)務(wù)理解、數(shù)據(jù)關(guān)注度方面都有明顯提升：

• 6.0 改版：被動接受需求，主要負責視覺及體驗優(yōu)化，沒有完整系統(tǒng)性的設(shè)計語言
• 7.0 改版 ：主動提出優(yōu)化方案，打造完整、體系化的設(shè)計語言，但較為感性、主觀
• 8.0 改版 ：深度參與需求制定，全局性思考業(yè)務(wù)目標，以數(shù)據(jù)為導向，量化設(shè)計價值

這次的視覺體系升級并不是核心，也不是孤立存在的系統(tǒng)，它完全是基于產(chǎn)品和業(yè)務(wù)需求而產(chǎn)生的升級優(yōu)化，并且以數(shù)據(jù)為導向重新回歸用戶視角，避免過度設(shè)計，圍繞「人（用戶視角）」這個概念進行各個體系的新增、重構(gòu)、優(yōu)化。

本次改版設(shè)計師開通了大部分的后臺數(shù)據(jù)權(quán)限，洞察改版后的數(shù)據(jù)變化，并以此來為支撐點，量化設(shè)計的價值。

產(chǎn)品現(xiàn)狀及問題

1. 外部

隨著短視頻、5G 的到來，以及動漫平臺的增加，造成外部競品分流極其嚴重：

用戶的注意力被分散了太多太多。

2. 內(nèi)部

而內(nèi)部由于版權(quán)引入成本高、內(nèi)容制作周期長等因素，導致內(nèi)容更新過慢，久而久之，用戶的閱讀時長、活躍度、轉(zhuǎn)化率都有下降趨勢：

改版目標

基于以上目前產(chǎn)品面臨的問題，本次改版我們主要聚焦在閱讀轉(zhuǎn)化和促活兩個方面，當然，視覺體系也是一定要升級的，但它是輔助前兩點的，并不是為了優(yōu)化而優(yōu)化，總的來說，我們希望通過這次改版做到以下三點：

• 提高用戶的閱讀轉(zhuǎn)化
• 促進用戶的活躍度
• 打造以業(yè)務(wù)為導向的視覺體驗

提高閱讀轉(zhuǎn)化

先科普一下什么是閱讀轉(zhuǎn)化，其實就是從啟動 app 開始到進入閱讀頁開始閱讀行為的過程，就是閱讀轉(zhuǎn)化。

那想提高閱讀轉(zhuǎn)化，就必須在過程中幫助用戶更好的進行決策，吸引用戶快速進入閱讀。

簡單舉幾個助力用戶進入閱讀頁的例子，比如封面圖做的超級好看，再比如有個評分 100 分的漫畫，這些都是可以吸引用戶進行閱讀行為的方法。

那為了更加系統(tǒng)地進行優(yōu)化升級，我們把用戶核心的閱讀轉(zhuǎn)化路徑進行了梳理，如下圖：

基于這張路徑圖，我們重點優(yōu)化了很多觸點，比如詳情頁、分類、排行榜、標簽系統(tǒng)（標簽在首頁、分類、排行頁面都有露出）、評分系統(tǒng)等等，下面我們依次解析。

1. 詳情頁的架構(gòu)優(yōu)化

看剛才閱讀轉(zhuǎn)化路徑不難發(fā)現(xiàn)，基本所有的路徑都要經(jīng)過詳情頁再到閱讀頁，所以詳情頁是非常重要的轉(zhuǎn)化觸點。

舊版的詳情頁結(jié)構(gòu)十分混亂，到處都是重點，還分有詳情和目錄兩個子 tab，用戶無法輕易找到想看的信息：

新版詳情頁，我們將所有信息進行整合，去掉那些無用信息，基于讓用戶更容易決策的理念，把重點的決策信息進行突出，比如強化了評分、運營標簽，新增章節(jié)封面（讓用戶更好地感受每個章節(jié)的大概內(nèi)容，從而決策要不要進行觀看）：

新舊對比圖：

2. 標簽系統(tǒng)的升級

涉及到的觸點頁面有：首頁、分類、排行、詳情頁。

我們在標簽系統(tǒng)增加了更多維度的信息來幫助用戶進行決策，比如男生、女生榜 top10、月票榜 top10、收藏數(shù)破多少萬、在看人數(shù)破多少萬等等，相比之前單一的分類標簽，可以讓用戶更直觀的感受作品值不值得閱讀：

除此之外，我們把很多標簽的表達形式變得更加符合用戶視角，基于一些熱點和用戶常用詞匯來進行改造，比如在分類就增加了運營標簽篩選器，其中霸道與廢柴逆襲的數(shù)據(jù)非常可觀：

• 「霸道」標簽：點擊率 47%、閱讀率 67%
• 「廢柴逆襲」：點擊率 54%、閱讀率 62%

分類新舊對比：

3. 排行榜的多維篩選信息

我們優(yōu)化了 top 100 榜，把平臺評分前 100 的優(yōu)質(zhì)漫畫做了整合來讓用戶進行選擇，并且除了評分以外，排行榜還有其他很多維度的決策信息露出，比如月票量、閱讀量等等：

4. 讓用戶更好的識別內(nèi)容屬性

如果你想讓用戶更好的進行選擇，那就應該讓用戶更容易識別正在看的是什么內(nèi)容。

舉個例子，我們在查看首頁各個模塊點擊率的時候，發(fā)現(xiàn)小說模塊的點擊率非常低，于是就隨機采訪了幾個用戶，在采訪的過程中我們發(fā)現(xiàn)用戶并不是對小說模塊的內(nèi)容不感興趣，而是根本沒有發(fā)現(xiàn)它的存在，在用戶的認知里，小說的封面應該是小豎封的形式，而我們原來采用的卻是橫封的形式，在這樣的背景下，我們把小說的封面從橫封變成豎封，并且對排版也做了優(yōu)化，更加的透氣：

優(yōu)化后，小說模塊點擊率提高了 115%。

打造以業(yè)務(wù)為導向的視覺語言

7.0 的時候，我們的設(shè)計是感性的，而 8.0 最大的不同就是我們增加了理性的部分。

我們的出發(fā)點很簡單，怎么能讓用戶更好的進行決策？

如果總是讓用戶分散注意力，那用戶就很難聚焦在內(nèi)容本身，所以我們做的就是降噪，弱化框架，避免過于花哨，比如在首頁框架優(yōu)化的時候，橙色的干擾太多了：

所以我們將之前的頁面中繁多的橙色進行無彩色處理，效果對比如下：

效果很明顯，這樣用戶就可以更好的聚焦內(nèi)容本身。

同樣的道理，書架頁面也是一樣的優(yōu)化方式：

以上這種優(yōu)化方式，我們提煉出一個核心的關(guān)鍵詞叫做：「色彩降噪」，整個 8.0 的視覺語言也是圍繞這樣一個點提煉出來的，為了避免花哨，我們從7.0 的三色升級為 8.0 的「重色與點綴色的配合使用」：

但是，其實僅僅只是「重色點綴色的配合使用」就可以有很多種玩法，比如純扁平風格、純描邊風格、描邊與扁平結(jié)合等等：

這時候選擇使用哪種風格呢？

可以從兩個角度出發(fā)，一個是產(chǎn)品屬性、再有一個就是競品分析，比如我們是漫畫平臺，所以黑色描邊可以很好的體現(xiàn)漫畫的屬性，其次我們做了一些視覺上的競品分析，我們會發(fā)現(xiàn)，前兩種純描邊與純扁平風格已經(jīng)有很多產(chǎn)品在用了：

于是經(jīng)過綜合考慮，我們選擇用描邊和扁平結(jié)合的設(shè)計語言來貫穿始終：

基于這個視覺語言，我們做了圖形延展和插畫延展。

圖形延展包括圖標、按鈕、輔助圖形等等：

插畫延展包括空白頁、表情、性別選擇插圖等等：

所有的延展都是基于「降噪」的設(shè)計語言，而「降噪」的設(shè)計語言又完全以業(yè)務(wù)目標為導向，這就是 8.0 改版與以往最大的不同。

7.0 與 8.0 的部分視覺對比：

促進用戶活躍度

在促活方面，我們主要做了等級體系、V 會員體系。

1. 等級體系

等級體系面臨的最大問題就是等級區(qū)分不明顯，1 級與 40 級樣式相同，這樣很難激勵用戶去提高等級，在這樣的的問題之下，我們希望能夠讓用戶有一個明顯的等級認知，以此來促進用戶的活躍度，整體等級圖標的樣式也是在 8.0 大的設(shè)計語言之下完成的。

對于等級體系的優(yōu)化，起到了很好的促活效果，可以看下數(shù)據(jù)對比，平時官方發(fā)布的帖子，用戶留言數(shù)平均為 100 條，而兩條關(guān)于等級體系的帖子，留言數(shù)高達 5000+ 條：

這對于我們一期的目標：讓用戶有一個很好的等級認知」 已經(jīng)算是完成的很好了。

對于等級體系，很多用戶反饋升級升的太快了，而且還有滿級 40 級，不應該封頂，對于這些問題，我們都還在持續(xù)優(yōu)化中。

2. V會員體系

為了提高用戶活躍度以及付費轉(zhuǎn)化，我們做了 V 會員體系，給出用戶相應的特權(quán)，每日禮包、免費領(lǐng)券、漫畫限免、5 折購券等等，整體在 8.0 視覺體系的基礎(chǔ)上，打造一種有趣的、酷酷的會員感覺，為此我們設(shè)計了 V 會員的形象，黑子+蛤蟆鏡+傾斜的 V

為了更加的有吸引力，我們采用了 3d 的設(shè)計手法來做頭部：

目前 V 會員處在灰度階段，后面全亮后會持續(xù)跟進數(shù)據(jù)情況。

總結(jié)

1. 角色定位

在角色方面，設(shè)計側(cè)以前屬于被動接受需求的一方，現(xiàn)在主動參與前期需求探討，并給出相對應的建議和方案。

2. 視覺體驗

在視覺語言方案，雖然 7.0 已經(jīng)有了體系化設(shè)計語言的意識，但是相對較為感性、主觀，而 8.0 我們完全以業(yè)務(wù)為導向來進行設(shè)計提煉，更好的服務(wù)產(chǎn)品。

3. 數(shù)據(jù)關(guān)注

對于數(shù)據(jù)的關(guān)注度，8.0 版本之前是比較零散的，相對沒有那么敏感，目前設(shè)計師都已經(jīng)開通了相應的數(shù)據(jù)權(quán)限，逐步學習數(shù)據(jù)的使用。

以上就是 8.0 改版的內(nèi)容，雖然時間比較緊張，人力資源有限，但在最后的結(jié)果反饋，不論是數(shù)據(jù)、體驗、視覺都有一個較為正向的反饋，這可能只是我們的一個起點，后續(xù)我們會持續(xù)跟進、優(yōu)化、升級！

2020 年，繼續(xù)加油鴨！

設(shè)計相關(guān)人員：ouou、菜心、小夢、tina、喬喬。

更多通過改版提升數(shù)據(jù)的實戰(zhàn)案例：