跟著電臺動起來 如何設(shè)計(jì)跑步的垂直場景

2017-1-1    資深UI設(shè)計(jì)者

如果您想訂閱本博客內(nèi)容,每天自動發(fā)到您的郵箱中, 請點(diǎn)這里

導(dǎo)語 
沒想到吧,你竟然可以通過企鵝FM來跑步?為什么在電臺App要深度挖掘一個運(yùn)動場景,交互設(shè)計(jì)師又是如何將痛點(diǎn)和需求轉(zhuǎn)化為市場藍(lán)海,在設(shè)計(jì)的過程中怎樣將場景垂直的特色表現(xiàn)出來······關(guān)于這些,我有一些想法與大家分享。


xiaoyuandiantaidatu

企鵝FM3.1上線了“跑步聽”,我們內(nèi)部都把它叫做“跑步電臺”。跑步電臺有獨(dú)立入口,里面是企鵝FM聯(lián)合專業(yè)運(yùn)動主播精心準(zhǔn)備的跑步節(jié)目,最大的特色在于:跑步電臺會計(jì)算用戶的實(shí)際跑步步頻與節(jié)目目標(biāo)步頻之間的匹配度,來進(jìn)行智能提醒,從而陪伴用戶科學(xué)而輕松的跑步。


用戶真的有通過電臺App來跑步的需求嗎?

這是我們在規(guī)劃這個產(chǎn)品功能時的第一個問題。即使在音樂類軟件都已經(jīng)上線了跑步相關(guān)功能的當(dāng)下,我們依然發(fā)問——真的有人,通過電臺App來跑步嗎?

如果僅僅是針對現(xiàn)在電臺類App,那需求一定是微乎其微,不同于音樂統(tǒng)一的內(nèi)容屬性,電臺類內(nèi)容屬性太豐富——音樂時間短,小說時間長;相聲很搞笑,新聞很嚴(yán)肅······這些內(nèi)容決定了他們天然就不能像音樂一樣隨機(jī)重組。

有時候我們需要退一步來思考需求。

產(chǎn)品經(jīng)理提出這種需求的初衷是什么——最初產(chǎn)品經(jīng)理的出發(fā)點(diǎn)其實(shí)是怎樣針對場景重組內(nèi)容,讓優(yōu)質(zhì)的節(jié)目得到更多的曝光,讓用戶可以對某一個功能入口產(chǎn)生粘性。所以這個需求的出發(fā)點(diǎn)更多是對于業(yè)務(wù)的一種探索。

而之所以選擇跑步這個場景,跟現(xiàn)在社會上健身這個“勢”是分不開的。健身儼然已是全面風(fēng)潮,約跑、曬跑成為了朋友圈一道新風(fēng)景線。據(jù)說2017年中國馬拉松將超500場,比2011年的22場呈井噴之勢。另一方面智能手機(jī)的定位和記錄體能指數(shù)功能,是能讓場景閉環(huán)的基礎(chǔ)。

 

chinese

 

回到跑步電臺這個需求本身,跑步電臺應(yīng)該是推薦優(yōu)質(zhì)的跑步類內(nèi)容的整合,本質(zhì)上還是用來服務(wù)于電臺節(jié)目的。這些內(nèi)容指向的目標(biāo)用戶也是相對明確的:想要科學(xué)合理地跑步的跑者,偶爾跑步的小白用戶。

 

targetuser

 


如何在市場中突圍?

所謂知己知彼,百戰(zhàn)不殆。我們向內(nèi)尋求需求的本質(zhì),向外應(yīng)該去關(guān)注整個市場的競品,從而形成自己的“藍(lán)海戰(zhàn)略”——一條基于用戶痛點(diǎn)尋求差異化創(chuàng)新突圍之路。

 

productchance

 

我們尋找了許多競品,現(xiàn)有市場落腳在三種內(nèi)容形態(tài)上:1、專業(yè)健身指導(dǎo)課程(綠色),2、專業(yè)跑步記錄軟件(橙色),3、運(yùn)動場景的音樂推送(藍(lán)色)。

當(dāng)我們以 x軸(專業(yè)—業(yè)余) 與 y軸(陪練—指導(dǎo)) 畫出產(chǎn)品機(jī)會定位圖,然后把這三類產(chǎn)品放進(jìn)去的時候,我們可以看到,在“業(yè)余+指導(dǎo)”的定位區(qū)間是明顯的市場缺口。再回看需求:推薦優(yōu)質(zhì)的跑步類內(nèi)容的整合,兩者內(nèi)外結(jié)合,我們可以這樣對產(chǎn)品進(jìn)行定義——

我們提供給用戶適合跑步時收聽的內(nèi)容,而不同于普通的跑步歌單,我們推出的是完整的有聲教程,能夠直接指導(dǎo)用戶科學(xué)的跑步,并且監(jiān)督用戶按照要求和目標(biāo)步頻來進(jìn)行運(yùn)動。

針對這份產(chǎn)品定義,我們再去分門別類的定義產(chǎn)品功能:

1、內(nèi)容形式:以專輯的維度推薦。例如:某跑步課程為一個專輯,其中分三個節(jié)目(環(huán)節(jié)),前五分鐘慢,中十五分鐘快,后十分鐘慢。

2、提醒:當(dāng)你的步頻低于或者高于目標(biāo)步頻時針對步頻一次提醒,每公里針對跑步里程提醒。

