Keep 的 UI 設(shè)計分析
Keep的UI設(shè)計風格跟其他的運動類風格有很明顯的差異,整體比較寧靜淡雅,Keep為什么會選擇這種風格?這種風格的優(yōu)勢又在哪里?
前幾天,Keep 宣布用戶數(shù)破 2 億了。從 0 到 2 億,Keep 花了近 4 年半時間。
據(jù)《2018中國健身行業(yè)數(shù)據(jù)報告》顯示,中國有 4327萬健身房人口,在總?cè)丝谥姓急?3.1%。也就是說,在中國,每 100 個人當中,有3個人去健身房;每7個人當中,有1個人用 Keep。
上線于2015年2月的 Keep,以黑馬的姿態(tài)后來居上,成為明星產(chǎn)品;在健身類 App 中長期霸屏第一,受到蘋果 CEO 庫克以及很多用戶的喜愛,時不時的出沒于朋友圈,同時也是騰訊、高盛等熱門資本的寵兒。
作為 Keep 用戶,我簡單的研究過 Keep,結(jié)論是 Keep 是一個綜合發(fā)展的優(yōu)等生——價值觀、產(chǎn)品、設(shè)計、運營、品牌建設(shè)等方面都值得好好學習。
另外 Keep 和諸如騰訊、阿里、網(wǎng)易等傳統(tǒng)互聯(lián)網(wǎng)公司旗下的產(chǎn)品比較時,又有很不一樣的地方,因為 Keep 身上有耐克、可口可樂這些非互聯(lián)網(wǎng)產(chǎn)品的影子,這也是很有意思的地方。同時,Keep 在某些方面也存在一定提升空間,比如交互設(shè)計,這個后面我也會單獨寫篇文章。
今天主要和大家分享一下,我對 Keep UI 設(shè)計(純視覺方面,基于 iOS v6.21)的研究與思考,偏宏觀,歡迎大家留言交流。
01 Keep的UI是什么樣的風格?
簡單來講,和大部分運動類 App 比,不太一樣;具體來講,Keep 的“運動感”比較輕,同時又給人一種淡雅寧靜的感覺,這種感覺會讓我想起星巴克的設(shè)計。
(Keep 主要界面)
大部分運動類 App,UI 方面,通常都是“運動感”比較強:他們通常會大面積運用醒目的黑色,彩色方面,通常會用比較亮、比較有活力的顏色,整體上突出的是力量感和活力感;配圖方面,也往往突出力量感和活力感,喜歡用一些充滿較強活力或者爆發(fā)力的圖片、或者是一些肌肉較兇的圖片,配上偏暗偏黑的深色背景、或者鮮艷有活力的彩色背景。
耐克就是很典型的例子,而且一直沿用著這種風格。另外,耐克還有一點很不錯,就是除了這些,耐克還通過一些充滿笑容的圖片傳遞出了一種運動時的愉悅感。
(一些運動類 App)
而 Keep 的 UI,配圖里面也經(jīng)常會用到健身圖片,但極少有那種荷爾蒙四射的力量感。運動感倒是有一些,比如主色里的灰色,眼睛告訴我它似乎是藍灰色,但放到 Sketch 或 PS 里面以后,會發(fā)現(xiàn)其實是紫灰色,紫色介于冷色和暖色之間,另外這個顏色本身也比較深比較暗,整體來看是有一定的力量感在里面的,淡淡契合運動的主題。如果是藍色,給人的感覺會是冷或者清涼清爽,力量感就會弱一些。
圖標方面,最主要的底部導航圖標,用的是面型,非常簡潔的幾何塊狀,配上微弱的圓角,用擬人的說法,仿佛有一種結(jié)實有肌肉的感覺。比如“我”那個圖標,肩很寬,顯得肩和背上是有肌肉的,還有主色里面用來表示點擊和突出顯示的綠色,雖較為成熟穩(wěn)重,也是有一定活力的。關(guān)于 Keep UI 方面的“運動感”,就簡單分享這些例子。
(Keep 主要界面元素)
除了“運動感”,Keep 的 UI 還有一種淡雅寧靜的感覺,這個也主要能從顏色里面感受到:主色里的灰色,沒有特別暗,也有一定的寧靜之感;主色里的綠色,有一定活力,但沒有大面積使用,不躁動,能和整體的淡雅寧靜和諧共處。
其它大面積用到色彩的地方,比如大圓按鈕和一些課程模塊的大面積背景色,Keep 選擇了淡雅的類似瑜伽、冥想產(chǎn)品的那種配色。還有字體,最黑的字體也沒有用純黑,粗體也用的少,這些都能讓人感受到一種淡雅寧靜。
02 Keep的 UI 為什么選擇這種風格?
1. 受產(chǎn)品定位影響
一款運動類 App,自然需要一定的“運動感”。
2. 受用戶特征影響
不管是以迎合用戶的審美為主導,還是以決策者的審美偏好為主導,還是兩者結(jié)合,通常都要滿足一個共同的條件:需要符合主流用戶的審美。
根據(jù)易觀千象數(shù)據(jù)顯示,Keep 用戶主要集中在一二線大中型城市,占比超過 3/4;用戶年齡主要集中在 35 歲以下,占比約 75%;男女比例接近 1:2。Keep 的這種 UI 風格,是能夠為其主流用戶所接受的。
3. 受創(chuàng)始人的審美偏好影響
關(guān)于 Keep 創(chuàng)始人王寧的性格,媒體報道的說法是“謹小慎微”。簡潔、淡雅寧靜這種低調(diào)的輕運動風格,想必也是王寧所喜歡和推崇的。
(Keep 創(chuàng)始人王寧)
4. 強“運動感”的 UI 風格能否帶來運動類 App 數(shù)據(jù)的增長?
現(xiàn)在很多人對 UI 設(shè)計的認知和期待主要集中在三個方面:首先要好看、舒服;其次要體驗好,比如閱讀體驗、瀏覽體驗等;最后要能帶來數(shù)據(jù)的增長(商業(yè)價值),這一點在電商類公司尤為明顯。
那么,以運動類 App 為例,強“運動感”的 UI 風格和數(shù)據(jù)增長之間,是否存在必然的因果關(guān)系?我的答案是:未必。
舉例來說,產(chǎn)品方是希望用戶第一次看到這款 App 的時候,能夠嘗試使用,之后能夠持續(xù)不斷的使用。關(guān)于第一次的嘗試使用,UI 會起到不小的作用,當用戶覺得這個產(chǎn)品好看有品質(zhì)的時候,極有可能會嘗試使用。但是,不同的風格都可以被設(shè)計的好看有品質(zhì),所以這里的核心是設(shè)計本身,而不是風格本身。
另外,現(xiàn)實生活中,用戶通常都是先做了一個要運動的決定,比如要去去跑步或者練腹肌,然后才會打開一款運動 App 來用。而不是先打開一款運動 App,然后受其強“運動感”的 UI 風格的影響,從而決定去跑步或者練腹肌。當然也不排除強“運動感”的 UI 界面,會讓人產(chǎn)生想要運動的沖動,我自己看 Nike Run Club 的界面,就會產(chǎn)生這種沖動。
(Nike Run Club 界面及圖片)
歸根結(jié)底,這里涉及的問題是,用戶決定運動并付諸實踐的源動力究竟來自哪里?有兩點最為核心:第一,內(nèi)心深處提升自己健康與健美程度的渴望;第二,來自外界成功例子的激勵,主要是來自朋友、熟人、名人甚至陌生人,比如關(guān)于彭于晏健身的各種報道,會影響和激勵很多人。
這兩點的力量要遠大于 UI 風格方面的強“運動感”,運動類 App 完全可以在這兩方面做文章,效果會更好。實際上,Keep 就這樣做了:“自律給我自由”的品牌口號就是在喚醒用戶內(nèi)心深處的渴望,社區(qū)里面大量堅持健身以及健身成功的例子,也是在激勵和鼓勵用戶。
總的來說,強“運動感”的 UI 風格,在促進一款運動 App 的數(shù)據(jù)增長方面,效果有限。Keep 選擇了更為有效的其他方法,這里面的助力元素還包括:比較專業(yè)的健身課程、務(wù)實且互動性強的運營等。
03 這種 UI 風格對 Keep 有哪些好處?
1. 低強度的積極情緒更容易帶來細水長流的效果
一個比較極端的例子是,玩王者榮耀時的拿人頭、得 MVP、升段位、拿三殺五殺會讓我們爽。如果玩的時間過長,這種對神經(jīng)高強度的刺激,既會讓我們爽,也會讓我們累,甚至不堪重負。
同理,如果大腦神經(jīng)長時間受這種強“運動感” UI 風格的刺激,用戶也會感到疲累,只是程度不同而已。
反而 Keep 這種淡雅寧靜的風格,帶給用戶的是一種放松的感覺,是一種強度很低的積極情緒。這種潤物細無聲的低強度積極情緒,即使用戶每天都打開 Keep 來用,也不會因為 UI 界面而產(chǎn)生疲累等負面情緒。
另外,根據(jù)王寧 2016 年在混沌研習社的分享,在中國,很多人每周運動,但每天運動的人很少;在美國,每天運動和每周運動的人占總?cè)丝诘?90% 左右。Keep 希望更多中國人能夠每天運動,這種淡雅寧靜的風格,一定程度上有利于這個愿望的實現(xiàn)。
2. 帶有一定的高級感,容易受人追隨
減少設(shè)計對用戶神經(jīng)和欲望的刺激,同時讓用戶感覺到放松,某種意義來講,這是一種做減法的設(shè)計。星巴克沒有像肯德基一樣,用紅色的店鋪裝修來激發(fā)顧客的食欲,而是用深色的裝修、原木材質(zhì)的桌椅和舒緩的音樂,讓顧客感到放松和安靜,某種程度上也是一種做減法的設(shè)計。
像極簡的、黑白的、獨特的設(shè)計一樣,Keep 這種做減法的、克制的設(shè)計也很容易給人一種高級感(當然,這里我覺得還有設(shè)計美感和品牌精神的助力)的感覺。
帶有高級感的事物,會讓人感覺良好,所以很容易受到人們的追隨。就像很多人喜歡在星巴克里拍照一樣,很多用戶也喜歡把自己的 Keep 動態(tài)分享到朋友圈,包括我自己。
3. 形成差異化,有利于品牌認知和傳播
在包括耐克在內(nèi)的一眾運動類 App 都追求強“運動感”的大環(huán)境下,Keep 這種輕“運動感”搭配淡雅寧靜的 UI 風格,就顯得很獨特,一定程度上有利于品牌的認知和傳播。
04 結(jié)語
最近的《明日之子》第 3 季,復(fù)古女孩洪一諾憑老歌《風中有朵雨做的云》和《無聲的雨》唱醉六位評委,首奪六星,帶大家集體穿越回 90 年代。孫燕姿在評價她時這樣說到:“大家可能到了一個時代是,砰砰砰砰砰……什么都在你面前的時候,大家其實是想要退一步。洪一諾,她就是剛好讓人退一步,看到的那顆星?!?/p>
同樣,在這樣一個高速發(fā)展的時代,什么都砰砰砰砰砰的出現(xiàn)在我們面前的時代,大家會想要安靜和放松一下。Keep 的 UI,就是靜謐夜空中,能讓人安靜和放松的那顆星。
以上。
本文由 @Snow Design 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。
題圖來自網(wǎng)絡(luò)
想了解keep的交互設(shè)計,期待您的這篇文章
關(guān)于Keep的交互設(shè)計,可以參考《Keep用戶體驗…》那篇文章,里面“Keep用戶體驗的缺點”部分有涉及;另外,關(guān)于交互設(shè)計,可以參考《…信息架構(gòu)》那篇文章;可能不會有專門關(guān)于Keep交互設(shè)計的文章了
而且同理,個人覺得對于keep的商城模塊,這種相對高級冷靜的配色風格不見得是一種劣勢;相反,它有一種更強的信服力。在其他的APP上,不管主打什么功能,加入的商城模塊基本都沿用的是淘寶拼多多色系,一眼看過去都是那種商場大減價的感覺。但keep在用戶思維這一塊就比較聰明,它明白自己的主體用戶所在的消費和精神層次,用戶更看重的不是價格折扣,而是品質(zhì)和高級感。
是的,個人覺得還有設(shè)計美感
個人感性分析一下,別的APP都用跳躍的彩色,想要抓住 運動的‘動感 跳躍’等關(guān)鍵詞表現(xiàn),想要刺激用戶動起來;但是keep給人的調(diào)性,更能給人‘堅持’這樣的感覺,灰色系介于黑白之間,感覺特別能代表成功路上堅持的顏色~ 相較別的APP,keep品牌調(diào)性抓住了我精神層面的感官… 淺解
精神層面的東西或者說共鳴,是很有力量的…喜歡你的解讀…
很喜歡看你寫的文章,很有想法
謝謝,歡迎常來~
一直比較喜歡它的 Logo 設(shè)計,很有意思~~最近在跑步,一直用 Keep,界面很友好,是我喜歡的風格,其他類似的APP沒用過~~
它的 Logo 有意思,我覺得沒有往高級感的方向靠,圓潤溫潤,K 都沒有用大寫,親切大眾。我以前用 Nike + 跑步,后來一直用 Keep~
宏觀上淺談 Keep 的 UI 設(shè)計,希望能拋磚引玉~