設(shè)計驅(qū)動|QQ運動體驗升級

0 評論 7274 瀏覽 34 收藏 15 分鐘

編輯導(dǎo)讀:在產(chǎn)品的迭代升級過程中,改版設(shè)計是常常會遇到的問題。文章對QQ旗下的老牌運動產(chǎn)品——QQ運動的體驗升級改版進(jìn)行了詳細(xì)的梳理,對遇到的一些問題進(jìn)行了分析總結(jié),供大家參考學(xué)習(xí)。

在這個全民健身的時代,越來越多的用戶開始頻繁使用運動APP,記錄自己的運動數(shù)據(jù),分享個人的訓(xùn)練動態(tài)。

QQ運動是QQ旗下的老牌運動產(chǎn)品,在上一版本中,由于過分依賴紅包福利體系,近一年逐漸呈現(xiàn)不健康的發(fā)展趨勢,需要尋找新的產(chǎn)品形態(tài)使產(chǎn)品重回正軌。因此,伴隨著市場、產(chǎn)品和用戶的持續(xù)更新,如何突破增長瓶頸,讓它在眾多同類產(chǎn)品中脫穎而出,鞏固自身競爭優(yōu)勢,是本次官網(wǎng)改版的主要課題。

01 用戶分析

QQ運動植根于月活用戶高達(dá)數(shù)億的QQ。因此在改版之初,我們對大盤內(nèi)的用戶進(jìn)行了盤點,發(fā)現(xiàn)用戶群體呈現(xiàn)明顯的兩極化分布,以16-24歲和40-60歲這兩個年齡段為主。進(jìn)一步對數(shù)據(jù)分析后發(fā)現(xiàn),兩類用戶的行為也是截然不同的。

首先,16-24歲這部分用戶表現(xiàn)出的行為是:

  1. 認(rèn)真運動,在跑步、健走這類運動基礎(chǔ)功能中占比很大;
  2. 自我表現(xiàn)欲望強,關(guān)注排行榜,重度原創(chuàng)偏好比例高;
  3. 社交活躍度高,體現(xiàn)在好友數(shù)量多,在空間和群中的行為十分活躍;其次,40-60歲這部分用戶大盤穩(wěn)定,專注于與利益點有關(guān)的功能 ,如獎金賽、打卡領(lǐng)紅包等。

02 差異化定位

鎖定有價值的目標(biāo)群體后,再通過競品分析、用戶訪談和數(shù)據(jù)分析等方式探索產(chǎn)品的優(yōu)勢。

從用戶行為看,16-24歲的群體更有益于產(chǎn)品的良性發(fā)展。基于此,我們利用其愛運動、個性化、強社交的特點,引入運動秀,打造“運動秀”的產(chǎn)品定位;同時考慮到40-60歲群體專注利益的特點,輔以紅包和獎金賽等功能。

03 體驗洞察

明確產(chǎn)品定位后,我們要確定對應(yīng)產(chǎn)品定位的可量化指標(biāo),即增長指標(biāo)。以增長指標(biāo)為抓手,更容易幫助我們得出與產(chǎn)品定位等價的設(shè)計方向。

QQ運動的改版項目以提高用戶活躍和留存為兩大增長指標(biāo),圍繞這兩大指標(biāo),我們制定了長線改版規(guī)劃。第一期改版,我們聚焦運動工具的優(yōu)化,內(nèi)容包括:優(yōu)化官網(wǎng)首頁、跑步健走和計步詳情模塊。第二期改版將聚焦社交場景進(jìn)行挖掘探索。

04 設(shè)計執(zhí)行

1. 設(shè)計方法

QQ運動產(chǎn)品設(shè)計強調(diào)規(guī)范、一致、細(xì)節(jié)嚴(yán)謹(jǐn)?shù)脑O(shè)計原則。首先,設(shè)計師既要考慮穩(wěn)定的用戶群體,又要考慮不同模塊之間的統(tǒng)一性,還要保證不同設(shè)計師的輸出一致,以及數(shù)據(jù)帶來的波動;強調(diào)細(xì)節(jié)嚴(yán)謹(jǐn),是因為用戶量龐大,而且已經(jīng)養(yǎng)成固定的行為習(xí)慣,并且運動功能相對已完善。面對上述現(xiàn)狀,設(shè)計師就需要采用更規(guī)?;?、精細(xì)化的設(shè)計策略。