3、計(jì)分:根據(jù)用戶實(shí)際跑步步頻與節(jié)目的目標(biāo)步頻之間的匹配度進(jìn)行計(jì)分。


形式不僅追隨內(nèi)容

跑步電臺是一個內(nèi)容與產(chǎn)品形態(tài)強(qiáng)相關(guān)的產(chǎn)品。在這種深度垂直場景的設(shè)計(jì),我們的設(shè)計(jì)僅僅追隨內(nèi)容是不夠的,需要去有張力地表現(xiàn)內(nèi)容,讓目標(biāo)用戶快速了解到這是一個針對跑步的運(yùn)動場景,激發(fā)他運(yùn)動的欲望······為此我們設(shè)計(jì)了全新的專輯卡片、運(yùn)動播放界面、運(yùn)動成果頁和分享頁,支持運(yùn)動狀態(tài)的語音提示。

1-落地頁/精品感與運(yùn)動力

作為企鵝FM推出的第一個深度垂直功能,我們追求精品感+運(yùn)動力,我們要讓用戶感受到運(yùn)動電臺里的節(jié)目可靠而優(yōu)質(zhì),進(jìn)而想要嘗試。左圖是原有app可以承載的產(chǎn)品形態(tài),將信息拆分成右邊三類信息,我們再來重組。

 

source

 

怎樣去打造精品感?我們可以類比品的櫥窗,回想一下品的臨街櫥窗,一定不會像開架貨品一樣擠在一起,它會有高低錯落的展臺,它會在展臺上打造許多細(xì)節(jié)。精品,是需要重點(diǎn)、層次和細(xì)節(jié)的。類比到我們的設(shè)計(jì),我們采用卡片的形式,其實(shí)這并不是最高利用率的方案,但它讓用戶聚焦到我們最精品的內(nèi)容(重點(diǎn))、給用戶探索的空間(層次)、圍繞卡片我們可以加入很多企鵝FM這個品牌獨(dú)有的元素(細(xì)節(jié))。

PS:接下個版本中,我們希望加入更多動感的元素,比如魔法色。

 

endingpage

 

2-播放頁/針對動態(tài)場景打造

我們的節(jié)目,有一個統(tǒng)一的衡量指標(biāo),就是步頻,用戶的實(shí)際跑步步頻越是接近節(jié)目的節(jié)奏,那么用戶的得分越高。

我們拆分現(xiàn)有的播放頁,可以看到針對跑步這個動態(tài)場景有的需要增加:步頻、步頻匹配度、目標(biāo)步頻、結(jié)束跑步、跑步的時間/距離/配速······而有的需要刪掉:評論、定時、列表、語速、音效······有的元素有的需要突出:步頻與步頻匹配度。

 


playpagechange

 

feature

 

下圖前后對比可以看到,跑步電臺的播放界面有更多運(yùn)動元素,更聚焦在步頻這個要素上,運(yùn)動相關(guān)組件的重要級更高,更具針對性地運(yùn)用顏色。可以想象一下,用戶只要在跑步過程中看到最大的數(shù)字(107處)是金色就知道自己達(dá)標(biāo)了。

 

playpage4th

 

playpage

 

3-結(jié)束頁/讓用戶擁有成就感

雖然人人都知道運(yùn)動對身體好,但這并不是一個輕松的活動,我們希望用戶運(yùn)動完之后我們能夠給他們成就感,激勵他們繼續(xù)投入到運(yùn)動中去。這也是我們構(gòu)建更系統(tǒng)的激勵體系的基礎(chǔ)。

所以我們把用戶的跑步過程以可視化圖表的形式記錄下來,用戶可以真切地看到自己已經(jīng)完成的跑步。同樣的,我們希望用戶分享出去的時候也是一張可視化的圖表。而展示的卡片我們特意選擇了在社交平臺上展示效率最高的正方形。

 

fenxiang

 


設(shè)計(jì)中的得與失

企鵝FM的“跑步聽”功能從開始設(shè)計(jì)到上線只有一個月的時間,從最初大家懵懵懂懂抱著試試看的心態(tài)到真的對這個功能有信心,有一些思考希望與大家分享:

1、影子采訪(shadow use)在垂直場景的設(shè)計(jì)中極其重要。垂直場景針對的用戶和行為比較明確,定性研究相對定量研究更重要,我在設(shè)計(jì)過程中啟發(fā)我最多的就是shadow use,我潛入跑步的群和用戶一起跑步,看他們跑步過程中需要哪些功能,跑完之后什么樣的信息會給他們帶來成就感。如果是訪談用戶可能會虛構(gòu)自己的需求和感受,而shadow use讓設(shè)計(jì)師得到的信息皆為真實(shí)。

2、在進(jìn)行卡片式模塊設(shè)計(jì)時,可以采用元素拆分并重構(gòu)組件的方法:就是把所有已有的+缺失的+需要的元素拆分出來,再根據(jù)現(xiàn)在的用戶需求重新搭建組件,然后再把組件放到模塊中去。

3、產(chǎn)品功能從0到1比從1到100難得多,從0到1我真的是兩眼一抹黑,但這個功能開發(fā)完成之后我們馬上就可以分門別類地提出許多優(yōu)化方案。設(shè)計(jì)師如果能夠多嘗試從0到1的設(shè)計(jì)過程,對于從1~100的設(shè)計(jì)有很大的幫助。

藍(lán)藍(lán)設(shè)計(jì)www.bouu.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)

分享本文至:

日歷

鏈接

個人資料

存檔