重新定義移動體驗:ICU 團隊的 Bus+ App Redesign 探險故事

本篇文章與「AAPD 第一屆產品設計挑戰賽」得獎隊伍合作,由成員們撰寫內容,分享產品的研究、設計方法及參賽的心路歷程。

文章目錄
前言
專案展開,先從使用者研究開始!
問題確認後,靈光乍現的解法
進行最終設計,交由使用者與評審鑑定
未完待續的旅程
回顧這段旅程,印象最深刻的事
參賽後最大的收穫

嗨!大家好,我們是 ICU 團隊,我們幫 Bus+ App Redesign 的作品在 AAPD 舉辦的第一屆《產品設計挑戰賽》中獲得了佳作和人氣獎!

前言

在進入正題之前,簡單介紹一下 Bus+:「Bus+ 為整合全台灣大眾運輸資訊的 App」,以「為繁忙的城市人帶來優雅的移動風格」為產品願景,讓人們在通勤途中能節省查詢時間。而企業在此次的挑戰賽中主要希望優化現有的核心體驗,讓使用者不流失以及擴大使用者族群。另外,Bus+ 發現有成功收藏站牌的新使用者,留存率也會很高,因此我們的目標是藉由 Redesign 提升 Bus+ 用戶收藏站牌的意願,進而達到留存率的提升。

在短短七週的時間內,我們透過密集的會議和線上討論,最終完成兩次完整的迭代成果。對於能在這麼短的時間內取得如此多的成就,團隊夥伴們也感到驚喜和滿足。因此,想透過這篇文章與大家分享六個設計新手是如何在產品設計挑戰賽中獲得佳作和人氣獎,以及在比賽過程中所學到的思維和體悟。

ICU 成軍過程

ICU 是源自 “I C(see)UX / UI” ,團隊透過主辦方提供的 Notion 組隊系統去尋找我們的組員,因為比賽的評分標準多元,所以在尋找的過程中有特別留意彼此的專長是否重疊性過高,很幸運的是除了彼此的專長不同,我們的個性也蠻互補的,因此總是能在討論過程中激發出創意的點子。

在六個人的角色分配中,一位擔任 PM,一位擔任 UXD,其餘則是各兩位 UX 和 UI。在第一場會議中,我們用 FigJam 簡單列出彼此合作的雷點和參加競賽的目標,最重要的是,確保在後續的溝通上保有「透明度」,讓彼此能明確知道進度和需要幫忙的地方。

因為我們的背景都是剛接觸 UX / UI 產業不久,在比賽初期對產品設計的過程其實沒有十足的掌握,而是藉由挑戰賽建議的時程規劃出:「了解議題」、「用戶洞察」、「設計藍圖」、「設計實現」、「深化設計」五週的專案時程。

五週的專案時程

專案開始!

首先,我們要從《產品設計挑戰賽》的三個合作企業主題中,抉擇出未來七週執行的核心專案。我們先了解三個合作主題再進行投票,然後組員各自闡述選擇的原因;這樣除了可以理解組員們的想法外,也讓自己可以重新思考是否有其他沒考量到的抉擇點。每個合作企業主題皆有可以發揮的空間及其困難點,最終我們考量到「時間緊迫性」、「產品熟悉度」以及「夥伴契合度」,主題確定為 “Bus+ App Redesign”!

專案展開,先從使用者研究開始!

確定主題後,我們要先找出使用者痛點或需求,才能對症下藥,設計出更符合他們的產品!

使用者研究流程

我們預計採取「量化的問卷調查」及「質化的深度訪談」來了解我們的使用者。但在設計相關題目前,我們決定先做 ”Pre-pilot”,用一些簡單問題詢問身邊有使用「公車 App」的親友,目的是可快速地初步了解使用者痛點,也有助於設計後續的問卷及深度訪談題目。

收斂一下 Pre-pilot 內容後,我們得出 Bus+ App 的兩個關鍵弱點:

  1. 查詢班次的體驗:因為首頁頁面資訊過於繁雜,影響到使用者查詢公車班次資訊的效率。
  2. 規劃路線的體驗:地圖的路線規劃功能僅提供公車班次方案,相較沒有 Google Maps 那麼多元(汽車/機車/腳踏車)。

了解使用者的路途中,我們遇到了瓶頸

