打造專屬中小物流商的司機 App

重新設計 3drens 物流司機  App,提升易用性並優化司機工作流程,成功吸引 20 多家企業客戶試用

UI/UX
B2B
設計迭代
負責項目
使用者研究、互動設計、介面設計
參與人員
設計師 1 名、產品經理 2 名、前端工程師 4 名、後端工程師 1 名
專案期間
2023 三月 - 2024 三月

我們帶來了什麼改變?

20+

我們推出最小可行產品(MVP),幫助公司成功吸引超過20家企業客戶進行試用。

3drens TMS (Transportation management system) 物流管理系統,是一款給物流車隊使用的SaaS產品,致力於協助物流業者數位轉型,提升配送效率和管理水平。在2023年初,公司獲得Pre A 輪融資,希望找到 PMF(product market fit)。
然而,在過程中遇到了一些挑戰,由於產品一開始的介面和流程是根據個別物流廠商的需求所設計,無法適用於目標市場的物流業態。因此在我接手mobile的首要任務是 優化MVP的功能,幫助公司驗證產品,並進一步找到 PMF (product market fit)。
根據合作的第三方物流商 (3PL)、跨境物流商流程所開發的第一代產品

了解使用者、產品問題

我們了解到絕大部分大型物流業者已採用客製化物流軟體,但中小型物流商大多還未數位轉型,我們假設需要到府安裝的廠商(例如: 家具、電器等)會有物流軟體的需求,因此在 PMF 驗證中鎖定了有指定配送時間需求的中小型物流商作為目標市場區隔。
我們走訪了34家物流公司,深入了解他們的痛點

根據拜訪34家物流公司所收集的數據,我們歸納出兩個關鍵洞察:

23% (8/34) 業者有與 司機溝通成本高 的問題,車行依賴 Line 群組與司機聯繫,時常會遇到問題回報不即時或資訊不同步的狀況,導致後續帳務出錯或客訴增加。

17%(6/34) 業者認為現有派車方式還有改善空間,想提升司機配送效率

我和團隊一起整理訪談資料,畫出司機的旅程地圖,讓大家對司機遇到的挑戰有一致的認識
為了了解中小型物流商平時工作痛點,我會與 BD 頻繁的去拜訪物流廠商,以更了解他們目前遇到的困難和對我們產品的想法,另外我也約訪大型物流公司的物流主管做專家訪談,以了解大型物流和中小物流的區別和他們的日常挑戰。
除了實地訪查,我也執行內部的啟發式評估、做內部易用性測試,與 PM 討論來更完善 APP 的體驗。
針對APP全功能執行啟發式評估來收集易用性問題
我持續將發現的優化方向做紀錄,並向PM提案來排進 product roadmap

擬定優化方向

經過產品團隊與 stakeholders 討論,我們根據最大的使用者痛點擬定以下兩個產品優化目標:

1.

透過優化司機 APP 的回報功能體驗,我們可以改善司機與內勤人員和收件人溝通成本高的問題,讓司機可以專注於配送工作,減少溝通出錯帶來的麻煩。

2.

透過優化司機任務操作體驗,我們可以提升配送效率,增加收件人的滿意度。

設計原則

以下是我在規劃新版本時所遵守的設計原則:

1.

視覺層級 (Hierarchy)

對於物流司機來說,資訊呈現非常重要,因此我在設計時特別注意資訊的視覺層級,讓資訊更易讀。

2.

易到達的 (Accessibility)

由於物流司機的年紀跨度較大,為了適應司機的手機字級,我特別注意排版的響應性,讓資訊在不同裝置都能清晰呈現。

3.

符合情境 (Context)

物流產業的工作流程特殊,司機也有各自的工作習慣,因此在設計過程中我會特別與司機接觸,將他們的回饋納入我的設計方案中。

此次 MVP 上線的功能

我們 scrum 團隊每兩周跑一次 sprint,作為團隊中 APP 的主要設計師,以下是我的設計產出:

符合物流情境的帳務回報體驗

新版本的帳務回報讓司機可以對金額、項目和資訊一目了然,並讓編輯行為更單純。

顯示代收金額

代收金作為最重要的資訊之一,我將他移至最上面,讓司機第一眼就能看到資訊。

簡化附加費編輯互動

附加費會因當下情況需要編輯,我獨立出新增附加費流程,讓流程單純化,資訊呈現上也更簡潔。

顯示總金額

因應附加費會和代收金統一收款,我將加總放置到最下面,與所有金額對齊,提供次要的資訊輔助。

顯示代收金額

代收金作為最重要的資訊之一,我將他移至最上面,讓司機第一眼就能看到資訊。

簡化附加費編輯互動

附加費會因當下情況需要編輯,我獨立出新增附加費流程,讓流程單純化,資訊呈現上也更簡潔。

顯示總金額

因應附加費會和代收金統一收款,我將加總放置到最下面,與所有金額對齊,提供次要的資訊輔助。

在完成配送後,司機可以在任務資訊頁看到金額紀錄。

在訪談中,我們發現有需多業者都有遇到司機忘記收款或款項金額對不上的問題,因此我們決定優化司機回報流程的帳務回報功能,以更貼近目標使用者。由前期研究得知,帳務可以細分為兩種: 1. 代收金額 2. 附加費。
代收金

貨物本身的費用

附加費

額外服務的費用 EX. 搬運費

在開發當下,由於我們不太清楚司機實際收款的情形,為了讓設計更貼近司機的需求,我決定實際去訪談司機,了解他們目前的工作習慣。我訪談了幾位我們當時物流商客戶的司機,獲得了以下寶貴的資訊:

