簡介
AO Transport & Shuttle 是一個班車預訂應用程式,在我擔任首席技術實驗室導師期間,作為人機互動課程的大學專案的一部分而製作。 該應用程式是需要可靠班車運輸的使用者的工具,可以輕鬆預訂乘車、檢視時間表和跟蹤班車。 在本文中,我將快速重新設計應用程式中的兩個關鍵部分的使用者介面,重點關注簡單但有影響力的更改,以改善可用性、視覺和整體體驗。

目標
這次重新設計的目的是完善 AO Transport & Shuttle 應用程式的介面,以創造更精簡、更使用者友好的體驗。 作為一個針對我的學生參加人機互動課的個人專案,這個應用程式是審查核心視覺元件和可用性啟發式方法的實用示例。 目標是進行簡單、有影響力的改進,強調清晰度和易用性,無需廣泛的使用者研究或測試。 這項重新設計旨在模擬深思熟慮的使用者介面調整如何顯著提高可用性,併為有效設計實踐提供有價值的見解。
識別重新設計需求

現在讓我們進入其原始狀態,AO Transport & Shuttle 應用程式已收到使用者的反饋,表明了幾個可用性問題。 使用者報告說,跟蹤最近的公共汽車通常緩慢且不可靠,這削弱了該應用程式提供及時班車資訊的主要功能。 此外,人們對如何預訂門票存在困惑,這表明預訂過程可能不直觀或在應用程式中解釋不明確。
啟發

使用啟發式方法進行重新設計,很明顯,幾個基本的可用性原則沒有得到很好的體現。 例如,系統與現實世界之間的匹配需要改進,以確保使用者能夠直觀地與巴士跟蹤和訂票等功能進行互動。 同樣,系統狀態的可見性不足,這可能會導致穿梭跟蹤功能的不可靠性。 最後,美學和極簡主義設計可以更好地應用於建立一個更專注和高效的介面。 這些問題凸顯了使用者介面更新的必要性,該更新更符合可用性啟發式,以提高清晰度、響應性和整體使用者滿意度。
重新設計過程:視覺調整
在重新設計的主頁中,進行了一些關鍵的改進,以提高可用性,並更緊密地與基本的啟發式原則保持一致。

首先,個性化的問候語現在在頁面頂部以姓名歡迎使用者,以及通知符號。 此新增不僅創造了更具吸引力的體驗,還確保使用者及時收到任何新的促銷或應用程式更新的通知。 在此問候語下方,動態定位功能會根據使用者的當前位置自動更新。 此功能反映了系統和現實世界之間匹配的啟發式原則,幫助使用者感受到與實時位置和附近的班車選項的聯絡。

頂部導航現在還包括一個二維碼掃描器,允許使用者透過掃描快速訪問付款選項,從而簡化了付款流程。 此外,新的搜尋欄提供了對搜尋功能的輕鬆訪問,以定位公共汽車或特定目的地,透過為使用者提供清晰、便捷的方式來查詢相關資訊,增強了系統狀態的可見性。 在主頁的更下面,餘額小部件顯示使用者的當前帳戶餘額,並具有縮放、付款和訪問其他帳戶功能等操作選項。 此小部件讓使用者在一個可見、可訪問的區域瞭解他們的平衡狀態和可用操作。
為了讓使用者參與當前交易,在餘額小部件下方添加了促銷和優惠部分。 本節以橫向滾動為特色,鼓勵使用者以視覺吸引力和互動式形式探索可用折扣。

最後,在頁面底部,實時時間表列出了即將到來的巴士及其班車程式碼、車站程式碼和到下一站的預計出發時間。 此實時時間表確保使用者獲得有關巴士到達的最新資訊,同時支援系統狀態的可見性和高效的旅行計劃。 這些調整共同建立了一個更直觀、更直觀的主頁,該主頁與可用性啟發式方法非常一致,並增強了整體使用者體驗。

在重新設計的預訂部分,點選主頁的搜尋欄會引導使用者進入匯流排選擇頁面。 螢幕的上半部分專門用於互動式地圖,該地圖動態更新,在使用者選擇或輸入這些詳細資訊時顯示使用者的當前位置和目的地。 這張地圖提供了他們旅行路線的清晰、直觀的表示,透過使導航和位置跟蹤直觀和相關來加強系統和現實世界之間的匹配。

螢幕的下部包含一個實時時間表元件,從主頁回收,實時調整以反映使用者選擇的路線和站點。 該元件幫助使用者沿計劃路線跟蹤班車的預計時間和位置,增強系統狀態的可見性,並支援自信的旅行計劃。 在螢幕底部,一個突出的“選擇巴士”按鈕允許使用者繼續選擇班車和預訂座位,為預訂過程的下一步提供了一條直接的路徑。 這些設計選擇共同簡化了預訂過程,並使使用者能夠輕鬆地從搜尋到選擇班車和座位的無縫過渡。

關鍵要點
在重新設計 AO Transport & Shuttle 應用程式時,我旨在展示該應用程式如何將介面與現實世界的互動保持一致,提高系統狀態的可見性,並簡化導航,該應用程式現在以清晰直觀的方式更好地支援使用者的需求。 這種重新設計突出了深思熟慮的調整——無需廣泛的測試或使用者角色——如何改善使用者體驗的關鍵方面。 歸根結底,建立使用者友好的設計並不總是需要徹底的檢修;有時,它需要進行有針對性的更改,為使用者旅程帶來清晰和輕鬆。