我們想將 Pre-pilot 收斂到的結果應用於問卷上,但卻不知道如何結合「擴大使用者族群」的目標,因此我們轉向尋求助教的幫助。助教先理解我們的問題、了解我們的想法,然後提供回饋,但她不會直接提供唯一的答案,而是引導我們思考「我們想解決什麼樣的問題?」以及現實面的限制,如:時間、開發成本⋯⋯等,接著讓我們判斷要採取哪種作法。

而且助教還貼心提醒,原先我們將「商業價值驗證」規劃安排於專案後期,她建議可以在更早時期進行,以避免到後期才被驗證不可行。會後我們定調:問卷協助了解問題影響程度(佔比),再根據問卷結果於深度訪談了解使用者過往經驗與想法

使用者研究工具,如:問卷、深度訪談,只是輔助我們在找尋「想解決甚麼樣問題」時,能補足缺失的資訊,並沒有絕對一定要採用的流程或作法!

因此,我們透過問卷調查來了解使用者對現有公車 App 重視的功能,並進一步蒐集使用過 Bus+ App 的反饋,以識別存在的問題點。為了充分利用珍貴的訪談機會,我們在深度訪談中不僅探討問卷揭示的問題,還加入了針對 Bus+ 商業目標「收藏站牌」的討論,旨在深入理解使用者的體驗和看法,並檢視其行為是否與 Bus+ 的商業目標有所偏差,以尋找潛在的改進機會。

我們設計了「情境探索任務」讓使用者操作現行的 Bus+ App,評估其功能的實際效益。遵循助教的建議「提早進行驗證」,我們基於 Pre-pilot 和問卷中收集到的使用者反饋進行了初步的解決方案設計,例如:針對多數使用者反映的「首頁資訊過於繁雜」問題,我們重新設計了首頁;同時,從使用者對於班次查詢的反饋中,我們提煉出了「掌握感」這一關鍵概念,並因此設計了一套「班次資訊回報機制」,以便使用者能即時了解公車班次狀態。

問卷及深度訪談架構
透過 Pre-pilot 及問卷蒐集到的使用者痛點,我們草擬解法:重新設計首頁介面、新設計班次資訊回報機制,並於深度訪談中蒐集使用者回饋,以利我們迅速確認設計解法是否有效解決使用者痛點

找出使用者最核心的痛點好難

我們從深度訪談的設計驗證中,得到「重新設計的首頁」仍有很多待優化之處,還有原先以為新設計的「班次資訊回報機制」會受到好評,結果發現人是懶惰的,並不會主動回報即時的公車班次狀況,反而更在意公車班次誤點時的替代方案。還好有先提早驗證,我們才有調整的機會!

經過大量問題點的蒐集後,我們選擇專注於兩個方向:使用者共同痛點-「查詢公車資訊」和 Bus+ 商業目標-「收藏站牌」,並運用挑戰賽「產品商業思維主題講座」中學到的「九宮格」,將問題的嚴重程度及影響人數各劃分三種等級,交叉定義九種待解決問題優先順序的分析方法。我們努力從兩個方向找出九宮格中最值得的問題,但因為我們在問題大小上難以精確區分,所以多數問題被標記為「最值得解決」。

後來我們將問題重新梳理,分為兩大議題:「優化站牌體驗」和「提升用戶對公車班次的掌握感」進行分組討論,探討兩個議題在顧客旅程圖(User Journey Map)中的痛點(Pain Points)和可能的解決方案(Possible Solutions)。然而在兩組發表後未能達成共識,因此我們決定尋求助教的協助!

運用九宮格,找出最值得解決的問題
試著將問題分組並重新定義議題,再透過探討顧客旅程圖的痛點與可能的解法方案,確定最終我們要解決的問題

問題確認後,靈光乍現的解法

🙋🏻‍♂️ 新手(組員)
請問助教有遇過進行問題決策時,是要傾向「商業目標端」還是專注在「使用者的共同痛點」?尤其在時間有限下,是可以兩者兼顧嗎?或是要怎麼選擇和評估?

👩🏻‍🏫 專家(助教)
可先尋找兩者有沒有重疊的主題,如果沒有,只要在發現使用者共同痛點的過程中,有足夠依據,且能對企業方帶來正面影響,就可考慮專注在痛點。以此專案為例,企業方認為收藏站牌能為產品留存用戶,那我們改善使用者的共同痛點—班次資訊,是否會帶來相同或更大效益?像是帶來其他新的合作機會或擴大收益?

產品設計要兼顧「解決使用者痛點」與「達成商業目標」,不論商業目標是不是當下企業所訂定,只要能帶來同等效益或更大效益就算是!

