作者：易優小編

編者按：

滴滴專(zhuan)車經過兩年的發展，從一個(ge)可以(yi)滿足基本(ben)出行(xing)的服務工(gong)具(ju)已經逐步升級到一個(ge)可以(yi)滿足大多出行(xing)場(chang)景以(yi)及定制化服務的產品。

2017 年 5 月，滴(di)(di)滴(di)(di)專車(che)進行了一(yi)次(ci)服務升級，專車(che)會(hui)員(yuan)正(zheng)式上線。其中(zhong)包含了 4 個會(hui)員(yuan)級別(bie)「銀卡、金卡、白金、黑金」及 10 項會(hui)員(yuan)權(quan)益(yi)。本文(wen)的(de)兩位(wei)作者蘇天宇和陳(chen)超然(ran)分別(bie)是滴(di)(di)滴(di)(di)CDX專車(che)團(tuan)隊的(de)UI和UE，他(ta)們(men)從設計的(de)視角(jiao)復盤了整個滴(di)(di)滴(di)(di)專車(che)會(hui)員(yuan)項目的(de)設計優(you)化(hua)，文(wen)末還闡述(shu)了他(ta)們(men)在項目敏捷開發模式下的(de)心得體會(hui)，歡迎閱讀。

專車會員(yuan)二期項目背景

 

專車(che)會員(yuan)一期上線之后，用戶總(zong)體反饋較(jiao)為不錯，底部下拉升(sheng)起的控件(jian)對(dui)比頂部消息(xi)位控件(jian)用戶感知方面提升(sheng)了(le)7%，并通過(guo)會員(yuan)體系促進專車(che)整體發單提升(sheng)了(le)16%。

我們通過一期專(zhuan)(zhuan)(zhuan)車會(hui)(hui)員的(de)用戶反饋，及數(shu)據分(fen)析，提取(qu)出了核(he)心(xin)問題進行優化，希(xi)望在會(hui)(hui)員二期能(neng)夠讓更(geng)多的(de)用戶了解專(zhuan)(zhuan)(zhuan)車會(hui)(hui)員體系(xi)，對(dui)專(zhuan)(zhuan)(zhuan)車會(hui)(hui)員有(you)個(ge)獨特(te)的(de)認(ren)知(zhi)。

通過設計希望能(neng)夠兼(jian)顧新(xin)老(lao)用(yong)戶(hu)，讓新(xin)用(yong)戶(hu)感知(zhi)(zhi)到專(zhuan)(zhuan)車會(hui)員(yuan)(yuan)權(quan)益(yi)帶來(lai)的益(yi)處(chu)，促進新(xin)用(yong)戶(hu)發(fa)單(dan)成為專(zhuan)(zhuan)車會(hui)員(yuan)(yuan)。而專(zhuan)(zhuan)車的高頻(pin)老(lao)用(yong)戶(hu)通過增(zeng)加權(quan)益(yi)的告知(zhi)(zhi)讓他們清晰的知(zhi)(zhi)道會(hui)員(yuan)(yuan)所帶來(lai)的權(quan)益(yi)服務(wu)好(hao)在哪里。

一期會員問題

一期會員(yuan)主要針對會員(yuan)關(guan)鍵頁面(mian)進(jin)行優(you)化，其中包含會員(yuan)卡片入口頁、會員(yuan)詳情(qing)頁.我們(men)將(jiang)核心頁面(mian)的問(wen)題進(jin)行了梳(shu)理(li)，希望在二期設計上進(jin)行改善，其中包含用(yong)戶(hu)感知層(ceng)面(mian)和信息結構層(ceng)面(mian)

用戶感(gan)知層面問題(ti)

1、信(xin)息入(ru)口頁并沒有(you)傳(chuan)遞給用戶會員的概念，在設計上用戶沒有(you)明顯感(gan)知。

2、根(gen)據數(shu)據統(tong)計普通用戶(hu)占絕大多數(shu)，上滑到信息入口頁(ye)時，發(fa)現 10 個權益全部(bu)是失效狀態，沒(mei)有傳達(da)給用戶(hu)如何(he)升級，以及升級之后(hou)將帶來哪些增值(zhi)服(fu)務，普通用戶(hu)參與感低，造成(cheng)無(wu)再(zai)次拉起動作。

信息(xi)結構層(ceng)面

