PMCAFF（www.pmcaff.com）：互聯網產品社區，是百度，騰訊，阿里等產品經理的學習交流平臺。定期出品深度產品觀察，互聯產品研究首選。

外包大師（www.waibaodashi.com）：要外包，找大師。PMCAFF旗下高質量互聯網外包解決方案提供商。外包大師服務號：waibaodashi365

作者：滴滴出行CDX團隊 微信號：diditaxiued

編者按：

滴滴在競爭激烈的中國網約車市場取得勝利之后業務發展的十分迅速，從出租車業務已經拓展到了快車、專車、順風車、代駕等多項業務，駕車司機作為供需關系中重要的一端一直是滴滴的重點服務對象，產品上滴滴陸續上線了出租車司機端、專車/快車的司機端等多版司機端，不同客戶端的同時運營也給產品的設計帶來了不小的挑戰。

如何統一產品的風格體驗、用戶認知以及靈活適配各個業務的車主端是滴滴設計團隊一直在探索的。本文是在滴滴車主端5.0大版本更新之后其設計團隊對「工具與情懷」的再一次探討，如果你也想一同了解如何讓用戶通過產品更簡單更直觀的觸達服務，本文值得一讀。

設計之前

司機端5.0框架

合而為一????

隨著業務的快速發展，滴滴從最初的出租車業務快速拓展到快車、專車、順風車、代駕等多項業務，與之相應的我們陸續上線了出租車司機端、專/快車的司機端等。

多版司機端同時運營，即是人力物力和效率的消耗，在體驗上也存在風格難以統一，認知不一致等問題。一版體驗統一、統籌且靈活適配各個業務的車主端呼之欲出。

在設計之始我們梳理了每一條業務的功能點及發展訴求，將之重新整理，從中提煉共性，對比差異點，確保后期方案的兼容和擴展性，我們知道司機的服務主流程在各個業務是具有共性的，但對于聽單、支付等部分環節存在業務差異性。

因此，我們把「合而為一，合而不同」作為本次設計升級重要命題。

了解用戶??

相較于其他的工具類應用，滴滴司機在人群上更趨于集中：男性居多，7成的司機年齡在30-45歲之間，超過兩成的司機年齡超過45歲；

他們在加入滴滴之前，主要從事自由職業或普通個體戶等門檻相對較低收入不穩定的工作，成為滴滴司機主要為了增加收入、時間自由同時期待被認可；

這些人當中有很大一部分是帶車加入，作為私家車車主，司機端為其提供了接單賺錢的平臺，而車后服務尚沒有很好解決。

用戶畫像

司機 VS 車主

基于以上的分析，我們迫切需要思考跳出現有產品之外的用戶所具有的多重屬性：

• 接單工作

• 車生活服務

1、接單工作：基礎（主動）屬性，也是用戶的核心訴求

2、車生活服務：被動屬性，用戶帶車加入滴滴平臺，除了借平臺之力通過提供自身的資源和服務獲取相應的報酬，作為車主的他們會更加頻繁的產生車后市場及相關的服務訴求，如：加油、車輛保養、維修等。

從”司機”到“車主”的轉變，既是業務上的擴展，更是設計者對用戶及產品定義的認知更新。

當我們更加立體的去面對用戶，那么一個更加真實的用戶便呈現在設計師的面前。

用戶身份從“司機”向“車主”轉變

方案設計

結合上文的用戶分析，加之車主端的使用場景多為車內移動環境，不確定性和干擾因素較多，我們定義了本次設計的關鍵詞：簡單、高效、成就感。

設計關鍵詞

簡單：應用在復雜環境下的信息傳達應盡量明確直白，避免產生歧義，避免多余的思考

高效：體驗驅動效率提升，通過線上明確的信息引導與有效的操作促使高效品質的線下服務

成就感：任務完成、收入進賬、得到獎勵等貫穿全流程的節點細節設計突出用戶成就感，在情感上的觸達用戶

圍繞以上關鍵詞，在整個設計過程我們一直會堅持「所觀即所需，所觸即所達」的理念。

連接線上線下的交互行為設計

在交互框架設計過程中，我們梳理出三個需要解決的問題：

• 多業務融合與保持業務場景獨立性

• 舊版司機端的用戶到新版車主端的遷移成本以及新用戶的上手成本

• 如何清晰引導用戶在復雜場景及復雜任務下的無障礙使用

回答以上問題，我們總結出了三條設計思路：

• 穩定的框架流程+靈活可適配業務和場景的組件??

• 適應車內場景的信息展現和信息操作結構（信息分層），以及貫穿流程的結構一致性

• 以聽為主

設計方向

一、框架與組件