當我們進行 Brainstorming,找出「查詢班次資訊」與「收藏站牌」之間的連結時,突然想到先前深度訪談有得到一個結論:「對於沒有固定路線的使用者而言,收藏站牌的意願很低,因為不是經常會在同一個地點或是公車去搭」。

這就讓我們想到一個解法:如果今天不是收藏「起點站牌」,而是收藏「目的地站牌」,就使用者需求面,不論他有沒有固定路線,都會有於相同目的地公車站牌下車的情境;就技術面而言,發揮 Bus+ App 既有的「路線規劃」及「最近站牌」功能,預期可以規劃出「目的地站牌」及「最近站牌」間的多班次公車資訊,這樣也能滿足 Bus+「程式開發成本低」的參賽作品期待。

再次檢視「目的地站牌」此功能,我們預期效益是—提升 Bus+ 的「收藏站牌」機率並擴大使用者,滿足使用者「查詢公車班次」時的替代班次方案及減少跳轉 Google Maps 步驟。

「目的地站牌」能達成的雙方效益

因此,「目的地站牌」就成為我們本次專案的亮點,為了凸顯此新功能,我們於首頁設計一個專屬版位,再加上深度訪談的設計驗證中,已蒐集到很多改版首頁的調整回饋,所以此次專案的設計目標就是新功能—「目的地站牌」及「重新設計的首頁」!

雖然在設計目標確立之前,我們很焦慮,「如何找到問題的核心價值?」、「如何印證企業提出的商業策略?」、「有甚麼樣的解決方案可以滿足兩者?」、「我們想的解法會不會都太單點,優化很無感?」⋯⋯等困擾,但這些陰霾都在我們想到創新性的「目的地站牌」這個解法時,改由振奮感取而代之!

在有限的時間與資源下,專心把問題做深就很厲害了!

進行最終設計,交由使用者與評審鑑定

在接下來不到兩週的時間內,我們面臨著一系列緊湊的任務:完成 UI 設計、進行易用性測試、迭代、製作和錄製簡報。在 UI 組開始設計階段,出現了一些疑惑,我們透過會議進行討論以達成共識,逐步完善了「目的地站牌」的操作流程和相關功能設置,並將其轉化為「使用者流程圖(User Flow)」,供 UI 組參考,隨後迅速進入原型(Prototype)階段

至於首頁的改版,兩位 UI 設計師各有自己的見解,團隊暫時無法達成一致意見。因此,我們決定先將其中一個設計版本納入原型(Prototype)中,另一版則以圖片形式備案,最終的決定將交由使用者來裁決。

繪製「使用者流程圖(User Flow)」可確認全員達成共識,且利於 UI 設計

原型(Prototype)製作完成後,我們邀請之前參與深度訪談的受訪者參與「易用性測試」。組員依據過往參加易用性測試的經驗,建議採用 Maze 網站。我們設計好情境任務,並將原型(Prototype)匯入後,提供連結就可以讓測試者遠端操作。Maze 網站除了可以排除時空限制外,它能記錄測試者點擊路徑、任務執行時間及計算易用性分數等數據,而操作過程中的使用者感想則是透過訪談了解。

我們非常高興收到一些對「目的地站牌」的讚賞!當然,也獲得了一些寶貴的建議需要再進一步優化。受限於時間,僅能在有限的範圍內進行設計迭代,我們對首頁進行輕微的調整,同時為「目的地站牌」新增「引導說明與介紹」,以因應一些受測者未發現或需要我們解釋功能的情況。

初賽前完成的改版首頁與「目的地站牌」操作頁面

我們在進行 UI 設計的同時,也開始了簡報的製作。然而,製作一份有架構且易理解的簡報並非輕鬆的事情,必須從錯綜複雜的過程中梳理出「清晰的產品設計流程」,同時確保簡報內容符合比賽評分項目,成為一份能吸引人的「提案簡報」。我們齊心協力完成了簡報內容,並加上優秀 PM 錄製的報告影片。在初賽繳交的截止日,我們多次檢查所有文字與連結,以免因一個疏忽而失去參賽資格,最終,成功提交了這份充滿心血的成果!

未完待續的旅程

在比賽初期全員對於比賽目標有達成共識,以「志在參加,不在得獎,但也不馬虎」的心態執行專案,能順利繳交出初賽作品就已心滿意足,想不到在公布晉級決賽隊伍的那一天,在名單第一列就看到我們「第 6 組|ICU」,大家都很驚訝但也很開心!很快平復雀躍的心情,進入備戰狀態,立馬確認下次的小組會議時間!