1、信息結(jie)構(gou)及(ji)入口(kou)較為分(fen)散且重(zhong)要層級未做區(qu)分(fen)，除了(le)權益(yi)功能介紹(shao)還有兩個主要入口(kou)，分(fen)別是里程兌換(huan)和會(hui)員(yuan)詳情(qing)，兩個入口(kou)的點擊量基本相(xiang)同，里程兌換(huan)目前只推出了(le)CIP快(kuai)速服務，用(yong)戶點擊進去兌換(huan)率(lv)過(guo)低，我(wo)們(men)希望用(yong)戶更多關注(zhu)的是會(hui)員(yuan)權益(yi).權益(yi)頁(ye)會(hui)給用(yong)戶帶(dai)來更大(da)的收益(yi)。

2、會員(yuan)(yuan)詳情頁在(zai)信息(xi)上整體并不吸(xi)引(yin)用(yong)戶(hu)，用(yong)戶(hu)感(gan)知不到當(dang)前等級(ji)以(yi)及(ji)各等級(ji)的會員(yuan)(yuan)都有(you)哪些權益(yi)。只從會員(yuan)(yuan)卡片入口頁的權益(yi)點擊(ji)進入成本(ben)太高，且沒(mei)有(you)對比性(xing)，感(gan)知不到高級(ji)會員(yuan)(yuan)的收益(yi)在(zai)哪里。

二(er)期會員設計目標

通過會員一(yi)期的(de)用戶反(fan)饋（微(wei)博、公眾(zhong)號、用戶訪問）及數據分析(xi)在設計(ji)上我(wo)們希望通過會員概(gai)念、優(you)化(hua)信息這 2 個關鍵點(dian)進行二期設計(ji)的(de)主要目標(biao)方向(xiang)。

希望通(tong)過更(geng)合理的(de)(de)交互，會員信息(xi)的(de)(de)梳(shu)理優化把更(geng)為核心的(de)(de)內容(rong)展示給用(yong)戶并且(qie)讓用(yong)戶感知與個人相關的(de)(de)會員身(shen)份和品質.通(tong)過有(you)效的(de)(de)信息(xi)讓用(yong)戶得到更(geng)大的(de)(de)收益。從(cong)而發揮出(chu)專車會員的(de)(de)價(jia)值。

會(hui)員概(gai)念(nian)上(shang)，我們希望(wang)用戶(hu)能在最短的(de)流程(cheng)里(li)對(dui)專車(che)會(hui)員概(gai)念(nian)有快速(su)的(de)感知，以及(ji)(ji)每(mei)一等級(ji)所對(dui)應的(de)權(quan)益(yi)，需要將這個概(gai)念(nian)在視覺層(ceng)面上(shang)強調出來，目的(de)是為(wei)了讓用戶(hu)清(qing)晰(xi)的(de)知道每(mei)一會(hui)員等級(ji)對(dui)應的(de)權(quan)益(yi)以及(ji)(ji)下一等級(ji)對(dui)應的(de)權(quan)益(yi)。

優化(hua)信(xin)息上(shang)，我們希(xi)望用戶在(zai)有限的時間里可(ke)以將注意(yi)力更(geng)集中在(zai)專車(che)會(hui)員想體現的信(xin)息上(shang)。

會員(yuan)信息入(ru)口頁(ye)優化

在會(hui)員二期的(de)設計(ji)上，我們加入了情感化(hua)思考(kao)，希(xi)望能夠(gou)在視覺(jue)傳達(da)上抓(zhua)住用(yong)戶注(zhu)意力，使(shi)其有(you)情緒化(hua)反映，首先用(yong)戶拉(la)起(qi)首頁控件先傳達(da)給用(yong)戶一(yi)張會(hui)員卡的(de)概念，再通過會(hui)員卡不(bu)同(tong)(tong)的(de)等級(ji)對應不(bu)同(tong)(tong)顏(yan)色的(de)卡片和權益，讓用(yong)戶感知到目前的(de)等級(ji)及擁有(you)的(de)權益。