在前期的分析中我們提到快車、出租車、專車等業務在主任務流程上趨于一致，都可歸納為出車——聽單中——接單——去接乘客——接到乘客——行程中——行程結束這樣的線性流程。

僅在部分流程節點上存在業務差異，如：接單環節快車存在搶單、指派、極速訂單多個類型，而專車則對訂單服務要求有特殊需求；再如行程結束后的專車快車是線上支付，而出租車則是既可線上支付也可現金支付。

因此，我們定義頁面框架時強調線性流程的一致性，對于流程節點的差異性則通過不同的組件來滿足。

組件與框架

將應用比作一個四維空間：每一個頁面是一個層級清晰的三維結構，步驟流則是第四維度。

頁面層級

二、結構穩定、信息分層

車主端主流程具有主線性少分支的特點，因此在每一個節點都可提取出核心操作，以穩定的結構劃分向用戶傳達統一的界面語言和交互感知。

主流程頁面歸納為統一穩定的結構

車主端的另一個特色是強管控強調度，因此信息會不斷的貫穿始末的下發給車主，其中包括來自系統推送的信息、當前的任務/管控信息、大區等渠道的運營信息等，這些信來源多樣，類別紛雜；全盤呈現必會導致用戶接受信息超載而不知所措。

基于這樣的現狀，設計師對現有信息進行打散-歸類重新整合，將信息按重要度劃分為三個等級，以三種形式的任務卡片承載司機端全部信息：模態任務卡片、非模態任務卡片、普通信息卡片。

三種任務卡片

模態全屏卡片：

最高優且不可跳過信息任務，此類信息要求車主完成當下任務后繼續其他操作。

非模態任務卡片：高優但不緊急，需要用戶第一時間注意到但可在當下跳過的信息類別。

普通信息卡片：非高優且不緊急，用戶關注時可見。

通過以上三種形式的設計可實現多來源/大信息量下的高效信息管理，但每類信息卡片依然需兼容多類型信息要求，對于這樣的單個信息組件，我們通過提煉共性、結構化處理的方式來兼容差異。

三、以聽為主

我們常說信息流，“滑動”瀏覽是這類應用里用戶常常進行的交互行為，對于車主端而言，通常的使用場景便是在行車過程中，因此“聽”便成為車主們“瀏覽”信息的一種慣用交互行為。

如何設計“聽”是設計師們必修的一課。

我們做的第一步是對全流程信息進行梳理，并對需要“聽”的節點做出標記：

以聽為主的場景

明確了語音節點后，梳理全部信息并為其歸類劃分，如：反饋、指引、消息；根據信息特性定義表達形式，如：擬聲、播報；所有語音信息都需滿足可識別性強、表意清晰的原則，對聲音的設計也是連接應用與用戶情感的紐帶。

行駛中使用聽的情況

相較于主動去“看”，“聽”是一種默認的被動的行為，可以輕松的讓用戶的耳朵聽到信息，卻難以保證用戶的大腦是否聽到了，因此，問題便進一步聚焦到如何讓用戶“聽到”。

心理學中關于引發意識需要誘因刺激，因此在重要播報前增加“誘因”音的設計可有效保障信息被獲取。

行駛中使用聽的情況

視覺呈現

一、品牌延續

在整個滴滴大的品牌基調下，滴滴車主端5.0視覺設計延續滴滴品牌整體的設計氣質，以親和、易用、科技為主要設計方向。

車主端整體界面設計，基于滴滴品牌規范以及車主端用戶的特殊屬性，最終以滴滴品牌色為色彩推導基礎，匹配具有統一色彩傾向的深灰色為輔助，構建起整體的界面設計色彩系統。

車主端在保證與主品牌氣質統一的前提下，也保持了自己設計的獨立性，這樣既保證了橫向主品牌對外展現的一致性，同時也保證了縱向產品線視覺展現的差異化，從而使車主端能夠更好地服務于公司主品牌以及自己獨立的目標用戶群體，成為滴滴產品線中即獨立又統一的一部分。

車主端5.0開屏引導圖

二、設計推演

1、界面構成

通過前期車主端用戶調研和真實的場景路測，我們發現車主在使用App期間，往往處于一種不穩定且復雜多變的使用場景下，所以針對這種典型的使用場景，車主端的界面構成主要從兩個方面去解決這個問題。

拉開功能模塊之間的視覺關系

新的車主端加強了視覺上模塊化的功能展示，讓用戶可以更快更高效的區分界面中的功能區域。同時界面也更多的使用深色背景對重要的數據信息和關鍵操作進行展示，加強信息與信息之間的視覺對比度，進而提高數據的識別性和界面在復雜環境下的通用性。

