從15年5?成?曹操專車至今，產(chǎn)品經(jīng)歷了多次的迭代優(yōu)化，從單一的打車業(yè)務(wù)擴展至全方位多元化的出行產(chǎn)品和服務(wù)，產(chǎn)品布局上涵蓋從出行、旅游到本地生活的多個領(lǐng)域。這次的 APP 4.0版本除了打造平臺化體系建設(shè)之外，也是一次整體品牌升級。網(wǎng)約車市場競爭日趨激烈，面對用戶固有習(xí)慣和同質(zhì)化產(chǎn)品，如何去打破并發(fā)揮優(yōu)勢為產(chǎn)品提升卓有成效的用戶體驗，這是我們面臨的挑戰(zhàn)，也是曹操設(shè)計團隊探索推進出行平臺生態(tài)體驗創(chuàng)新的一個過程。

設(shè)計思考

1. 業(yè)務(wù)訴求

隨著業(yè)務(wù)的快速發(fā)展及用戶體量的增長，現(xiàn)有的功能和框架已不能承載平臺化業(yè)務(wù)發(fā)展，單一卡片式的展現(xiàn)形式限制了內(nèi)容與運營配置的空間，面對越來越多的業(yè)務(wù)場景需要展示和營銷推廣資源的拓展，需要更合理的平臺化服務(wù)體系和更高效的空間利用。

2. 用戶訴求

通過問卷調(diào)研，用戶訪談，各渠道反饋及數(shù)據(jù)方面的分析梳理，也通過用車體驗地圖來挖掘用戶深度需求，以便我們重新定義設(shè)計需求和找到設(shè)計切入方向。

3. 體驗升級

一切為了更好的開始，為乘客提供全鏈路的出行服務(wù)，讓每一次出行變得更安全更省心，與用戶建立可信賴的品牌信任度。在用戶側(cè)，通過用戶體驗地圖梳理用戶在服務(wù)流程中的行為和體驗，從出行前、派單等待、行程中到行程結(jié)束的全流程物理接觸點和情感接觸點提升用車體驗。

交互上精簡專車核心流程的非必要操作，在框架上打造新業(yè)務(wù)場景獨立性的同時統(tǒng)一體驗，降低用戶認(rèn)知負(fù)荷和操作成本；視覺上采用輕量化的設(shè)計語言，對功能模塊進行分類、展示信息分層，通過靈活可適配的組件打造視覺的一致性和延展性；品牌上延續(xù)綠色出行理念，通過更多情感化的設(shè)計，圍繞產(chǎn)品、運營在線上線下場景中的構(gòu)建與傳達，建立愉悅的情感關(guān)系，與用戶產(chǎn)生更多的共鳴。

4. 設(shè)計目標(biāo)

方案的演進

1. 拓展業(yè)務(wù)的能力 – 搭建可持續(xù)的框架

拓展?fàn)I銷多樣化配置

首頁架構(gòu)分為上中下布局，由頭部 title bar 展示業(yè)務(wù)線，中間地圖顯示位置及車輛信息的信息區(qū)，和底部用車功能操作區(qū)組成。為了增加更多功能露出及運營資源，需要在固有及有序的結(jié)構(gòu)中尋求差異化的表現(xiàn)方式，通過系列位置效應(yīng)理論的應(yīng)用，最大化匹配用戶瀏覽路徑，用活卡片并對其解耦，我們在原來的用車卡片上演進出了上滑展示更多的方式來提升瀏覽空間。承載內(nèi)容多樣性的同時運營內(nèi)容可后臺配置，不需要 app 推送更新，在靈活性及時效性上得到了保障，更好地提升模塊坪效，也為后續(xù)拓展提供了更多的可能。

拓展更多功能入口

功能列表本身支持上下滑動，為了打破一屏可展示內(nèi)容的局限，以及賦予各功能更多親和力，采用了宮格的布局方式，向上推動可滑動功能區(qū)域，折疊頭部頭像區(qū)域的顯示，展示更多的功能入口，方便用戶選擇和滿足不同業(yè)務(wù)的更優(yōu)展示。

適應(yīng)更多用車場景

用車場景新增加了多終點用車功能，拓寬用戶用車場景，不再依賴于線下和司機溝通指路，解決用戶一接多送的需求的同時有效避免路線相關(guān)費用的投訴。

4.0版本的地址起終點使用了一行展示效果，在閱讀性上，信息閱讀更流暢，展示更簡潔。但也帶來了另一個挑戰(zhàn)，氣泡會超出屏幕外和氣泡之間的重疊。為了保證長度不超過屏幕外，我們制定了一系列規(guī)則，氣泡會根據(jù)屏幕判斷顯示在定位點到上下左右位置，以及定位點相近的氣泡重疊也制定了相應(yīng)的規(guī)則翻轉(zhuǎn)，保證有效內(nèi)容的完整顯示。