據視覺研究報告的數據可(ke)知(zhi)，人類(lei)對(dui)(dui)事(shi)物(wu)的辨認首先(xian)是(shi)色(se)彩(cai)感(gan)(gan)覺，其(qi)次(ci)才(cai)是(shi)對(dui)(dui)形的辨認.比如(ru)在(zai)最初接觸的 20 秒內(nei)，對(dui)(dui)色(se)彩(cai)的感(gan)(gan)受度(du)為80%左右，形體感(gan)(gan)受度(du)僅為20%；在(zai) 20 秒至 3 分鐘內(nei)，色(se)彩(cai)感(gan)(gan)遞減(jian)為60%，形體感(gan)(gan)遞增為40%由此可(ke)見色(se)彩(cai)的感(gan)(gan)知(zhi)力是(shi)非常強的。「摘自(zi)AUX設計團隊」

 這里我們主要(yao)針(zhen)對(dui)一(yi)期的設計優化了如(ru)下幾點問題：

用戶感(gan)知(zhi)層面

1、加入了會員(yuan)卡片(pian)的(de)概念(nian)，讓用戶通過視覺(jue)感知到會員(yuan)卡所包含(han)的(de)會員(yuan)權益(yi)。

2、普通(tong)用(yong)戶占絕大多數，因此我們在(zai)設計普通(tong)用(yong)戶的(de)(de)(de)卡片的(de)(de)(de)時候沒有做(zuo)的(de)(de)(de)樣式(shi)看(kan)著好(hao)像(xiang)失效，而是讓卡片稍微有一些質感，以及還差多少(shao)公里(li)可以成為會(hui)員(yuan)，成為會(hui)員(yuan)后可以享受(shou)到(dao)的(de)(de)(de)權益全(quan)部展示了出來，通(tong)過(guo)最(zui)少(shao)的(de)(de)(de)信息量讓用(yong)戶在(zai)最(zui)開始就可以快速的(de)(de)(de)有一個整體的(de)(de)(de)認識(shi)，而不是需要再通(tong)過(guo)點擊(ji)去(qu)找去(qu)看(kan)。

3、我們將(jiang)不(bu)同級別對(dui)應(ying)的卡(ka)片(pian)及icon都單獨做(zuo)了設計，讓(rang)用戶(hu)首(shou)先在升(sheng)級上有明顯感知，其次做(zuo)了樣式的區分及權益的鎖定解(jie)鎖狀態(tai)刺(ci)激用戶(hu)去升(sheng)級以(yi)及有預期下一等(deng)級對(dui)應(ying)的權益。

4、為了讓用戶與平(ping)臺會員中心(xin)區分，在(zai)專車(che)會員沒有會員品牌的時候加入專車(che)logo，讓用戶有感知這(zhe)個是專車(che)獨有會員。

信息結構層面

1、權益(yi)欄最多只展(zhan)示 5 個權益(yi)，所(suo)以(yi)這里只放出(chu) 5 個核心權益(yi)，用戶未獲得(de)的(de)(de)權益(yi)通過一把(ba)鎖的(de)(de)狀(zhuang)態展(zhan)示，既解決了可以(yi)查看下一會員所(suo)能(neng)帶來(lai)的(de)(de)權益(yi)又可以(yi)補充信息統一的(de)(de)完整性。

2、將會(hui)(hui)員(yuan)詳情與里程兌換(huan)的入(ru)口全部放(fang)入(ru)會(hui)(hui)員(yuan)詳情里，讓用戶點進去首先看(kan)到(dao)會(hui)(hui)員(yuan)及權益詳細，重(zhong)點信息優先展示 。

會員詳(xiang)情(qing)頁優化(hua)

會(hui)員(yuan)(yuan)詳情(qing)頁上，我們優(you)化了(le)會(hui)員(yuan)(yuan)卡(ka)對應的(de)(de)會(hui)員(yuan)(yuan)權(quan)益，左右(you)滑動可以看到(dao)每一等級(ji)對應的(de)(de)權(quan)益，讓用戶可以比較(jiao)直觀的(de)(de)感受到(dao)專車(che)會(hui)員(yuan)(yuan)不同等級(ji)所(suo)帶來的(de)(de)增值服務。在框架上，我們做成了(le)feed流的(de)(de)樣(yang)式.這(zhe)樣(yang)方便會(hui)員(yuan)(yuan)后(hou)期的(de)(de)擴(kuo)展。

用戶感知(zhi)層面

1、信息整體優化，將最(zui)重要的會(hui)員卡(ka)對應(ying)到會(hui)員權益，讓用(yong)戶最(zui)先看到核(he)心會(hui)員權益。

2、增加了當前級(ji)別對應的權益(yi)(yi)，向右滑動可看(kan)到下(xia)一(yi)等級(ji)所擁有的權益(yi)(yi)，讓(rang)用(yong)戶有預(yu)期每一(yi)等級(ji)所能獲得的權益(yi)(yi)。