加強關鍵操作和主要信息的展示面積

新的車主端加大了整個主流程中所有的操作按鈕的視覺面積，保證車主在任何場景下都可以準確快速的做出操作，同時針對每個關鍵節點的信息重要性在視覺上做出區分，減少用戶的閱讀負擔，提高用戶的閱讀效率。

車主端5.0頁面構成

2、顏色·字體

車主端5.0整體的配色方案選擇HSB色彩模式進行色彩推演。除主品牌色以外，所有輔助色及字體配色均保持相同的色彩傾向，H(hues色相)上保持絕對統一。再根據具體的界面和應用場景，梳理出相對應的S(saturation飽和度) B(brightness明度) 的推演區間和推演規則，最終產出完整的色彩系統。

字體基于整體司機端用戶群體的特殊性，整體字號較大，字號基于4的整數倍進行推導，再根據文字的信息展示屬性進行字號區間分類，最終構建起字體規范系統。

車主端5.0色彩規范

3、圖標構成

車主端5.0圖標的設計理念是：“讓圖標像馬路標識一樣引導司機操作”在圖標前期的設計探索中我們發現，很多車主本身對陌生的圖標設計語言識別是有困難的，但是對馬路上的公共交通標識卻十分熟息，所以我們將馬路標識中：簡潔、直白、硬朗的設計特點抽離出來，融入到我們新的圖標設計當中。

讓新的圖標設計給司機一種親切熟悉的感覺，減少車主的認知學習成本，提高圖標的辨識效率，使車主快速地過渡到新的圖標系統上來。

車主端5.0ICON規范

4、動效構成

合適恰當的動效可以幫助用戶更好的理解產品邏輯提高操作使用效率，反之就會傷害整體用戶的操作體驗。因此，整體的車主端5.0動效都是圍繞以下四項基本原則展開，以此來保證整體動效的準確統一。

• 具有相同產品或交互邏輯的功能界面動效統一（保證全局動效的一致性）；

• 功能信息需要有節奏有層次的展示（提高信息的識別效率和識別準確性）；

• 動效如何發生就如何結束（保證用戶操作使用時對產品邏輯關系的清晰）；

• 每個界面不使用超過兩種及以上的動效（控制并且減少動效帶來的不必要的信息負擔）。

在對動效進行約束的同時，我們也對動效進行了性質上的劃分，從而更好地歸納總結出組件與組件，界面與界面之間的動效關系，方便大家理解運用。

車主端5.0動效規范

5、導航構成

地圖導航對于車主來說就是車主的眼睛，對車主駕駛有極大的輔助作用。這次我們也針對司機端的地圖導航做了整體的視覺的優化和升級。

局部上優化了車道線視覺以及重繪了指向性引導圖標的視覺，使整體的導航體驗更加準確流暢。

整體上優化了地圖日間效果，提高了地圖在日光下的信息展示通用性，并且新版本還增加了地圖導航的夜間模式，方便司機在夜間更加沉浸式的體驗導航服務。

車主端5.0 導航

方案測試

設計過程中及時融入方案測試可以有效的幫助設計師發現問題并調整方案。

車內環境測試：將設計demo帶入車內環境，在車內場景下自測設計可行性，如白天光照強烈要求界面顯性化且低反光，而夜間昏暗環境下界面對比清晰不刺眼。反復的將設計界面拿到車內測試得出最優方案。

場景測試

可用性測試：主流程設計完成后，我們制作典型業務主流程的可交互原型，每個業務挑選6名代表性用戶，用戶涵蓋各年齡層（30~50歲），不同手機系統（蘋果+安卓），不同使用經驗（加盟時間1個月~4年），制定并觀察他們完成任務，從中發現可用性問題并解決這些問題。

可用性測試

統一車主端即將上線，后續設計師會持續跟蹤上線后的數據反饋，用定性的數據結合定量驗證結構，小步快速持續迭代方案。

最后，我們一直認為設計師最初是讓這個世界來讀懂自己，再往后就需要引導你的用戶去理解這個世界。如何讓用戶通過我們的產品更簡單更直觀的觸達服務，是做為產品人不懈的追求。

優質內容推薦

▲點擊圖片閱讀

俞軍：為什么多數產品經理都不合格

▲點擊圖片閱讀

3個提問，500個回答，“俘獲”俞軍的姿勢有哪些？

點擊閱讀原文，獲取5000個成熟解決方案

中高端求職 & 招聘，PMCAFF人才服務最懂你

=> alice.zhang@pmcaff.com

總結

以上是生活随笔為你收集整理的滴滴司机端大更新并公布了一份设计方案！的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。