背景

順豐速運 APP 圍繞寄件生活場景，為用戶提供寄快遞、查包裹、查運費、網點服務等一站式快遞物流服務。

隨著 2021 年業務發展和內容豐富，用戶對產品體驗有著更高的訴求。基于用戶聲音及產品目標，從體驗設計緯度定位出現有界面風格陳舊、操作體驗不統一、品牌感知弱等問題，因此我們對順豐速運 APP 進行全新設計升級。

接下來，我們將此次改版的內容以及設計上的思考拿出來與大家一起分享，感興趣的小伙伴可以前往應用市場下載「順豐速運 APP」進行體驗哦。

前期分析

通過數據分析、用戶聲音、體驗自查、競品分析、行業設計趨勢分析，存在以下幾個問題：

1. 產品特色不夠明顯，與競品拉不開差異，核心功能體驗路徑冗長且復雜
2. 視覺風格近一年沒有更新迭代
3. 品牌感知弱，缺乏情感化傳達

1. 設定設計目標

針對現有問題，最終確定設計目標為提升順豐速運 APP 的視覺美觀度、操作易用性及品牌辨識度，強化產品的核心競爭力。實現這一目標我們提取三個關鍵詞：

「美觀 - 全新視覺升級」

從界面布局、色彩、圖標、字體等進行全新視覺體驗升級，讓用戶感受到更好的視覺體驗

「多元 - 更豐富的服務體驗」

針對日益增加的多樣化需求，設計上從多元工具整合和自定義設置兩個角度出發，進行多元化服務設計探索

「高效 - 服務高效性」

強化信息層級展示，提高用戶查找信息效率

2. 全新視覺

現有視覺風格滿足不了年輕用戶群體的審美訴求，新舊版本交替導致視覺界面體驗不一致。伴隨著產品服務體驗不斷升級，視覺風格也亟需進行升級。本次視覺升級圍繞顏色年輕化、極簡化布局、字體規范化、圖標親和力、情感化傳達進行展開。

色彩年輕化

黑紅作為順豐的品牌色，升級后持續強化品牌感知；同時在明度和飽和度做了優化，相比之前得沉悶，優化后整體更加活潑與透氣。中性色作為貫穿整個產品的顏色，進行了規范化定制 ，讓 APP 整體視覺更統一成體系。

極簡化布局

舊版本頁面邊距較小，呼吸感較差，內容層級不清晰。從產品的信息展示效率上考慮突出重要信息和功能，因此對承載內容的容器——信息卡片的樣式和內容布局進行了結構化設計，使之可以較好地聚合各類信息，更加有利于信息流內容的清晰展現。

圓形在人的視覺過程中更容易被認知，給人一種柔軟治愈的感受，圓角的合理運用對容器來講，會突顯矩形內的內容，將用戶的視線聚焦在內容本身。兩個圓角矩形排列時更容易區分內容歸屬，模塊化更強。

字體

規范字體的運用 ，為整體視覺風格一致性打好基礎提升產品體驗。

圖標

• 識別性：顏色采用順豐的品牌色黑紅，運用了疊加撞色的手法，打造獨特的視覺語言，同時強化信息層級
• 功能性：通過設計上手法進行區分，例如：圖標線性的表現形式
• 一致性：采用圓角，結合圓潤視覺語言，統一視覺風格
• 美觀性：整體視覺風格更加年輕，活潑

底部導航欄圖標

在圖標微動效設計上貼合圖形的意義，增加彈動效果，讓用戶在切換時感知狀態的變化。

想學更多的圖標動效：

情感化

在空狀態設計上融入了品牌 IP 小哥設計元素，通過小哥趣味化的動作延展進行微動效設計，緩解用戶情緒焦慮的同時提升產品的辨識度，傳達品牌溫度。

應用場景

1. 首頁

舊版分析：功能僅滿足用戶基本使用，但也限制了用戶差異化和個性化訴求，同時，現有的產品框架匹配不了日益增長的業務和不斷擴充的內容。

優化策略：圍繞順豐寄件生活場景，為用戶提供順豐生活、消息通知、微服務聚合、休閑娛樂等內容，提供更為人性化的服務和內容。讓順豐的用戶在寄查收之外，享受更多便利的服務，例如：跑腿、搬家、上門回收、手機維修等。

從 6 月份全新改版以來，通過對首頁不斷的優化和迭代，打磨體驗細節和設計細節，首頁使用率提升 143%，人均訪問頻次提升 9.8%

2. 運單詳情頁

舊版分析：