此次比賽可以看到所有組別的簡報檔案與影片,還有兩位評分助教的回饋。從中我們知道自己的優勢及劣勢,也從其他晉級隊伍中學習。觀摩其他組別的表現,才發現我們以簡報者口語表達補足簡報的內容,這是我們能脫穎而出的利器之一,不過在決賽僅提供簡報檔案,而不需錄製簡報影片而言,這是一大危機,還有發現同樣選擇 Bus+ App 的組別,Redesign 的 UI 介面更為簡潔。因此我們決定簡報需要重新製作、加強內容,並進行更完整的 UI 迭代!

比賽不僅僅是勝負,更是一個互相學習、共同成長的契機。

我們還能做什麼?

為了加強說服力,我們簡報在關乎使用者回饋的部分,都加入使用者真實心聲的語句;為了讓閱讀者可以更理解我們亮點「目的地站牌」的功用,我們帶入情境做說明;簡報風格與架構重新製作,凸顯重點內容與保有簡潔活潑的視覺感受。但讓我們最苦惱的就是「要如何更有效地驗證新功能的商業價值?」、「首頁 UI 仍屬複雜,甚至無法凸顯我們的『目的地站牌』卡片 」。

在助教時間跟助教商討要如何改進,助教給了我們一些提點:「雖然新功能沒有過往數據可以前後比較,但是否可以計算舊有固定式站牌數量 vs. 目的地站牌的需求數,像是多了哪些情境數量,可以讓人回訪?」、「不理解目的地站牌的用途,有沒有可能是首頁資訊結構不佳的問題?」。

原來商業價值驗證不僅只是蒐集使用者回饋的數字而已,其實客觀的狀況也可以「數據化」,後來我們自己有再額外思考到「步驟的減少數」也算是一種驗證!

擴大情境或步驟減少等現象都可以做為商業價值驗證的類型

商業價值的驗證,不光只是使用者回饋的資料分析,從現象的改善也可以做為驗證資料。

針對首頁的改版,經過觀摩其他組別及助教的提點後,我們決定進行全面的重新設計。為了突顯「目的地站牌」卡片,我們重新構思了首頁的資訊架構並調整了顏色比例。透過多次改版首頁的使用者回饋,我們發現使用者對大眾運輸資訊的看法及偏好具有多樣性。在難以決定首頁輔助功能擺放的情況下,我們最終決定讓使用者自行選擇,即為「個人化首頁」,以滿足不同使用者對功能的個別需求

回顧改版首頁設計歷程

因為初賽時的積累、同儕的優秀作品、助教的用心回饋、組員的投入,讓我們把決賽作品想得更深、簡報內容做得更完整、UI 設計得更易讀。這次決賽繳交的作品,比上次初賽更令人安心與踏實!

最終一站,成果揭曉!

距離決賽作品繳交日的一週後,是我們的結業式,採線上直播,由每組決賽隊伍輪番報告。每組的報告都比初賽更為精彩,我們是最後一組,壓軸已經很緊張,結果前一組不論報告者的表達或簡報的有趣度,都令人嘆為觀止!所幸我們派出口條和台風很好的 PM ,表現依然水平之上!就在我們小組全員抱持「參加」的心態時,竟然被公佈獲得「佳作」!真的是出乎意料地開心!我們這七週來的努力很幸運能獲得好的結果!

回顧這段旅程,印象最深刻的事

集體開夜車:決賽前夕の衝刺

在初賽前,我們接連開了幾次會議都超過兩小時,最後一次甚至從晚上九點一路到凌晨三點,以往會議一旦超過兩小時就容易開始失焦、渙散、效率下降,這次大家卻像卯足最後全力一樣,踴躍地討論到底,還記得當時一件一件事情討論、一項一項疑點釐清、解決,離終點越來越近的感覺,令人格外有成就感,對於第一次經歷這樣過程的我們甚是意外。

更讓人意外的是我們的 PM/報告人— Ian,竟然在開完會後,很快就錄製了一個版本的口頭報告錄音檔,當時已經接近四點,剛開完會大家都累壞了,收到 Ian 錄音檔時真的非常驚訝,好像又給大家打了一劑強心錠,直到繳交前都奮力不懈,Ian 甚至在繳交後烙下:「大家準備領獎金吧!」的狠話 😎

心情雲霄飛車:我們得獎啦!

