《記帳城市》是一款結合城市經營遊戲的記帳 App,希望把枯燥乏味的記帳過程變得有趣,讓使用者經營城市的同時也慢慢累積自己的財產。
《記帳城市》中的進階付費功能「財務長計畫」在今年七月進行了一次重大的改版,「Fourdesire 生活遊樂場」當天由助理製作人龍昀(Sammy)和設計師高安麒(Andy)分享全新「財務長計畫」的設計脈絡。
使用者研究
《記帳城市》於 2017 年推出至今,團隊長期從使用者反饋中觀察到:使用者成功維持記帳習慣一兩年後,會開始思考要如何進一步理財。但是在這個過程中,卻常常面臨「不知道該從哪裡開始省錢」、「省了這裡,花了那裡」的挫折感。
延續 Fourdesire 的核心理念,全新「財務長計畫」的初衷是:
透過「玩心設計」增加理財動機,幫助使用者從「記帳」進展到「理財」,進一步達成理財目標!
《記帳城市》團隊歸納出使用者經歷的理財旅程
為了定義問題,團隊著手進行使用者研究並接觸各種類型的使用者,包含:
- 剛開始記帳的新手
- 已經規律記帳一段時間的使用者
- 積極學習如何理財的使用者
- 理財專家(例如:財經部落客)
從研究中,團隊將使用者的理財旅程大致分為:
- 了解花費:透過記帳了解自己每個月大約花多少錢?都花在哪裡?
- 省思:開始分析檢討自己的消費方式並積極學習理財
- 執行策略:實際調整自己的消費方式,擬定省錢策略或是設定預算
團隊發現從「理財初心者」到「理財專家」的關鍵是:有沒有系統性回顧自己的花費並擬定理財策略。綜合上述發現,新版「財務長計畫」的重點是:
幫助使用者從「了解花費」階段,進展到「省思」與「執行策略」階段。
機制設計:前期發想
找到有待解決的關鍵問題後,團隊接著定義出機制的方向:讓遊戲角色扮演使用者的理財專員,給予簡單直接、良好的引導。
在最終機制成型之前,團隊嘗試過幾個不同的設計方向,包含:
- 省思(跟別人比),例如:使用者的午餐花費與「台北市平均午餐花費」相比是較高還是較低?
- 省思(跟自己比),例如:這個月的娛樂費用增加了,使用者需在 5 秒內回想是哪一筆花費造成費用增加。
- 參考美國教育網站,讓使用者區分每筆花費是「想要」與「需要」。
最後團隊決定的機制是:讓錢喵喵帶領的市政團隊陪伴使用者回顧花費,並參考五隻角色不同的個性,分別對應到不同的回顧面向。
機制設計:最終版本
說明了前期的發想脈絡後,下半場由設計師 Andy 分享如何將不同角色對應到不同功能。團隊主要參考藝術家為五隻角色設定的個性、人生觀或背景故事來決定該角色適合的功能。
由錢喵喵為使用者介紹最基本的圓餅圖分析
錢喵喵是使用者在進入 App 時最先接觸的角色,因此負責最基礎的圓餅圖分析功能,幫助使用者簡單回顧支出的類別。
勤儉努力的牛青年:引導使用者設定並追蹤預算目標
而牛青年是努力打工的大學生,由於打工族的薪水不高,更需要謹慎設定花費預算,因此他的任務是帶領使用者設定預算並時時追蹤花費進度。
謹慎細心的鷹主管:提醒使用者控制花費頻率
每天一杯咖啡看似是小錢,但是長期累積下來也會變成可觀的花費。個性謹慎細心的鷹主管會替使用者找到高頻率的小額花費,並鼓勵使用者嘗試降低花錢頻率達到省錢目的。
掌握情報的狐老大:發現支出趨勢變化
在城市中負責蒐集情報的狐老大則負責替使用者分析支出變化,例如:發現「娛樂」費用比上個月多出了 50%,提醒使用者接下來可以密切留意以免花費破表。
容易手滑的魚局長:幫助回顧支出是「想要」還是「需要」
最後是愛亂買東西、容易手滑的魚局長,也是 Andy 自己最喜歡的角色。參考前面提到的專家建議,魚局長會幫助使用者逐一回顧自己的每一筆花費是「想要」還是「需要」。
介面設計:支出回顧功能
Andy 接著分享「支出回顧」功能的介面設計過程。團隊曾考慮讓使用者區分「想要」、「需要」與「儲蓄」,但後來覺得「儲蓄」概念會讓功能太複雜,因此只保留「想要」和「需要」兩個面向。
團隊曾想用天秤意象來呈現「支出回顧」功能
另外,團隊曾嘗試在畫面中將「想要」和「需要」分別放在天秤兩端,後來發現天秤的意象會讓使用者想維持兩端平衡,但「想要」和「需要」的平衡並不是這個功能的目的。Andy 最後透露,他從知名交友 App 獲得靈感,參考它左右滑動的操作方式,讓使用者左滑就可以把支出分類至「想要」,右滑就可以分類至「需要」。Andy 半開玩笑地表示::
因為大家(包括我自己)都很熟悉交友 App 的操作模式,對使用者來說學習門檻也比較低。
「支出回顧」介面的靈感來源其實是知名交友 App!
最後 Andy 再次提到演講開頭所說:「財務長計畫」設計初衷是透過「玩心設計」來加強使用者的理財動機,因此團隊也在機制中加入遊戲元素:使用者使用回顧功能到達一定次數後,就可以解鎖各種角色代表物品,並收藏在角色的房間中。
使用者只要時常回顧花費,就可以蒐集遊戲角色的代表物品
現場 Q&A
- Q:設計師設計產品時都會預想使用者的行為,但有沒有遇過使用者實際操作方式跟當初預想的完全不同呢?
- A(Andy):前面提到「支出回顧」功能可以左右滑動卡片來操作,但後來團隊邀請從未使用過「財務長計畫」的使用者來測試,發現四位受測者中沒有人知道卡片是可以左右滑動的,反而是直接點擊按鈕;Andy 推測或許是介面上給的提示不夠多。另外團隊發現許多使用者會將城市建築物排成有趣的圖案(例如愛心)或文字,並在網路上和他人分享,是團隊當初沒有意料到的有趣現象!
關於 Fourdesire 生活遊樂場
Fourdesire 一年一度的使用者見面會「生活遊樂場」是團隊與使用者近距離交流的珍貴機會!今年的第三屆「Fourdesire 生活遊樂場」,團隊與 150 位熱情使用者分享「玩心設計」的核心理念以及產品製作的點點滴滴,邀請大家一起成為生活玩樂家!
閱讀其他活動紀錄:
- 走在登月 50 週年之後:Walkr 的新探險(上)|Fourdesire 生活遊樂場活動紀錄 #1
- 走在登月 50 週年之後:Walkr 的新探險(下)|Fourdesire 生活遊樂場活動紀錄 #2
- 雨後新生的植物保姆:新舊設計師對談|Fourdesire 生活遊樂場活動紀錄 #4
- 替你的生活帶來玩心|Fourdesire 生活遊樂場活動紀錄 #5
了解更多 Fourdesire 玩心設計:
- Fourdesire http://fourdesire.com/
- 《記帳城市》http://fortunecityapp.com/
- 《Walkr》http://walkrgame.com/
- 《植物保姆》https://plantnanny.app