底部卡片信息重組，調(diào)整了卡片信息的展示優(yōu)先層級，使用 tab 切換的形式將多車型和價格優(yōu)惠信息展示出來，增強用戶打車意愿，另將活動營銷信息與用車信息區(qū)別放置，信息分區(qū)更明確。

2. 提升用車效率 – 服務(wù)體驗優(yōu)化

服務(wù)提升，平衡需求與運力

排隊等候：當(dāng)早晚高峰及用車區(qū)域供需緊張時，用戶等候時間較長。把當(dāng)前排隊信息展示給用戶，讓用戶知曉當(dāng)前派車狀況，緩解等待焦慮感，提高成單率。

付費調(diào)度：排隊無法滿足運力的情況下提供服務(wù)升級遠(yuǎn)程調(diào)度，給用戶更多用車方式的選擇，滿足用戶時效性的同時提高平臺的成單率，合理調(diào)度平臺有效運力。

優(yōu)化信息結(jié)構(gòu)，提升支付效率

3. 品牌強化?– 塑造可靠性與親和力

品牌延續(xù)，強化認(rèn)知

結(jié)合曹操出行新能源、環(huán)保節(jié)能的產(chǎn)品特點，沿用了「品牌綠」，并通過情感化插圖、動效等方式來強化用戶認(rèn)知。

字體/色彩/圖標(biāo)

色彩體系上延續(xù)綠色出行低碳環(huán)保調(diào)性，突出強化品牌色，減少配色提升專注度。降低字體類型數(shù)量，強化排版設(shè)計讓信息更快觸達。圖標(biāo)扁平易識別，側(cè)重體現(xiàn)親和力。

插圖

定義插圖設(shè)計原則：視覺識別性、全局統(tǒng)一性、體驗趣味性。

目前插圖采用主體元素（視覺識別性）+小人場景（趣味性）+輔助元素（全局統(tǒng)一性），來做統(tǒng)一的情感化插畫，給用戶傳達當(dāng)前頁面的狀態(tài)之后，引導(dǎo)用戶的正向操作。

根據(jù)設(shè)計規(guī)則，設(shè)計延展出一系列缺省頁插圖。

引導(dǎo)頁：通過插畫形式、場景化搭建來表達設(shè)計意圖，為品牌塑造個性、彰顯獨特性。加強氛圍及新用戶的代入感，拉近用戶距離并提升用戶愉悅度。

情感化動效

用戶使用產(chǎn)品，可預(yù)期、可控制的感知往往帶來正向的體驗，并且促進用戶進行完整的操作。正向的情感也會使用戶更樂于使用產(chǎn)品，遇到使用過程的一些小問題也更加包容。主要從可控的感受、積極的反饋、貼心的提醒、情境的烘托4個維度進行設(shè)計落地。

曹操出行官方網(wǎng)站：除了客戶端以外，在其它場景的設(shè)計，也遵循統(tǒng)一的視覺表現(xiàn)形式。

定義助力高效協(xié)同的設(shè)計原則

在設(shè)計過程中，對于很多固化的流程不會頻繁變動，我們從交互層面整理了控件庫，然后視覺將控件庫標(biāo)準(zhǔn)化，最終幫助前端開發(fā)將標(biāo)準(zhǔn)的控件代碼化。通過這樣的體系搭建，模塊控件化依據(jù)規(guī)范，迭代優(yōu)化方案就可以快速的調(diào)用控件搭建起產(chǎn)品頁面；視覺樣式上對親和力的表達，卡片的圓角、漸變明度飽和度的提升等核心元素進行統(tǒng)一規(guī)范，最大程度降低設(shè)計成本，有效釋放人力資源并提高團隊的整體設(shè)計效率。

1. 定義設(shè)計原則，助力高效協(xié)同

2. 組件化搭建

3. 組件化落地

結(jié)語

過去的2018年對網(wǎng)約車市場來說是極具挑戰(zhàn)的一年，也是技術(shù)和服務(wù)實現(xiàn)飛越的一年，面對用戶日益增長的個性化出行需求，我們積極響應(yīng)，為用戶的安全出行創(chuàng)造最佳的體驗。在這個過程中我們的設(shè)計團隊也從0到1，由陌生到默契，攜手朝著同一個方向努力，感謝這個過程中參與的每一位伙伴及給予我們幫助的用戶，使得我們的 APP 越來越好。

原文作者：曹操出行CDC? https://www.zcool.com.cn/article/ZOTA4ODUy.html