∙ iCore5 導航
∙ iCore5 導航
iCore5 導航
iCore5 導航
iCore5 導航
iCore5 導航
專案期間
專案期間
專案期間
2024 / 03 - 04 (2 個月)
2024 / 03 - 04 (2 個月)
擔任角色
擔任角色
擔任角色
產品設計師
產品設計師
負責項目
負責項目
負責項目
使用者介面設計
使用者介面設計
專案概覽
專案概覽
1
團隊目標
團隊目標
1
1
我們的團隊計畫為 Ionex App 電動車騎乘者設計一款導航和地圖體驗，同時組織系統架構，以便未來能夠與硬體設備整合發展。
我們的團隊計畫為 Ionex App 電動車騎乘者設計一款導航和地圖體驗，同時組織系統架構，以便未來能夠與硬體設備整合發展。
2
角色與交付
角色與交付
2
2
在這個專案中，我和產品經理和三位產品設計師密切溝通。我負責整個 UX 和 UI 設計流程與產出，從定義問題到交付最終視覺設計成果給工程師。
在這個專案中，我和產品經理和三位產品設計師密切溝通。我負責整個 UX 和 UI 設計流程與產出，從定義問題到交付最終視覺設計成果給工程師。
3
專案挑戰
專案挑戰
3
3
這個專案當時有不少技術上的限制，需要使用第三方的地圖資訊，同時需要處理產品內部主要功能的迭代，許多任務優先級確保我們能在時間內完整產品的新功能。
這個項目面對技術限制，依賴第三方功能並不斷迭代核心功能。
任務優先順序對按時推出MVP至關重要。
4
專案成果
專案成果
4
4
這個項目面臨了幾個技術限制，要求在管理關鍵產品功能的迭代時使用第三方地圖資訊。優先排序任務對於確保新功能的及時交付非常重要。
這個項目面臨了幾個技術限制，要求在管理關鍵產品功能的迭代時使用第三方地圖資訊。優先排序任務對於確保新功能的及時交付非常重要。
專案背景
專案背景
Ionex app 專為Ionex用戶打造良好的服務體驗，包括充換電、騎乘資訊和資費帳單等功能。
未來導航功能將結合開發中的儀表板系統，為用戶提供更一致的操作體驗。為實現這個目標，我們需要優先開發導航功能的內部介面，希望結合Ionex app 的換電地圖，來開發導航功能。同時確保其架構穩定並具備與儀表板整合的彈性。
Ionex 應用程式提供像電池交換、乘車資訊和計費等功能，以提升使用者體驗。
為了準備未來與儀表板系統的整合，我們的目標是開發一個穩定且靈活的導航介面。這包括利用應用程式的電池交換地圖來增強導航功能，同時確保未來的無縫連接。
使用者研究
使用者研究
在專案開始前，我們利用問卷及數次的用戶訪談，了解到使用者的行為及需求。
在專案開始前，我們利用問卷及數次的用戶訪談，了解到使用者的行為及需求。
用戶洞察
用戶洞察
😥 切換應用與換電站搜尋困難
😥 切換應用與換電站搜尋困難
😥 更新頻率低，換電站無電池可換
😥 更新頻率低，換電站無電池可換
😥 個人化路線需求不足
😥 個人化路線需求不足
😥 騎行中無法輕鬆查看地圖
😥 騎行中無法輕鬆查看地圖
我們的用戶在導航時遇到不少困擾，比如要切換到其他地圖找換電站，或因地圖更新不夠快，到了才發現沒電池可換。他們希望能有個人化的路線選擇，像是避開擁擠路段或儲存常用地點。而且導航過程中查看地圖不方便，還需要停車操作，既麻煩又影響安全。
我們的用戶在導航時遇到不少困擾，比如要切換到其他地圖找換電站，或因地圖更新不夠快，到了才發現沒電池可換。他們希望能有個人化的路線選擇，像是避開擁擠路段或儲存常用地點。而且導航過程中查看地圖不方便，還需要停車操作，既麻煩又影響安全。
假設與目標
假設與目標
假設
假設
1
提供即時更新的換電站資訊與導航路線
即時交換更新
1
1
提升換電站即時更新頻率並顯示可用電池資訊，同時在導航過程中顯示機車剩餘電量，讓用戶能預知何時該換電，從而更準確地規劃行程，避免到達換電站後無電池可換的情況。
提升換電站即時更新頻率並顯示可用電池資訊，同時在導航過程中顯示機車剩餘電量，讓用戶能預知何時該換電，從而更準確地規劃行程，避免到達換電站後無電池可換的情況。
2
增強個人化導航功能與自定義路線選項
增強自訂導航
2
2
提供更多個人化的路線規劃選項，如避開擁擠路段、選擇更高換電站密度的路線，並讓用戶儲存喜愛的地點並快速導航，從而讓用戶根據需求制定更靈活、便捷的行程，提升整體使用體驗。
提供更多個人化的路線規劃選項，如避開擁擠路段、選擇更高換電站密度的路線，並讓用戶儲存喜愛的地點並快速導航，從而讓用戶根據需求制定更靈活、便捷的行程，提升整體使用體驗。
我們的目標
我們的目標
🎯 推出一款在手機或機車儀表都能流暢使用的導航體驗
🎯 推出一款在手機或機車儀表都能流暢使用的導航體驗
資訊架構
資訊架構
字型與配色
字型與配色
字型
字型
蘋方 TC
蘋方 TC
蘋方 TC
大寫字母樣式
大寫字母樣式
ABCDEFGHIJKLMNOPQRSTUVWXYZ
ABCDEFGHIJKLMNOPQRSTUVWXYZ
小寫字母樣式
小寫字母樣式
abcdefghijklmnopqrstuvwxyz
abcdefghijklmnopqrstuvwxyz
色彩計劃
色彩計劃
設計系統
設計系統
* Ionex Core5 Navigation 的設計元件皆來自於 Ionex Design System，或是依照 Ionex Design System 的規範新增的。
* Ionex Core5 Navigation 的設計元件皆來自於 Ionex Design System，或是依照 Ionex Design System 的規範新增的。
設計產出
設計產出
設計準則
設計準則
1
清楚的
清楚的
1
1
視覺指示和文案需簡潔明瞭，文字保持一致性並易於理解，且在不同裝置下需注意大小。
視覺指示和文案需簡潔明瞭，文字保持一致性並易於理解，且在不同裝置下需注意大小。
2
一致性
一致性
2
2
指示和文字應與市面上多數指標一致，讓用戶可以依照熟悉的方式操作，同時遵循Ionex App的品牌調性，確保用戶體驗的一致性。
指示和文字應與市面上多數指標一致，讓用戶可以依照熟悉的方式操作，同時遵循Ionex App的品牌調性，確保用戶體驗的一致性。
首次使用流程
首次使用流程
我們會要求首次使用的用戶，先進行單位的設置，並預先下載地圖資源。（下載完成才會進入導航功能）
我們會要求首次使用的用戶，先進行單位的設置，並預先下載地圖資源。（下載完成才會進入導航功能）
首頁導覽
首頁導覽
更完整的內容與流暢的介面
更完整的內容與流暢的介面
主畫面覆蓋層提供三種狀態，根據用戶互動動態調整，收起或展開以滿足不同需求，增強可用性和效率。
首頁的 overlay 提供三種狀態，根據用戶的操作動態調整，收合或展開以適應不同需求，提升使用體驗與操作效率。
Overlay 的三種展開形式包括：
最小化狀態，適合專注顯示完整地圖或周邊地標資訊。
部分展開，能同時呈現部分地圖資訊與常用快速操作。
完全展開，則用於查看已儲存的導航選項，避免其他資訊干擾。
Overlay 的三種展開形式包括：
最小化狀態，適合專注顯示完整地圖或周邊地標資訊。
部分展開，能同時呈現部分地圖資訊與常用快速操作。
完全展開，則用於查看已儲存的導航選項，避免其他資訊干擾。
新增家/工作地址
新增家/工作地址
一鍵帶你回家！
一鍵帶你回家！
系統提供快速導航選項，用戶可以透過搜尋或拖曳地圖，新增自己的 Home 和 Work 地標，增設完後點擊後即可快速導航。
系統提供快速導航選項，用戶可以透過搜尋或拖曳地圖，新增自己的 Home 和 Work 地標，增設完後點擊後即可快速導航。
導航體驗
導航體驗
情境 1： 下班回家的路上買杯咖啡
情境 1:
在回家的路上順便喝杯咖啡
情境 2: 顯示電量預覽 及 充電路徑規劃
場景 2:
電量預覽和 充電路徑規劃
導航地圖上的即時電量預覽
導航地圖上的即時電量預覽
當裝置與機車的藍牙連線時，系統會在導航地圖上顯示機車的剩餘電量，用戶可依據電量狀態決定是否進行充電或換電。
電池狀態以顏色表示：
藍色: 50-100%
藍色: 50-100%
橘色: 20-50%
橘色: 20-50%
紅色: 低於 20%
紅色: 低於 20%
更直觀的充電導航體驗
更直觀的充電導航體驗
充電站對於電動機車騎士而言至關重要，尤其在長途騎乘時，常會面臨途中無法找到充電站的困境。
為了讓用戶騎乘更安心，我們在地圖中新增了鄰近充電站的快速導航功能。用戶可以查看充電站的剩餘電池數量及電量，並根據需求選擇合適的充電站。
充電站對於電動機車騎士至關重要，特別是在長途騎行中，沿途尋找充電站的挑戰常常出現。
為了確保用戶有更安心的騎行體驗，我們在地圖上新增了快速導航到附近充電站的功能。用戶可以查看每個充電站的剩餘電池數量和電力水平，提供多種選擇。
收藏您的喜愛地點
收藏您的喜愛地點
快速將家、公司或其他常用地點加入清單，方便日後一鍵導航。搜尋新地點時也能直接加入清單，讓您的導航更直觀、更高效，隨時為下一段旅程做好準備。
快速將家、公司或其他常用地點加入清單，方便日後一鍵導航。搜尋新地點時也能直接加入清單，讓您的導航更直觀、更高效，隨時為下一段旅程做好準備。
地圖管理
地圖管理
隨時隨地地查看地圖
隨時隨地地查看地圖
我們的地圖支援離線使用，方便隨時查看。用戶只需先購買並下載地圖資源，完成後即可在無網路環境下使用。
若需要使用其他國家的地圖，只需在商城購買並下載，重新啟動 iCore 5 Navigation，即可切換至新地圖。離線地圖雖需額外費用，但不受網路訊號影響，操作更穩定。而且只要在有網路時，地圖資源會自動更新，確保導航資訊始終準確可靠。
我們的地圖可以離線使用。只需購買並下載地圖，即可在沒有網路連接的情況下使用。
如果您需要其他國家的地圖，只需從商店購買並下載它們，然後重啟 iCore 5 Navigation 以切換地圖。離線地圖需要額外的費用，但無論網路信號如何，它們都能順利運行，並在連接到互聯網時自動更新。
學習與收穫
學習與收穫
這是我在公司獨立完成的第一個專案，過程中面臨了許多挑戰，特別是在技術整合和跨部門協作方面。我負責設計導航界面，並解決了與儀表板整合的技術問題，確保軟體的穩定性與未來擴展性。在這個過程中，我積極與硬體團隊合作，處理了許多複雜的技術細節。
此外，專案中也遇到了流程上的瓶頸。為了確保專案能夠按時推進，我主動協調各方，優化了工作流程並調整了優先級。儘管專案最終未能成功上線，但我從中學到了如何應對技術挑戰，並且加強了與團隊的協作能力。
這次經歷讓我深刻理解了設計與開發過程中的平衡，並提升了我在面對不確定情況下的決策能力。雖然結果不如預期，但這段經歷無疑是我專業成長的重要一環。
這是我第一個獨立專案，專注於設計導航介面並解決儀表板整合挑戰。我與硬體團隊合作，以確保穩定性和擴展性。
儘管該專案未能啟動，但它增強了我在協作、技術問題解決以及平衡設計與開發方面的技能。