代收金額很重要,因為後續補收很麻煩,而且有時金額會很龐大,司機對代收金都會特別謹慎。
附加費大多會到現場才和收件人確認,因為不確定顧客會需要什麼額外服務
如附加費含在運費中,會和代收金額統一收取
原有的版本沒有代收金的資訊,也無法符合現有目標司機的使用情境,因此在此次改版中,我調整回報頁面的資訊架構,並考量到司機只有在臨時情況才需要編輯金額,調整了互動方式。

清晰、彈性的司機任務卡

由於各家物流商司機需要的資訊不同,所以我們提供多種欄位供物流商填寫,導致需要顯示的資訊很多,這時資訊呈現上也變成一個難題,加上許多司機年紀偏大,需要更清楚的資訊呈現方式,因此我調整了任務卡的資訊呈現。

響應式設計

因為許多司機年紀偏大,會設定更大的字體,也為了避免多語言跑版,我將排版調整成橫式,有利於 responsive 版面伸縮。

地址和時間

透過訪談不同物流商得知,司機共同都需要的資訊為地址和時間,因此我在層級上將這兩種資訊凸顯。

資訊分組

為了避免未來資訊增減需要調整版面,,我調整了資訊群組方式,讓未來蝶代更有彈性。

由於資訊多導致讀取速度受影響,為了讓體驗銜接更好,我設計了讀取skeleton.

承接未完成的配送任務

物流司機時常會遇到客戶不在,無法成功送達的狀況,此時物流商就需要擇日再送,但不一定會由相同司機負責,因此留下紀錄就變得很重要;我們在現有的留言功能上設計了 ”繼承欄位”,讓過去的留言可以保留以利接手司機可以查看。

新增時間戳記

在現有的流程下,司機會在備註留言以利和內勤人員溝通,所以我們想到最有效率留下紀錄的方法就是維持原有欄位並留下時間戳記和留言者姓名。

簡潔的訊息通知

司機在開車時不太有機會閱讀長文字,所以訊息越簡潔越好,我重新設計了資訊呈現與文案模板,讓通知可以一目了然。

配送任務與地圖體驗結合

物流司機在安排配送路線時需要同時參考當天任務與地圖,因此我設計了排序功能,讓司機的工作能更有效率。

將排序功能獨立

我將排序功能獨立出來,因為司機只有在出發前會使用到這個功能。

半頁模式

在半頁模式,司機可以邊排序任務邊預覽結果。

全頁模式

為了讓司機更容易拖曳,我們提供了全頁模式,並將任務卡盡量縮小以方便綜覽。

前期外訪時遇到司機反應,有地圖可視化查看路順、調整任務順序會較為方便,因為在開車時不好閱讀文字,無法專心看地址。以下是訪談司機的紀錄,司機分享他們在使用派車單時的習慣:

我會綜覽 A4 紙本派車單,依照地區來判斷路順,再用筆在紙上作順序標記,如遇不確定的地點則用 google map 來當參考。
我拿到 A4 紙本派車單會先把所有地址填入 google map app ,然後參考上面的預估時間、路況、距離來排路順
我收到派車單會先大概看配送的縣市和區域,按照距離由遠到近排序,期間會特別注意備註欄客戶有沒有特殊時間需求,如有便需要考慮進去。

從上述司機分享可以發現,在排任務順序時他們都會需要一次看到所有派車單資訊,目的是可以判斷不同點之間的相對位置。另外他們也會利用 google map 來輔助,原因是 google map 的點與點之間的預估時間、路況、和圖像化可以幫助他們做更精準的判斷。

因此我們決定在既有的地圖功能上加上排序功能;在設計時,我探索了許多版本,但仍不確定哪個版本對於司機來說是最有幫助的。

我以wireframe 嘗試多個互動版本

所以我在設計時聯絡了一位司機,以了解他在排序任務時的需求,獲得以下資訊:

在排序時會綜覽所有任務,因為會透過瀏覽縣市區域來判斷順序。
需要地圖輔助,因為憑地址無法準確判斷排序結果。

除了訪談,我也透過使用者測試了解易用性,並與工程師討論其可行性提出最終的設計版本。

未來展望

MVP 發布後,公司成功獲得 20 家試用客戶,許多客戶都對於司機APP的體驗有很大的肯定,在聽到馬來西亞客戶說司機 App 很好用時,真的很開心能做出幫助到他們的產品,當然產品一定還有許多可以進步的地方,因此,我抓住機會實地參與一家家具物流商的配送工作,除了更了解實際司機的使用情況,也實地的去體驗司機工作時的困難。
在體驗了司機工作後,我反思了設計如何能更好地滿足他們的需求。我發現到結合音訊或觸覺反饋等多感官互動說不定能夠輔助視覺介面,減輕司機的工作負擔。這個啟發使我想進一步探索創新的解決方案,來提升他們的工作體驗並提高整體效率。

回顧

過去我會認為設計師需要堅守使用體驗,但透過這個產品的設計經驗,我深刻體會到商業考量在產品設計中的重要性,起初我常只專注於體驗而忽視不同業態的商業需求,直到我走出去,與 BD 實地拜訪目標客戶,才理解沒有商業的支撐,再好的設計也是空談。這次經驗讓我意識到,優秀的設計必須在使用者體驗、商業考量和技術可行性之間取得平衡,思考透過設計協助用戶增長,將是我在產品設計道路上需要繼續學習的目標。

Let's get in touch. Say hello.

Let's get in touch. Say hello.

Let's get in touch. Say hello.

Let's get in touch. Say hello.