首先,QQ運動品牌形象在用戶心中位置已穩(wěn)固,旗下的業(yè)務(wù)線也會不斷增加,為了避免業(yè)務(wù)和品牌關(guān)系混亂、體驗不一致的問題,設(shè)計師需要在現(xiàn)有品牌形象基礎(chǔ)上,進(jìn)一步優(yōu)化完善品牌系統(tǒng);其次建立統(tǒng)一的UI組件。兩種內(nèi)容貫徹至全業(yè)務(wù)線,形成設(shè)計規(guī)模化。

其次,設(shè)計師合理使用設(shè)計技能,在圖形、顏色、字體、版式、動畫五種視覺語言中垂直打造體驗效果,保證設(shè)計的精細(xì)化程度。例如:在標(biāo)準(zhǔn)字體的基礎(chǔ)上建立運營字庫;在動畫方面,可以從反饋、功能、過渡、趣味、氛圍等多維度場景精細(xì)打造動畫效果等。

2. 品牌設(shè)計

設(shè)計師重新梳理了QQ運動品牌系統(tǒng),為全業(yè)務(wù)線打造視覺骨架。其中包括標(biāo)準(zhǔn)logo、標(biāo)準(zhǔn)色、輔助色,標(biāo)準(zhǔn)字體、標(biāo)準(zhǔn)運營字體和輔助圖形。

3. UI設(shè)計

(1)優(yōu)化首頁布局,聚焦核心功能

重新梳理首頁的功能優(yōu)先級。根據(jù)產(chǎn)品定位和改版目標(biāo),我們對運動工具這類高價值功能強化感知,對業(yè)務(wù)要求的banner營收模塊保證首屏容納,對利益點相關(guān)的輔助功能維持原狀,同時加強首頁賽事的運營能力,對低頻功能降優(yōu)先級,對低價值功能收歸二級頁。

我們采用模塊化卡片的形式,將功能按優(yōu)先級規(guī)劃布局。以一套模塊化卡片結(jié)構(gòu),承載“計步、跑步和健走”三種運動工具內(nèi)容,這樣使信息有規(guī)律地整合并展示,降低用戶的理解成本,同時保證設(shè)計側(cè)的規(guī)范統(tǒng)一。

此外,卡片式結(jié)構(gòu)在用戶行為引導(dǎo)上也有天然的優(yōu)勢,用戶更容易下意識滑動卡片探索功能,增加置后的運動工具的曝光機(jī)會。

視覺設(shè)計方面,設(shè)計師把品牌色和輔助圖形沿用到UI界面中。為了增加運動的速度力量感,數(shù)字上采用粗壯傾斜的DIN英文字體,進(jìn)度條使用熱量彩虹漸變色,整體強化運動專業(yè)性。

(2)優(yōu)化運動記錄,提升使用體驗

跑步是QQ運動目標(biāo)用戶主要使用的核心功能,也是本次調(diào)整的重點內(nèi)容之一。我們從用戶行為及使用場景的角度出發(fā),對UI及動畫進(jìn)行了優(yōu)化。

跑步中的用戶很少立刻停下來操作APP,用戶在手機(jī)搖晃且可能比較累的狀態(tài)下誤觸概率可能增加??紤]到這一點,我們增強了觸碰后的反饋動效,以便讓運動中勞累的用戶更清晰的關(guān)注到自己有沒有誤觸界面。在一些關(guān)鍵功能設(shè)計上需要給用戶「反悔」的反應(yīng)時間。例如結(jié)束跑步對于用戶是一個需要認(rèn)真思考的決定,我們對不同功能的按鈕分別設(shè)計了“短按暫停跑步”和“長按結(jié)束跑步”兩種不同的操作方式。以防用戶因手出汗等等原因誤觸按鈕而導(dǎo)致提前結(jié)束記步。

考慮到用戶跑步以室外場景居多,在此次界面設(shè)計中,通過對色彩的重新規(guī)劃突出界面元素的視覺對比,同時強化QQ運動的品牌色。

(3)優(yōu)化計步詳情,增強用戶粘性

人們堅持運動,記錄自己的運動數(shù)據(jù),一是為了提升現(xiàn)實自我;二是為了向他人展示更好的社會自我。在上一版設(shè)計中,計步詳情頁主要用于沉淀運動數(shù)據(jù),幫助用戶關(guān)注現(xiàn)實自我的成長。在新版設(shè)計中,我們將原運動數(shù)據(jù)、打卡玩法、進(jìn)階體系合三為一,期望通過強化與社會自我有關(guān)的功能來增強用戶粘性。