• 頁面信息層級多，核心功能不夠突出，影響用戶的信息閱讀效率；同時產品不斷疊加的功能，地圖區域被侵占的現象越來越嚴重，頁面顯得臃腫。
• 在特殊天氣場景下，容易出現物流運輸或配送延遲的問題。此時用戶情緒會感到煩躁和生氣，他們輕則進行快件催單、投訴，重則去微博等公眾平臺發表負面言論。特殊天氣這類不可控因素給用戶和產品帶來極大的負面影響。

優化策略：

• 優化信息層級，視覺信息降噪

合理優化信息層級關系，通過刪減、組合、隱藏次要信息，對關鍵信息進行有效曝光，例如路由、狀態，同時打通了沉浸式頭部，有效利用頭部空間并且讓視覺更通透。

• 良好的情緒牽引，營造情感氛圍

通過實時動態展示天氣形態，營造真實有效的情感環境，進而降低用戶消極情緒；并且對路由圖標進行趣味化、情感化的設計，產生與用戶情感共鳴的目的。

設計上線后從監測數據看，客戶投訴降低了 105%。

注：類似的設計在餓了么上也有體現：

3. 寄快遞頁

舊版分析：

• 寄件功能和服務平鋪羅列，呈現方式單一，無內容上的側重。在面臨產品規劃更多業務場景和內容時，現有的布局和展示方式承載能力有限。同時，港澳臺寄件、國際寄件屬于順豐重要的寄件業務場景，需要曝光給更多用戶
• 作為寄件功能聚合頁場景，業務缺乏與用戶下單行為的關聯和情感關聯

優化策略：

• 基于三大業務場景：寄內地、寄港澳臺、寄國際，細分出不同寄件方式及服務，例如國內寄件提供生鮮寄、微友寄、公益寄件等細分領域的寄件類型；寄港澳臺、國際件提供用戶高頻關注的寄件問題等
• 與用戶下單行為強關聯上，將寄件滿贈任務入口前置出來，讓用戶可以了解到自己寄了多少票可以獲得多少返利，獲得的返利進一步刺激用戶下單決策；與用戶的情感關聯上，針對特色寄件功能做順豐特色業務卡片設計，吸引用戶點擊

對比舊版本，寄件頁使用率提升 25.5%

4.下單頁

舊版分析：下單頁作為高頻使用場景，用戶填寫相關寄件信息才能下單，隨著添加的服務不斷增多用戶經常需要再次確認寄收人信息，并且幫助用戶做決策的優惠信息因保價過長導致用戶經常會看不到。

優化策略：根據用戶任務的進程采用漸進式呈現信息原則，預判用戶行為提供內容展示。

例如用戶沒有添加寄收人信息時下方增值服務和優惠信息隱藏，當用戶選擇物品信息往下滑時寄收人信息折疊顯示至標題欄，方便用戶實時預覽。另外，優化保價模塊，將固定分段保價進行左右布局，減少高度占比，曝光下方的優惠信息。

對比舊版本，下單成功率提升 102%

5. 我的

舊版分析：

• 各功能入口主次區分不明確，對于用戶關注的核心功能不夠突出，同時跟會員用戶強關聯的權益及服務曝光少、隱藏深，用戶可參與的內容不多
• 頁面的展示內容?過于靜態，頁面顯得單調

優化策略：

• 對各功能入口和信息進行業務屬性劃分，并根據用戶行為習慣和內容的重要性進行排序。聚焦用戶關注的核心功能，例如我的積分、優惠券；強化用戶對權益的感知，豐富權益兌換內容，增加留存相關的任務曝光，從而提升用戶粘性和留存
• 背景做了紅白的微磨砂設計處理，提升頁面質感；同時，從品牌 Logo 上提取設計元素對 SVIP 進行了標識設計，提升用戶的尊享感和記憶點。

相較于舊版，“我的”頁面使用率提升至 56.5%

設計沉淀

在設計的過程中，我們基于 Figma 設計軟件，搭建了一套順豐速運線上渠道產品設計組件，并相應的制定了設計規范。方便協同辦公提升效能的同時保證全渠道體驗一致性。

此次順豐速運 APP 全新升級受到了用戶的喜愛、獲得廣泛好評。經調研結果顯示，用戶整體評價比較高，將順豐 APP 推薦給好友意愿程度較高。

結語

作為設計師的我們，起步于此，但不會止步于此。產品的「用戶體驗」是一個不斷推進和提升的過程，這過程需要良好的團隊協作，擁有不斷發現問題及解決問題的設計思維能力。同時需要設計師實時監測數據，關注用戶聲音，打磨設計細節和體驗細節，給用戶帶來更好的產品體驗，并能夠賦能業務增長，創造更多價值。