關於此 APP 的開發背景與設計流程請看: App｜旅日匯率記帳簿開發過程(上)
1. 管理旅行
在 APP 的起始，會自動導引使用者新增一筆旅行，新增完旅行後便會開通記帳功能，產生天數進度條，自動為使用者規劃每日預算。可於導覽列查看目前旅行與切換/編輯旅行。
2. 匯率計算
匯率計算機能夠幫使用者計算日幣與台幣之間的轉換，並提供折扣和稅額快速鍵的功能，與加入常用計算的功能，省去重複輸入的麻煩。計算完後可將考慮購買的品項快速分類並加入購物車，方便分辨每筆金額大概是什麼品項。另外，考量公平性原則，快速分類與備註功能是可關閉的。
3. 待買購物車
在匯率計算頁所加入的品項，都會顯示於購物車頁面，在此頁面提供每筆品項更詳細的分類，與統一編輯的快速功能。另外因應日本國情，也做了快速退稅的功能，讓使用者不用再拿出購買明細逐筆查對稅額再逐筆減去，一鍵即可輕鬆完成退稅。
4. 記帳頁面
在購物車內確定購買品項後，即可加入記帳，在記帳頁面分為三大區塊：
- 花費項目圖表與總計金額，圖表點擊類別顯示佔比
- 每日預算進度條，依照旅行預算與天數動態顯示
- 總計與個別天數卡片，點擊可進明細頁查看詳細項目
5. 側選單
6. 使用教學
使用 Tabs 將使用教學按類型分類，方便使用者找尋，提升易用性。另外，之後第二階段優化，則是希望在各頁首次進入時置入該頁的使用教學，漸進式教育使用者。
在開發上遇過的問題
1. 效能卡頓
在製作過程中，遇到不少效能問題，比如添加常用記錄，原本沒有添加的數量限制，但使用React Native專用測試軟體Expo go進行測試時，發現累積到20個就會出現瀏覽卡頓的問題，原本考慮使用一次顯示5個，到下一階段會有一段時間的loading，但實際測試覺得使用感受不好，加上超過10個常用記錄時，就很少有機會被使用者點擊，失去常用記錄的效果，不如直接限制添加10個紀錄上限。
2. 使用者習慣
在設計計算機鍵盤時，一開始很直覺的將數字1~9從上排到下，但後來在測試時發現常有誤按的問題，發現原來是計算機與一般電話鍵盤排列順序是相反的，因此會有習慣誤按的問題。
3. 教學畫面的布局
原本規劃將所有教學集中在APP開頭，但發現把所有教學集中在開頭，使用者記不起來，也不會認真看，因為多數人下載APP後只想趕快開始試用好不好用，所以開頭教學多半會被快速略過。
討論結果: 將APP教學分散在各大頁面首次進入時，逐步導引而非一次教完。而 APP 開場畫面變成是介紹此 APP 的幾項大功能。
感想與結論
1. 發掘使用者問題背後的問題
單問使用者關於旅費控管的感想，大部分只會反映較表面的問題，如: 每次預算都不夠用，只好忍痛放棄很多原本規劃好、想買的東西。
不過，深入訪問後，我們發現很多反映旅費不夠用的人，最後旅費其實都是有剩餘的。原來使用者的購物行為會有旅程前中後段的變化: 前幾天容易因興奮、新奇的衝動情緒購買太多，中後段才緊急剎車，但卻容易因過度節省，導致旅費到最後一兩天發現其實剩的比預期的多。
經過以上訪問，才知道原來大多數使用者真正的痛點是在於「不清楚每天的預算上限」。因此根據此痛點，我們設計了可視化的每日預算上限進度條功能。
2. 回饋感與容錯性很重要
a. 回饋明確性(Feedback Clarity): 不管是加入購物車、設定成功、加入記帳成功…最好都有按鈕樣式的變化或 Dialog 提醒，讓使用者明確知道自己有操作成功。
b. 容錯性: 在做任何重大改變時一定要給予二次提醒與回復的空間。例如執行退稅時，需要彈出再次確認視窗，提醒退稅的項目有多少、是否確定退稅，退完稅也有取消退稅的回復按鍵，才不會造成不可返回的錯誤。
3. 每種可能會發生的狀態都要考慮到
在設計介面時，一個介面或元件可能會有好幾種不同的呈現狀態，如: 空值畫面的設計、備註欄的字數限制(一行最多字數多少?超過是否換行?…)、按鈕的點擊範圍、進度條若過多節點該如何顯示?(如:最多顯示10個節點，那若為30天就以3天為一個節點)
這時候就可以先把所有可能會影響介面呈現的狀態列出來，最後交付設計時，再製作清楚的 Spec 告訴工程師什麼狀態下會顯示此畫面。( 深深體會到 FSM 表格的重要性，工程師表示有這款表格就會好懂多了 )
4. 一個好的設計也要兼顧效能
如以上有提到的在設計「常用記錄」功能遇到的效能卡頓問題，據工程師所言，一個介面若同時要渲染太多元素就很可能會有效能問題，因此「精簡」在設計上就是很需要琢磨的點，不僅能提升效能也能讓使用者更專注在重點功能。
5. 反省
老實說，和朋友在開發此款 APP 時，單純只是想解決自己去日本旅遊遇到的問題，順便當作練習與累積作品集，並沒有非常詳細的考慮商業價值，以及這款APP的上架和維護花費跟能夠賺到的利潤等等…不過一個完整的產品開發，應該是得先做好全盤的研究，這部分感覺還是得花很多時間來努力學習呀(遠目)
感謝收看! 想看更多的設計流程，請至: 旅日匯率記帳簿開發過程(上)
