top of page

台北捷運GO
taipei metro app

2023 第三屆捷運盃黑客松 冠軍作品

UX/UI

捷運go展示.png

background

台北捷運作為大台北地區主要交通樞紐,官方與第三方皆推出數位服務App讓用戶能快速取得交通資訊。由台北捷運每年主辦的捷運黑客松比賽,廣邀各方好手共同參與,爲官方App — 台北捷運GO的使用者帶來更好的操作體驗。

而台北捷運作為日常主要交通工具、大多使用第三方整合型交通App的自己,卻從未使用過官方App,因此決定與同事相約組隊,利用每天的下班時間開始這個比賽,和隊友們度過一段非常寶貴也有趣的時光。

duration
4 weeks
tool
Figma 
year
2023
main role

industry research / user interview / wireframe / usability testing

the challenge

結合捷運使用者交通需求與官方行銷需求的設計策略,為使用者提供更簡單直觀且具效率性的捷運App。

the outcome

打造符合用戶需求的捷運應用程式。

design process

考量到緊湊的比賽時程,我們透過雙鑽石流程來進行設計,透過快速研究發散再進行測試收斂,確保最終設計能貼近使用者真實需求。

How we do that_.png

user research​

​透過搜集近 6 個月內在 App Store、Google Play 商店,共 94 則具有明確指意的用戶評論,來進行使用者的量化研究,在此之中,我們挖掘出使用者的三大痛點:票價時間不夠直覺、操作步驟繁瑣、查找資訊具急迫性。

同時我們也邀請了 5 位使用者進行質化研究訪談,我們發現使用者在操作過程也遇到相同的情形:對於操作步驟複雜、無法快速查找資訊所產生的痛點,與量化研究結果相符。

Insights from user-1.png
based on the user research, the key insight was

透過質量化研究,觀察到痛點與使用者真實操作情形後,得出一個關鍵洞察:使用者需要一個更簡單、更直覺、更具即時性 的捷運資訊App。

insights.png

competitor analysis

從 App Store 旅遊、導航兩類別中過濾出搜尋結果靠前的地鐵資訊 App 作為主要分析對象,範圍涵蓋東京、首爾、香港、新加坡、倫敦等 COMET 國際地鐵聯盟城市。進一步深入探索,歸納出市場上常見的兩個版本的App架構:功能導向、路網圖導向。

競品分析.png
thinking...

在前期研究中,研究顯示了使用者需要的是簡單、直覺即時性的介面。但

同時考慮了捷運公司作為企業,需具行銷廣告的需求。因此我們開始思考...

「有可能結合兩種架構的優點嗎?」

process.png

因此,我們在接獲進入決賽消息後,決定暫時放下初賽準備的A版首頁,開始著手設計了 B 版首頁結構—結合了路網圖與功能兼具的新版本首頁,此時出現了兩種不同的首頁佈局。

競品分析-3.png

A/B Testing

為了快速地推進設計決策,我們決定透過 A/B 測試來了解真實使用者的回饋,測試邀請了 5 位捷運使用者,來進行兩個不同結構的捷運App首頁測試,而結果顯示了 B 版首頁更符合使用者的需求

B-1.png
B-2.png

wireframe &
high-fidelity prototype

wireframe &
high-fidelity prototype

開始著手繪製線框稿與進行高保真互動原型

catagory.png

main future 1

首頁即路網,資訊更即時

首頁路網圖.png

打開App,首頁就是路網圖,更符合在真實使用情境之需求。

main future 2

所有核心資訊,只須單擊更直覺

透過快速切換圖層,只需單集即可查看旅行時間、票價與車廂擁擠度,將路線規劃作為主要按鈕,並位於拇指點擊範圍,查找資訊更直覺。

核心功能.png

main future 3

減少資訊干擾,操作更簡單專注

收納原先四散的眾多小功能,約束並設計適當的行銷版位,同時考慮使用者與捷運公司雙方,讓整體體驗更簡單專注。

收納功能.png

usability testing

最終我們邀請 5 位捷運日常使用者進行易用性測試驗證,透過使用者核心功能—查找站到站的關鍵任務,在 SUS 易用性量表評分獲得 80 分。

36.png

what i learned & challeges

>> 學習做出更為全面的設計策略

如何做出一個好的設計策略,以產出符合時程限制與品質的設計成果,一直是我加入乙方公司後積極嘗試的領域。在相較工作更為緊湊的比賽時程下,我深刻體驗到設計決策的重要性,從前期使用者研究與測試、中期介面設計與初賽計畫書、最後的決賽簡報,與隊友共同討論並衡量這三個階段的預期效益,將資源投入在對的階段並最大化。學習如何觀察到除了設計本體外的面向,讓策略不只侷限在設計,而是進一步思考評審的觀點與既有的資源,讓策略真正發揮效果,成為我們最終進入決賽並幸運拿下冠軍的關鍵。

>> 設計決策難以推進嗎?交給使用者來決定

在這次設計原型過程中,大家對於首頁佈局分成兩種不同的看法,因此我們決定快速進行一個小型的 A/B testing 來推進決策的速度。而除了推進執行效率外,我認為在比賽前期加入使用者的真實回饋,能大幅降低中期設計中的混沌或推翻的可能性,同時也讓最終設計成果多出一次迭代經驗,更具完整性。

>> 看起來既疲憊又痛苦的過程,回甘才是最甜。

身為在乙方公司工作的設計師,平常不免出現需要稍微加班的情形。在這個背景下,我和隊友們利用每天下班時間 concall 討論,靠近決賽日期更是度過一段每天看天亮,隔天再拍拍自己臉頰去上班的日子。雖然曾經一度覺得忙到覺得懷疑人生,但從未有過放棄的念頭,而這都要感謝我的好隊友們。

設計最吸引我的地方之一,就在這段共同討論的寶貴過程裡。也許自己的想法不是最好,但透過分享彼此的觀點,能拓展自己的視角讓設計變的更加全面​,幫助自己成為一個思考更成熟也周全的設計師。

對我而言最大的收穫,不是得到一個黑客松的冠軍頭銜,而是能夠擁有一群志同道合對於設計充滿熱忱的朋友們,體驗到一段大家專心一致的看著目標前進的經歷,才是凸顯這個經驗的寶貴之處。

bottom of page