technine.io

手機 App · 設計概念

交通路線 App

交通手機介面設計研究,展示路線搜尋、方案比較及行程詳情,並提供選取和資料未能更新的狀態建議。

以下為設計概念,並非客戶項目。畫面屬靜態示意,名稱及數據均為虛構。

交通路線 App

設計概念

交通路線 App: 以行程為主的手機設計 · 路線及乘車步驟
查看設計 ↗
以行程為主的手機設計 · 路線及乘車步驟

設計起點

讓乘客先比較路線,再查看每段行程。概念採用簡單的搜尋畫面,並以一致格式列出不同選擇。

適用對象
規劃陌生路程,需要比較轉乘及步行安排的乘客。
需要考慮的限制
地點、路線及畫面上的時間均屬虛構靜態示例,並非即時交通資料。概念不提供導航、購票或服務通知。

建議的操作流程

  1. 01

    設定行程

    搜尋畫面將起點與目的地分開,清楚交代行車方向。

  2. 02

    比較路線

    每張路線卡在相同位置顯示所需時間及轉乘資料,方便對照。

  3. 03

    查看各段路程

    詳情按次序列出已選路線,在相關步驟旁交代轉乘及步行安排。

為何這樣設計?

用相同格式比較

各張路線卡以相同次序顯示資料。即使所需時間較短,也不能隱藏額外轉乘。

顏色配合文字提示

青檸綠在深藍及白色背景中標示已選路線。路線名稱和步驟仍須清楚,不能只靠顏色辨認。

細看視覺設計

以下是建議的設計樣式,屬靜態示例,並非可操作的功能或正式開發規格。

配色用途

  • 導航及文字

    #133952

  • 路線背景

    #FFFFFF

  • 已選行程

    #C6EA64

字體與間距

資料清楚,下一步自然明確。

採用站名及數字容易閱讀的無襯線字體。路線編號應比說明文字突出,尤其在轉乘位置。

不同路線各用一張卡片。詳情按垂直次序連接各段路程,並為較長站名及轉乘指示預留空間。

正常流程以外的狀態

找不到路線

沒有符合條件的路線。請核對地點或更改出發時間。

已選擇路線

已選擇路線。請查看轉乘及步行路段。

暫無即時更新

暫時未能取得即時資料。出發前請向交通營辦商查詢。

為甚麼轉乘資料要放在行程時間旁邊?

較快的路線可能需要更多轉乘或步行。並列這些資料,乘客毋須逐一打開路線,便能比較取捨。這個概念不會判定哪條路線適合個別乘客。