根據(jù)原運動數(shù)據(jù)、打卡玩法和進(jìn)階體系三部分內(nèi)容,首先確定需要在首頁呈現(xiàn)的關(guān)鍵信息。作為計步詳情的核心內(nèi)容,對運動數(shù)據(jù)保留重要數(shù)據(jù)的展示,如今日步數(shù)、目標(biāo)步數(shù)、距離和熱量等;打卡玩法主要用于驅(qū)動用戶長期堅持,因此需要展示歷史打卡情況和沉淀的高價值數(shù)據(jù),包括打卡日歷和三個維度的打卡數(shù)據(jù);進(jìn)階體系主要為用戶明確目標(biāo)感,并提供標(biāo)榜社會自我的機(jī)會,該部分通過外顯打卡里程碑和步數(shù)段位達(dá)到目的。

基于上述關(guān)鍵信息,明確優(yōu)先級并梳理信息架構(gòu)。我們將計步詳情頁的內(nèi)容分為三大模塊 — 打卡日歷、打卡數(shù)據(jù)和運動數(shù)據(jù),并將兩個維度的進(jìn)階體系穿插于對應(yīng)的模塊中。同時在信息架構(gòu)上突出與打卡玩法相關(guān)的功能的信息層級,期望通過引導(dǎo)用戶持續(xù)打卡,保持用戶活躍。

打卡日歷不僅用于展示歷史打卡情況,也作為運動數(shù)據(jù)的時間標(biāo)尺,因此采用全局導(dǎo)航的形式承載日歷,既獨立存在,又用來切換展示不同日期的運動數(shù)據(jù);之后,統(tǒng)一打卡數(shù)據(jù)模塊和運動數(shù)據(jù)模塊中內(nèi)容的排布,并按改版目標(biāo)確定兩個模塊的優(yōu)先級排序。此外,將詳細(xì)的運動數(shù)據(jù)收歸二級頁,方便未來拓展設(shè)計維度更豐富的數(shù)據(jù)體系。新方案上線后,計步詳情頁留存率提升超過50%。

最終QQ運動一期完整設(shè)計稿概覽如下:

(4)搭建UI組件,便于快捷管理

QQ運動隸屬于QQ體系,所以組件化建立過程中設(shè)計師需要對齊手機(jī)QQ8.0版本的設(shè)計原則和設(shè)計規(guī)范,在具體應(yīng)用場景中添加符合自主品牌的相關(guān)元素。組件化管理有助于日常多人輸出的稿件統(tǒng)一。后續(xù)設(shè)計師也會根據(jù)新增的項目需要不斷更新迭代組件規(guī)范。

05 項目總結(jié)

新版官網(wǎng)上線后,首頁打卡功能的點擊率提升超過60%;首頁留存率提升近20% ;廣告cpm提升超過700% ;收入提升280% ;賽事點擊率提升近400%;DAU提升超過110%。

除此之外,設(shè)計師也進(jìn)行了設(shè)計方法沉淀和總結(jié),主要包括:

  1. 設(shè)計管理最重要的是項目底層邏輯,即產(chǎn)品設(shè)計思維。設(shè)計師要站在產(chǎn)品方向,針對不同時期的產(chǎn)品特點明確真實的設(shè)計目標(biāo),然后確定具體的設(shè)計指標(biāo),把設(shè)計量化。
  2. 大一統(tǒng)的品牌設(shè)計思維和“T”型設(shè)計執(zhí)行法,適用于所有設(shè)計項目。設(shè)計師不但要掌握知識的廣度,也需要在知識的深度方面下功夫。因此,設(shè)計師需要不斷突破自身壁壘,不斷成長。
  3. UI組件化管理,有利于多人合作,提升工作效率。

總之,現(xiàn)在的互聯(lián)網(wǎng)設(shè)計越來越要求專業(yè)度,設(shè)計師不能只是扮演執(zhí)行角色,更需要思維跳出設(shè)計本身,通過產(chǎn)品的視角,讓設(shè)計助力產(chǎn)品實現(xiàn)用戶體驗和商業(yè)變現(xiàn)的雙重價值,從而提升產(chǎn)品總價值。

 

本文由 @騰訊ISUX 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載

題圖來自Unsplash,基于CC0協(xié)議。

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發(fā)揮!