儘管決賽前這番衝刺已付出 120% 的努力,在決賽直播當下,聽著其他各組一個比一個優秀的報告,我們還是退卻了,彼此討論著哪一組好厲害、哪一組肯定是冠軍,對自己的作品越發失去信心,而且評審給我們的回饋大多是認為還有不少進步空間,更加削弱了我們希望。

一直到頒獎時刻,我們連緊張都還來不及,第一個就被點到了(甚至還是簡報不小心偷跑,先看到了😂),還有成員中場休息過頭、都還沒回會議室,就看到一個個在 Discord 群組討論:「我們得名了嗎?」、「好突然喔!」、「是佳作嗎?」,雖然混亂但真的是非常開心的氛圍!對於我們這群菜鳥團隊、大家都還是新手而言,著實是再驚喜不過了。

Bus+ 企業主愛的鼓勵 ❤️

在研究和討論的過程中,我們一直以團隊一起想出來的新功能為榮,也就是專攻不同客群、可以擴展使用族群的「目的地站牌」,當初在思考這項功能時,我們認為這是現階段技術可以做到的,不僅能夠有效解決現有痛點,還能讓 Bus+ 更貼近非常態慣用的使用者。我們花了很多時間在反覆檢測這項功能,對它做了易用性測試、深度訪談等檢驗,希望能將它打磨成真正實用、對使用者有幫助的功能。

因此,當我們在決賽直播中聽到企業主 Freddy 對我們新功能的讚賞時,心中滿滿的都是欣慰,Freddy 還說了會和後台工程師討論這項功能,不禁讓我們期待,也許有一天,我們會在 Bus+ 裡看到自己想出來的東西呢!

參賽後最大的收穫

專業的回饋

回想小組在比賽中不時會有卡住的情況,在助教時間助教給予我們針對性的回饋後,總會開創我們的視野和啟發更多行動想法。在緊湊的賽程中隔週的助教時間讓我們一直都要梳理每階段最重要的問題去提問和持續產出,一直推動我們的比賽進度,也讓我們在知識學習上比過往純瀏覽文章更有感。此外在初賽和決賽的簡報後,我們也從評審中得到非常專業和具體的建議,讓我們知道可以再改善哪些不足的部分。

團隊合作與跟對手學習的寶貴收穫

參加這次比賽,我們獲得了很多關於團隊合作和從其他出色的參賽者學習的寶貴經驗。我們的小組成員來自不同的背景和國家,有人擅長表達,有人擅長整理、推動進度等,我們學會了如何協同合作,互補不足,從中學習和成長。

儘管意見不同時達成共識很難,但我們一直學習如何在這種情況下協調出合理的解決方案,邊前進邊調整方法。我們的團隊成員都很認真和願意付出。每個人都願意多走一步,這種態度和奉獻精神是我們成功完成專案的關鍵。

此外,觀摩其他組別的簡報也是我們的一大收獲。有些組別簡報的鋪排別出心裁,視覺呈現和故事技巧都非常強大,不僅僅是一個流水帳式的報告自己做了什麼,而是像專業的 Pitching 一樣,讓我們大開眼界。這鼓舞了我們不斷提升自己,我們相信這些經驗將對我們未來的職涯發展產生積極的影響。

最後,謝謝出現在 ICU 團隊探險故事上的每個人!

參加「AAPD 第一屆產品設計挑戰賽」的這七週,過得很充實!大量地吸收新知、也大量地輸出所知,不斷地在「收斂」與「發散」間徘迴,無止盡地於「完成」與「完美」間拉扯!讓自己在學業或工作之餘,有一個舞台可以發光發熱!很開心能跟這麼棒的組員、參賽團隊及工作人員一起於 2023 年年底完成一件不凡的事!

以下為成員在團隊中的角色及社群連結,如果想進一步聊聊,歡迎和他們聯繫!🙌🏻

  • 林子韵 ( 走走 ) [UI 設計、組長]
    🔗 LinkedIn
  • 黃詣安 ( Ian ) [PM、簡報主講]
    🔗 LinkedIn
  • 楊詠晴 ( Jenny ) [UX 研究]
    🔗 LinkedIn
  • 林晏如 ( Lulu ) [UX 研究、簡報設計]
    🔗 LinkedIn
  • 曾芷華 ( Michelle ) [UX 設計、簡報設計]
    🔗 LinkedIn
  • 鍾莫同 ( Morris ) [UI 設計]
    🔗 LinkedIn

--

--

AAPD — As A Product Designer
AAPD — As A Product Designer

We share digital product design experiences & help designers find their purpose and passion. Follow our Medium Publication ↑ and Facebook http://fb.me/aapd.tw