top of page

Cash Craft

In a group of 4, the task was to create a fully functional mockup of an application of our choice. Our idea was to create a gamified budgeting app for students to manage their finances called Cash Craft. The functional prototype was created in Figma.

Planning

A persona of someone in our target audience was created to map out user goals within our application. From there we created paper prototypes of different features of Cash Craft

Screen Shot 2026-01-05 at 1.02.37 PM.png

Paper Prototypes

pic1.jpg
Screen Shot 2026-01-05 at 1.11.18 PM.png
Screen Shot 2026-01-05 at 1.11.11 PM.png
Screen Shot 2026-01-05 at 1.11.27 PM.png

The paper prototype showcases how the user would login to their bank account, view & create a budget, then redeem their points to customize their character.

Hi-Fi Mockups

High-Fidelity mockups that were created in building off of the paper prototypes. These established how the final app is going to look when developed in Figma. 

Logging into your personal banking.

Screen Shot 2026-01-05 at 1.21.45 PM.png

Creating an account.

Screen Shot 2026-01-05 at 1.21.49 PM.png
Screen Shot 2026-01-05 at 1.21.56 PM.png

Filtering spending.

Viewing budgeting quests and redeeming an item for your character based on how many points you have.

Screen Shot 2026-01-05 at 1.22.02 PM.png

Creating a new budget.

Screen Shot 2026-01-05 at 1.22.09 PM.png
Screen Shot 2026-01-05 at 1.22.14 PM.png

View budget progress and statistics.

Screen Shot 2026-01-05 at 1.22.31 PM.png

Financial learning.

Final Application

Once the high-fidelity prototypes were completed, the final application was created using Figma. Below are some snapshots of the application

Password is HCIgroup7!

Creating an account.

Screen Shot 2026-01-05 at 1.43.11 PM.png

Creating Budget categories.

Screen Shot 2026-01-05 at 1.43.40 PM.png

View spending patterns.

Screen Shot 2026-01-05 at 1.43.49 PM.png

Viewing quests & redeeming a prize.

Screen Shot 2026-01-05 at 1.44.18 PM.png
bottom of page