放心初 APP 介面設計
[放心初]是一個線上的蔬果網站，還有提供雙北地區今日下單明日送到的服務。
在疫情期間接觸到這個 App，覺得店家本身的蔬果產品都非常的新鮮，但在使用網站以及 App 上卻覺得體驗上不是那麼順利，而且大部分習慣菜市場買菜的家庭主婦，轉換到網路購物上學習的成本比較高，也會容易放棄，店家其實東西不錯但因為介面問題讓用戶不再繼續使用服務，會覺得這點蠻可惜的。
於是我根據自己和家人體驗的感受，做了一個Side Project，改善整個流程和介面設計！
發現問題
-
底導航的狀態標 示不明確，容易重複點選或迷路。
首頁
點選底導航賣場
首頁點選底導航的賣場後出現上拉的選單，會不知道自己已經點選了，而“前往賣場”其實是不能點選的，首頁其實就是賣場。
2.點選底導航我的最愛後進到頁面，但想回到上一頁時卻不管上一頁是在哪裡都會進到會員專區的頁面？？？
點選我的最愛
點選回上一頁
3.兩個賣場的區隔不大，很容易不小心選好了商品卻發現不是自己想要的賣場服務。
雙北隔日配
全台宅配
4.訂單查詢的頁面，篩選完時間後沒有反應。
點選篩選器
篩選後畫面
5.想要修改密碼但進到會員專區裡卻找不到，必須要點選配送資料編輯才能找到，修改完密碼之後卻跳到電子券的頁面？？？
會員專區
配送資料編輯
修改密碼
修改密碼後畫面
6.付款的流程，覺得想要使用優惠但都不知道有沒有使用成功，要仔細看才知道價格有默默地扣掉紅利，填寫資料的時候會一直有卡關的感覺，覺得不順暢，使用完紅利折扣，點選下一步填寫資料，才跳出“請選擇付款方式的訊息”，這時必須關掉使用紅利的畫面才能繼續選擇付款方式。
點選使用優惠折扣
使用紅利折抵
使用紅利折抵
下一步填寫資料
用戶痛點
經由觀察家人和自己的使用經驗整理出以下幾個用戶痛點。
-
選購完商品時，常常發現我想要全台宅配卻選到了雙北隔日配的服務。
-
有時候會搞不清楚自己現在是在哪一個賣場
-
想要查看訂單或是店家出貨日期行事曆但是找不到
-
結帳的時候不知道怎麼使用優惠
User Story
雖然 APP 有非常多需要改善的地方，但我先針對幾個比較明顯的問題，縮小解決問題的目標條列出以下幾個使用者小願望。
-
我想要輕鬆選購商品，並且可以掌握大概什麼時候會收到商品。
-
我想要在結帳的時候輕鬆使用優惠。
-
我想要輕鬆的收藏喜愛的商品，並且可以加入我的購物車。
-
可以輕鬆查看商品的出貨流程
整理網站地圖
在前面有發現許多 APP 頁面錯置的問題，在規劃流程之前也先大約整理一下整體的資訊架構。
Before
after
規劃流程＆設定解決目標
我列出了三條從購買到付款完成可能的路線，和一條查詢訂單的路線，訂定為這次想要解決的主要目標。
Wireframe
改善的問題1-填寫收貨地址流程
將兩個賣場變為一個賣場，讓使用者在選購商品填寫地址時才出現“選取自己的收貨區域”畫面，因為原本是加入購物車時就會出現，在使用的感受上顯得蠻突兀的。將選收貨地址的步驟調整到付款的流程裡，先填寫訂購人資訊後才是收貨資訊。
Before
After
改善的問題2-底導航樣式
原本的底導航的狀態標示不明確，容易重複點選或迷路，改良底導航的狀態設計選取和未選取的樣式。
Before
After
改善的問題3-訂單查詢頁面
原本的訂單查詢頁面篩選完之後沒有任何反應，重新設計可以查詢許多狀態的訂單，從首頁到查詢訂單的流程，可以篩選時間，也能查詢各種不同的訂單狀態。未付款的項目也能夠輕鬆前往付款。
Before
After
改善的問題4-使用優惠折扣
付款的流程，覺得想要使用優惠但都不知道有沒有使用成功，要仔細看才知道價格有默默地扣掉紅利。解決方法是將使用優惠的方式重新設計，可以任意選擇想要使用的優惠。
Before
After
以下展示三條不同路線的購買流程
1.首頁>購物車（曾經逛來過在購物車有留下商品尚未結帳者）
2.首頁>我的最愛（曾經逛來過有存取我的最愛的使用者）
3.首頁>商品詳細說明 (在首頁瀏覽某項商品，然後直接加入購物車進行結帳者)
深色背景的Prototype展示
淺色背景和深色背景的 components 展示
以上關於放心初的 APP 優化建議，歡迎不吝指教！