專案背景PROJECT BACKGROUND
運動科學的實踐
台灣創明是一間專注運動感測技術的新創公司，擅長以科技輔助運動訓練。在這個專案中，我負責設計球賽的中控台介面。這個介面不僅可以讓紀錄員以按鍵或語音的方式進行計分、犯規次數、球員表現等比賽紀錄，還支援場上球員位置追蹤、狀態的即時顯示與回放功能。透過精準分析運動數據，系統能夠提供球隊進行戰術或訓練調整的有力依據。
這個專案在107學年度中學五人制錦標賽中進行了實際測試使用，並取得了良好的成果。
設計目標 DESIGN GOALS
考量操作效率與準確性的介面設計
在專案開始時，我會與客戶進行詳細的溝通，以充分了解他們對設計的期望和需求。對於這個球賽記錄專案，客戶強調在節奏快速的比賽中，記錄員需要能夠精確地紀錄賽況和球員表現。為了實現此目標，我特別著重以下幾點設計目標：
-
優化可讀性：提高資訊的對比度、選擇適當的字型、顏色和視覺效果，讓關鍵資訊即使在快速掃視中也能清晰顯示。
-
簡潔易用：設計直覺簡潔的介面，減少不必要的元素和複雜性，並增大按鈕尺寸，確保每次點擊都能正確觸發，避免出現錯誤操作。
-
強調視覺回饋：提供明確的視覺回饋機制，例如顏色變換、動畫效果或狀態指示燈，以幫助記錄員辨識比賽進行中、暫停、停錶、語音指令輸入等不同的系統狀態。
透過以上的設計目標，希望能打造一個操作效率高、準確性強的介面，以協助記錄員更好地進行賽事紀錄。
我的角色 MY ROLE
與客戶溝通確認操作流程後，我負責介面設計，並與工程師合作，提供開發所需的圖檔和介面規格定義。我們順利地將中控台介面應用於球賽中，並進行了實際測試。
客戶：台灣創明股份有限公司
專案需求：介面流程規劃與視覺設計
我的角色：UI 設計師
使用情境 USE CASE
球賽紀錄中控台介面
在進行設計之前，深入了解使用情境和需求是一個重要的步驟，以便確定關鍵的設計問題。對於這個專案，主要包含以下兩個使用情境：
設計流程 DESIGN PROCESS
1. 確認功能、頁面關係與互動元件
在與客戶溝通後，我會使用線框圖和流程圖確認介面設計的頁面、元件和狀態。線框圖可以幫助客戶直觀地看到各個頁面的版面結構和元件排列，而流程圖可以呈現使用者與介面的互動過程，有助於檢視介面的流暢度和使用者體驗。 這樣的做法可以提升效率，讓雙方更清楚地理解設計範疇和功能需求，以確保最終設計符合客戶的期望。
2. 頁面視覺設計與互動效果
在視覺設計上，我對於設計元素進行了詳細的定義：色彩規劃、字型、圖示、按鈕設計和圖片樣式。並且透過製作靜態圖檔或動畫的方式呈現，展現畫面細節和互動回饋。
這個專案的挑戰是在保持畫面元件不變的情況下，需要清楚呈現不同的狀態，如比賽進行中、暫停和停錶。為了解決這個問題，我使用了大面積的色塊變化，讓記錄員能夠快速掃視畫面並立即辨識中控台的當前狀態，從而提高操作效率和準確性。
比賽中
3. 定義版型與製作開發用圖檔
視覺設計定案後，我會進行以下工作：
-
分切不同尺寸圖檔：根據開發需求，將畫面元件裁切成不同尺寸的圖檔，以適應不同螢幕解析度和平台。
-
製作動態元件：如果需要增加互動效果，我會製作動態元件，例如動畫和交互元素，以提升使用者體驗。
-
提供版型定義：提供詳細的版型定義給開發團隊，包括元件尺寸、間距、顏色、字型等，確保介面一致性和品質。
這些工作將能讓設計在不同尺寸和平台上呈現出最佳效果，並協助開發團隊進行實做。
MOCKUP
頁面視覺模擬
