Step 1

需求確認

Step 2

繪製線框搞

Step 3

易用性測試

Step 4

繪製頁面

易用性測試

當「待發布」的日期到來時，系統會自動推送相關內容。

點擊『新增』即可進入到新增等級的畫面。

點擊『+號』新增等級。

系統最一開始的顯示畫面。

點擊『送出』即可儲存返回到顯示頁面。

點擊『X號』刪除等級。

發佈時間未到前都可以編輯。

點擊『返回』或『儲存』即可返回到顯示頁面。

按下『全部刪除』把整個設定刪除。

當達到發布日期時，系統將自動推送相關內容。

預計2024/12/01發佈會員分級規則

包含『待發佈』和『發佈中』規則的畫面。

現行會員分級規則

查詢無結果的頁面。

點擊『補充點數』即可進入到補充點數的頁面。

點擊『送出』即可儲存。

若成功會儲存

並詢問是否要再新增一筆。

若失敗會請使用者再檢查一次輸入的資料。

點擊『批次匯入點數』即可進入到

批次匯入點數的頁面。

『範例下載』可以看檔案的格式，

選擇好檔案點擊『上傳檔案』。

按下送出就會跳出成功的Dialog，

並返回查詢頁面。

商品贈點查詢頁面。

查無資料。​

選擇『指定門市』和『成立商品』。

在「適用門市」和「試用商品」中

可以選擇『指定門市』和『成立商品』

或是​『批次匯入門市』和『批次匯入商品』。

會出現『選擇門市』『選擇商品』的按鈕。

『選擇門市』『選擇商品』的頁面一樣，

挑選一張來​講解​。

代表已選擇商品。

已選擇的商品。

代表未選擇商品。​

點擊『X』即可刪除商品。​

代表商品分類已展​開。

Hover的效果。

點擊右上角『送出』。

批次匯入失敗的畫面。

會顯​示資料錯誤的原因。

變更​密碼的畫面。

按下『送出』​。

變更失敗的畫面​。

變更成功的畫面。

並跳轉到登入頁面。

因為要減少首頁的功能，

所以需要重新繪製首頁。

改變的地方有兩處：

• 中間功能按鍵
• 底下的導覽攔
  

訂票服務的圖標在車票上增加了一個​錢幣的設計，使人一目了然地知道這​是購買票券的標示。

車票的圖標內包含客運設計元素，以​強化國光客運的品牌印象。

因為功能縮減，所以導航欄的功能也​跟著​減少。

首頁的圖標內也包含客運設計元素，​以強化國光客運的品牌印象。​

我們將按鈕形狀從圓形改為方形，旨在提升​使用者在單手操作手機時的便利性，同時擴​大了按鈕的觸控範圍，讓操作更加精確和直​觀。

我們在設計中加入了國光客運的車子實體，​不僅有效地填補了板面空間，還提升了使用​者對國光客運的印象。

這一設計不僅美化了界面，也增強了品牌的​可視性和認知度。

選擇​付款頁面

掃描​商品條碼

掃描​商品條碼