信(xin)息結(jie)構扁平化(hua)

1、將有(you)效信息前置，信息層(ceng)級扁平處(chu)理，用顏色(se)和模塊區分信息強(qiang)弱。

2、頁(ye)面信息(xi)架(jia)構以卡片(pian)來區隔(ge)，后期方便以卡片(pian)的(de)形式擴展(zhan)。

二期會員(yuan)上線之后(hou)

多數(shu)用戶(hu)反饋專車會員整體品質感提升。

數據統計(ji)上(shang)拉會員(yuan)卡(ka)片數據基(ji)本持平(ping)，會員(yuan)信息(xi)入(ru)(ru)口頁的點擊之(zhi)前(qian)兩個(ge)按鈕(niu)(niu)（會員(yuan)詳情、里(li)(li)程(cheng)(cheng)兌換(huan)(huan)）共同的點擊和二(er)期一個(ge)按鈕(niu)(niu)（里(li)(li)程(cheng)(cheng)兌換(huan)(huan)）基(ji)本持平(ping)， 2 期卡(ka)片點擊增加(jia)5%，數據上(shang)升不(bu)明顯，但其實收(shou)益非常大，因(yin)為之(zhi)前(qian)的點擊是分(fen)給兩個(ge)入(ru)(ru)口且(qie)有一半(ban)的用戶是到(dao)里(li)(li)程(cheng)(cheng)兌換(huan)(huan)里(li)(li)，進入(ru)(ru)之(zhi)后并沒有什么轉化。
寫在最后

在(zai)會員一期上(shang)線之后(hou)(hou)，我們(men)發(fa)現了(le)一些(xie)設(she)計問題但(dan)已經來(lai)不(bu)及修改，團隊復盤了(le)整個一期的(de)設(she)計，我們(men)總結了(le)如下(xia)幾點會在(zai)以后(hou)(hou)的(de)項目中注意(yi)，這里也分(fen)享出來(lai)希望對大家有所幫助：

1、在設計(ji)(ji)內(nei)部多人協同辦公的(de)時候(hou)，或是項目(mu)(mu)交接的(de)時候(hou)，能夠(gou)有(you)完成(cheng)的(de)設計(ji)(ji)文(wen)(wen)檔，包(bao)含(han)整體(ti)的(de)設計(ji)(ji)源文(wen)(wen)件(jian)，項目(mu)(mu)背(bei)景(jing)，目(mu)(mu)標，設計(ji)(ji)方案。

2、制定(ding)設計owner，定(ding)目標，追過程，拿結果(guo)。主動(dong)跟(gen)進推動(dong)項(xiang)目的落地，對結果(guo)負責。

3、在項目的關(guan)(guan)鍵節點上(shang)（交互(hu)最終方(fang)(fang)案與(yu)視覺最終方(fang)(fang)案）有郵件同步，周知組內設(she)計人員(yuan)與(yu)關(guan)(guan)鍵產品相關(guan)(guan)人員(yuan)。

4、建(jian)立(li)評審(shen)機制(zhi)，根據項(xiang)目(mu)大小(xiao)(xiao)建(jian)立(li)設(she)計內部(bu)項(xiang)目(mu)評審(shen)與小(xiao)(xiao)范圍可用性測試(shi)收(shou)集意(yi)見反饋.由(you)項(xiang)目(mu)owner主動(dong)發起。

在滴滴，設(she)計師對接需(xu)求時，更多的是(shi)使用敏捷開(kai)發模式，深入參與(yu)到產品當中與(yu)不同需(xu)求方(fang)共(gong)同討論需(xu)求，對比傳統的瀑布(bu)流模式，這樣會幫助設(she)計師更好的去了解需(xu)求，關注數(shu)據與(yu)目標，與(yu)需(xu)求方(fang)達成一致(zhi)，并嚴格把控設(she)計方(fang)案的產出(chu)是(shi)否合理(li)。

來(lai)專車一年的(de)時間了(le)，在這里感受成(cheng)長最多的(de)就是設計(ji)目標與數據的(de)結合(he)，設計(ji)師在業(ye)(ye)(ye)務(wu)線能為業(ye)(ye)(ye)務(wu)方提供的(de)價值，設計(ji)因素占到的(de)一定比例(li)。抓住設計(ji)關鍵點幫助業(ye)(ye)(ye)務(wu)數據有所提升(sheng)。