為了加強自己UI的敏銳度與製作能力也為了增加專案實作經驗，我參加了 AAPD 主辦的「UI 設計線上實戰營」。在不到一個月的時間內，小組必須選擇主題後產出一個高品質 UI 設計，從定義主題與問題到後期精稿製作與工程交付皆須合作完成。
專案中擔任組長，主要負責管控專案進度並定期招開會議，主要負責競品研究與所有記帳相關的 UI 設計，也主導稿件的標注與交付，並規劃簡報的內容，負責報告組內的設計作品。
◈ 擬定初步假設與目標
在開始設計之前透過使用者訪談與競品分析試圖歸納出主題與洞見。基於研究洞察，我們提出初版的產品脈絡與目標希望透過簡化記帳去解決使用者『難以持續記帳』的痛點。
初步假設
若使用上能更簡易，介面直觀易用，降低使用門檻後使用者便會容易執行記帳行為，養成習慣
目標
增加載具連結功能，並與銀行整合，能夠雲端同步資料，將資料自動匯入記帳。
用戶定義
目標用戶定義為20-35歲的年齡區間，此區間的用戶需要大量操作資金，並須妥善管理金流
◈ 挑戰｜設計遭質疑，面對並重新爬梳問題
初步的洞察與產品設計方向在經過第一次的 Design Review 後發現其實存在許多問題，被指導設計師點出：『市面上主打簡單易用的產品這麼多，但使用者仍無法持續記帳，該如何真正解決使用者痛點同時與其他競品做出差異與亮點？』
01
TA 範圍大，包含的記帳行為眾多
包含情境多元，以專案時程來說較難處理，沒有一個專門解決的痛點，看起來顯得平庸且毫無新意
02
與其他競品差異性不大
功能面與市面上的競品無異，看不出差異化，為何用戶要選擇我們的產品？
03
兜兜（角色）有特色但沒有融入產品
角色單純做為吉祥物使用，沒有過多其他延伸，不太清楚角色作用為何
04
商業模式不明確
沒有定義商業模式如何操作，對於產品功能是與銀行還是其他機構連結、使用者付費機制等方面思考不周全
一針見血的質疑不只推翻了先前的假設，更點出了產品方向的問題，於是我們決定重新梳理研究，嘗試重新定義產品脈絡並提出新的解決方案。
◈ 研究｜分析競品，找出突破機會點
我們選出幾個代表性的記帳軟體，進行功能面及產品特點的競品分析。
分析後發現，既有的產品都只強調功能性的服務像是主打簡單易用與整合金融機構服務，但未能進一步有強烈的特色。因此我們認為：建立一款有足夠功能性且具有強烈特色的記帳程式，在競爭激烈的市場中仍可以脫穎而出。
◈ 探索使用者真實痛點＆需求
為了解使用者記帳的動機與困擾，我們進行了使用者訪談，期待透過訪談更了解使用者
⭐
研究目標
📝
研究方式
線上問答
訪談人數：20 人
訪談時長：5-8分/人
📍
目標受訪人
・有記帳經驗
・曾經使用過財務相關軟體
・在意自身金流動向
・需要控管帳戶金流
💬
訪談架構
1 了解個人過去記帳行為
2 分享過去記帳遇到的困難
3 現在有無使用記帳軟體？
4 分享使用的記帳軟體或停止記帳的原因
在與 20 位受訪者進行訪談後
我們發現圍繞在「使用」層面的三個痛點
😫
記帳過程繁瑣，手動輸入資料容易覺得麻煩
🫠
記帳過程枯燥乏味，只有數字令人提不起勁，沒有慾望天天打開
😵💫
看不太懂圖表意涵，因此不會根據帳目去改變消費行為，記帳變得像流水帳一般，可有可無
💡How might we?
◈ 定義產品脈絡｜針對建議與研究洞察，整理脈絡
透過進行使用訪談與競品研究、分析記帳軟體下的評論等方式，我們發現很多使用者都有嘗試開始記帳的行為，但因為對於記帳這件事總感到枯燥乏味，且容易對記帳流程感到複雜所以難以養成記帳的習慣
因此我們除了簡化使用流程與介面之外，想在記帳流程中添加有趣的模式以及遊戲化的體驗去提高使用者的興趣，藉由提昇熱情與動力去培養使用者的記帳習慣。
↪ 我們的切入點
簡化記帳流程
簡化步驟，添加適當引導或處理流程順序，降低記帳難度
記帳自動化
使用簡快的輸入方式，配合載具發票消費輸入，減少操作阻力
讓使用者因為覺得「好玩」來製造開啟產品的動機，以養成機制培養黏著度
◈ 重新設定假設與產品目標
01
如果記帳過程變得有趣，包含遊戲元素，使用者將更積極地完成和持續記帳。
02
使用者對於記帳的需求主要集中在簡單、直觀的操作方式和即時的財務狀況呈現。
03
如果設置獎勵機制，使用者會更有動力持續使用記帳功能，以獲得更多獎勵和成就。
04
使用者會根據記帳產品提供的統計和報告，調整自己的消費行為和理財策略。
01
提供遊戲養成體驗，培養用戶黏著度與記帳熱情。
02
幫助使用者追蹤和管理個人收入和支出，提高財務意識。
03
透過點數機制創造商業機會，同時以點數獎勵幫助使用者養成每日記帳習慣，不再懶於紀錄。
04
分析使用者的消費習慣和花費模式，提供個性化的理財建議和報告。
◈ 產品定調輕鬆，但保有功能與實用性
我們以功能複雜程度與產品風格做為象限指標，將市場上競品擺上後設定我們的目標定位，希望打造一款初心者易上手且風格輕鬆愉快但又不失功能性的產品。
◈ 重新定義使用者輪廓
原先設定的TA年齡層為18-35歲，涵蓋的記帳情境較多元且複雜，因此我們針對建議與洞察，更改目標受眾，將產品目標族群修正為18-25歲，此年齡範圍的記帳行為較單純 ，希望在使用者在理財初期就能建立記帳習慣。
👨🏼🎓 年輕用戶、初次理財者 (18-25歲)
01
大學生
因為打工和開始獨立生活需要控管金流，但不知該如何開始。
02
初次理財者
雖然有工作收入，但可能是第一次認真考慮理財和財務規劃的群體。
03
樂於嘗試
這個年齡段的用戶通常熟悉智慧型手機APP，樂於嘗試新的科技解決方案。
04
缺乏經驗
有能力也有需求進行理財，但可能缺乏系統的財務管理知識和經驗。
◈ 設計遊戲機制，目標提升連續使用天數
用遊戲的行為建立使用者的興趣，我們以記帳賺取經驗培養角色為主軸，輔以圖鑑搜集，並對齊產品目標，以『培養使用者的記帳習慣』為目的，因此連續使用天數是我們首要的觀測指標。
↪ 角色養成系統
01
經驗值累積
使用者每進行一次記帳，就可以獲得經驗值，這些經驗值可以用來升級角色。
02
角色進化
當經驗值達到一定標準時，角色可以進行進化，變成不同的形態或新角色，例如從可愛的精靈變成一位強大的勇者或精明小麵包，讓用戶感受到成就感和進步。
↪ 獎勵機制
01
日常挑戰
設置每日或每週的記帳挑戰。例如「連續7天記帳」、「某天記錄所有開支」等，完成挑戰後可獲得特別獎勵，如道具或角色升級機會
02
記帳獎勵代幣
根據使用者的記帳時間和頻率提供代幣，這些代幣可以用於購買道具或角色，增加用戶投入感。
↪ 登入及活躍機制
01
每日簽到獎勵
設計一個簽到系統，每日登入即可獲得小獎勵，連續簽到可以提高獎勵內容或數量，保持用戶的活躍度。
◈ 遊戲化機制下思考商業模式
我們設計了角色的商城系統，從商城系統與點數與經驗的機制延伸出不同的商業模式。並依兜兜價格和獎勵禮包價格去制定級距，用優惠遞增的方式去促使使用者花越來越多的錢購入點數，也加上進階功能的服務，滿足進階使用者的需求。
01
虛擬商品
實物化
使用者可以透過商城兌換合作品牌的實體商品，如兜兜造型麵包
任務系統
設置與合作店家相關的任務，如「在XX麵包店消費3次」
消費回饋
在合作店家消費後，掃描發票載具可獲得額外獎勵或專屬優惠
◈ 設計原則｜利用角色設定制定設計原則
將產品取名為兜兜Dough Dough，發想自英文「Dough」「Dough」在英文中不只是「麵團」，還有「錢」的意涵，就像麵包是我們每天都需要的生活必需品，呼應記帳主題。因此我們由麵包/吐司的視覺概念延伸出一個主要的視覺角色，創造產品的獨特標誌性。
基於品牌視覺和角色設定，我們訂定了以下原則：
01
舒服活潑
對於產品的使用者介面，必須設計出易於使用又好看的界面，讓使用者有探索的慾望與持續開啟產品的熱情。
02
生動有趣
在每個頁面都要隨時注意元件的狀態與互動行為，確保不讓使用者感到枯燥乏味。
03
清晰明確
如收支分析、記帳項目都要以清楚的方式將資訊整理，呈現給使用者時須確保易讀性與辨識度。
◈ AI工具輔助，加速製作時程
由於此專案為 UI 設計實戰營中期限兩週的畢業專案，為了克服這個限制，我們大量用AI工具輔助設計執行，獲得了初步想法和洞察後根據產品目標再做細部調整，以確保我們在能在短時間內交付一個完整的設計解決方案
角色
Midjourney
Icon
Recraft
心智圖
Whimsical
主題音樂
Suno
控制指令，讓ＡＩ生成的圖形符合期待
先以我們的產品名稱開始發想，關鍵字主要下跟麵團 Dough 或是麵包 Bread 相關的內容。 為了跟上近期的潮流，也比較貼近我們目標使用者的年齡層，風格是選擇偏3D（C4D）又帶有一點娃娃感（Plush)的人物風格。
前期只是生成一個普通的兜兜人物，遇到的困難是需要讓人物延伸做出差異化的同時又要保有原本的人物形象及一致性。從不同口味到不同職業，中間花了蠻多時間一直重複生成，才漸漸的變成有打工者形象或是魔法使稀有兜兜。
👍🏼
無法預想AI會生成什麼內容，讓創意可以發揮到極致
🤔
因為無法預測所產生的內容，需要時間學習如何控制AI
💡
使用參考圖，讓AI去參考做延伸
付出耐心，有可能一張圖會花半天時間才能產出滿意的
控制指令，讓ＡＩ生成的圖形符合期待
我們先以兜兜(視覺角色)為主體，調整介面與ICON元件。ICON我們使用 Recraft AI生成 ，考量兜兜的角色立體度，在風格上一樣選擇用較為立體感的 Icon （陰影/漸層），且維持相同澎潤的視覺感受，達到畫面上的和諧與一制性。
介面部分我們主要以乾淨簡單且易讀為主，讓使用者能夠在閱讀與理解上更加方便，並適當穿插兜兜的插圖，使用者能在各處挖掘到不同型態的角色，加強產品形象同時也增添賞玩的樂趣。
◈ 測試與迭代｜經由回饋出發，持續優化介面
設計完成後，我們將產品交由使用者試用，透過指導設計師的意見與用戶實際的回饋，對幾個核心頁面進行不斷的迭代優化。
01
主頁
A ｜背景
弱化背景，讓視覺目光更聚焦在角色身上
B ｜總覽
調整前視覺比重較平衡，但考量希望使用者能快速抓到本月收支虧盈狀態，將視覺層級著重在『結餘』
Ｃ｜記帳按鈕
功能重要且希望使用者立即點擊，視覺上改以強調色呈現
Ｄ｜ICON
原先ICON雖立體，但線條複雜，手機顯示螢幕小容易在畫面上糊成一塊，收斂顏色與線條使用，並將顏色稍為加深，加強視覺上的辨識度。
02
記帳頁面
A ｜分類卡片
來回調整卡片的樣式，增加圖示與類別文字間的間距，放大空間後創造畫面裡的空間流動，同時將『新增』弱化成灰色，呈現他的不同，但又不會搶去焦點
B ｜鍵盤
前後大幅收斂了使用顏色讓使用者更專注於輸入，並且調整功能按鈕間的排序，安排使用邏輯與視覺平衡。
經過多次迭代改版的記帳頁面
On Boarding ｜初步了解產品
在用戶最初進入前介紹產品主要三大特色，引發興趣
記帳融合遊戲化元素
記帳完成後使用者可獲得點數及經驗值培養兜兜，若角色到達特定的升級門檻則會引發進化，用進化機制提高使用者累積經驗值的慾望。
🔸
機制上思考到成長若跟帳務類別掛鉤的話可能會形成使用者做假帳去養出想要的兜兜（研究發現多數人記帳都只與吃或交通有關）
因此將成長幅度則跟記帳天數做掛鉤而非記帳筆數，同樣呼應到吸引使用者每日記帳養成習慣的目標
透過AI助理提供財務分析與建議
分析頁面中可查看支出與收入和收支的趨勢總覽，總支出金額置中於圓餅圖的中心，下方則為各支出分類並依照比例排序 (最多至最少)。
融合AI助理，透過分析紀錄的帳務明細來分析個人的金融狀態，提供財務經驗稀少的使用者更明確的理財方向。
🔸
當使用者紀錄1筆記帳資料時，則可使用兜兜分析的功能，如記帳筆數低於 30 筆則會鼓勵使用者多多紀錄，才能提供更完善的建議
豐富的遊戲體驗，加強情感連結
上方遊戲區域可與角色互動，並且建立相對應的遊戲分頁。同時也建立搜集角色的機制，使用者可透過點數抽取更多不同型態的角色進行培養來完成圖鑑搜集。
🛍️
商城：點數兌換、角色抽取、實體優惠
📖
圖鑑：角色搜集、背景故事、進化歷程
🏆
獎勵：角色成就、獎勵兌換
🧾
任務：每日登入簽到、每週任務
✏️
編輯：變更角色名稱、替換角色與背景
◈ 榮獲 TOP2 優秀專案
評審們以UI設計、UX設計、設計原理與脈絡、設計稿細節、技術可行性與畢業專題簡報內容呈現這幾點為主要審核要點，審核後以Ａ－Ｅ做評級，並於 47 組中評選出 4 組優秀專案，最終我們榮獲Ａ評級的優秀專案。
◈ 學習與反思
組員退出，調適心態並在有限資源下盡力發揮
專案分組採隨機分配，不幸的我們這組被分配到一位神隱學員，嘗試溝通與尋求協助後仍無果，最後認清我們組內就是只剩下四個人，因此我請各位組員寫下彼此對於專案的想法並盤點工作項目，對齊大家對於專案的期待與目標後鼓勵大家繼續前進。
在這次專案過程也深刻體會到，並不是每次的工作進行都會是順利無比，有時會遇到自己無法掌握的情況，懂得調整自己的心態並認清現實，不拘泥於不可控的事物才是繼續前進的唯一解方。
冷靜思考，大膽的嘗試與突破
此次專案過程在第一次Design review後被提點出產品無亮點，在後續腦力激盪與重新梳理後才提出『遊戲化』這個大膽的假設與可能，對組內都是Junior設計師的我們無疑是一大挑戰，起初也非常擔心產出與過程中可能會遭遇到的困難
『遊戲化』像是雙面刃，雖然拿捏遊戲與記帳的比例也許難度較高，但成功的話卻會是一大亮點並能呈現出我們與競品的差異，在專案完成後的回饋也確實驗證了我們的想法，也更體會到若做好完善的事前準備，危機點也可能會是一大突破點。
