一個專屬於職人咖啡
探索者的天地
讓客戶可以探索好咖啡店並使用虛擬貨幣：Caffè Coin 來支付咖啡費用，就是CC的存在價值 。
開始吧！
咖啡店觀察
需求單位告訴我們，他想要打造一個專職人咖啡推廣以及虛擬貨幣支付服務的App。他很明確的要求要有地圖能顯示所有合作店家，並具有購買和使用咖啡幣的功能。 於是我與產品團隊開始思考該如何呈現這個產品，首先，我親自前往一些咖啡店，進行觀察與靈感搜集。
“我只想喝杯咖啡，有什麼故事？”
我們的終端用戶為「顧客」，所以我實地參訪一些咖啡店（目標合作店），與願意分 享體驗的顧客交流，從他們如何選擇咖啡種類到使用的支付習慣和原因，並也與店員交流對照體驗差異，了解顧客在咖啡店的整體體驗。經過研究和討論，我們決定將重點放在那些在咖啡理念中更注重品質和特色的顧客身上，並設計了目標用戶畫像和同理心地圖。
喝咖啡的路
用戶旅程
設計
在我們對客戶樣貌有了更明確的了解後，我們開始設計用戶旅程，同時進行競品分析與商模分析，更深入地探索我們的App在不同階段能提供給客戶的機會。
產品樣貌逐漸清晰
系統地圖
確認服務雛形後，我與產品經理一起整理App所需的各項功能與導向， 建構前台顧客端的系統地圖，查看所有細節並繼續往下設計Wireframe和 UI 元件。
主流程重點架構
Wireframe
顏色代碼和系統
咖啡的感覺
為了調和利害關係人選擇的品牌顏色（黃色），並更直接地呼應咖啡的概念，我選擇了一系列源自「拿鐵」外觀的主色調，並設計了其餘的輔助色來建立色彩系統。
按鈕、輸入和文字
在設計過程中，我獨立創建了設計系統，以確保應用程式的按鈕和資產採用一致的顏色和樣式，以便開發人員遵循設計規範並建立整個APP視覺上的一致性和統一的美感。
細節的點綴
圖標和icon
用於地圖上與頁面各處的icon也同樣套用了系統樣式，並以各種小創意妝點，呼應icon的代表的功能。
任務完成
徽章設計
針對App裡有設計的一些任務環節，我也參照了相似的風格，著手設計了一系列用於任務頁和會員等級的徽章標示。
溝通與協調技能
從設計到開發
開發期間，我與我們的 PM 以及前後端開發人員緊密合作，以確保開發流程的順利進行。憑藉我豐富的經驗和設計方法，我可以有效率、清晰地溝通，並在需要時調整我的設計，於排程內完成合乎期待的成果。
設計/開發工具
Adobe illustrator, Photoshop, After Effect, Sketch, Zeplin
開發成果展示
地圖和商店
地圖和商店
店家資訊和搜索功能
Caffè Coin儲值和使用
最新資訊與行銷頁
包括橫幅banner和所有的KV設計。
任務活動
帳號頁與消費紀錄
票券系統設計
