Spare: the tracking and savings app that gets you there
A branding and UX/UI concept case study.
A branding and UX/UI concept case study.
The personal finance market continues to evolve, with users seeking more than just tracking – they want guidance, motivation, and a clear path to their financial goals.
This project began from scratch as part of my UI Immersion program at Career Foundry, allowing me to apply comprehensive brand development alongside UI design skills.
The opportunity was twofold:
SPARE is a money savings app built on a simple premise:
Dream. Spare. Achieve. Repeat.
The app recognizes that meaningful goals require consistent effort and provides users with the tools to take control of their finances, save effectively, and accomplish their personal objectives.
“Money does not control you.
You control your money.”
To help users save money by better organizing and understanding their finances, setting goals, and developing more conscious saving and spending habits.
The brand identity establishes a supportive, educational, and trustworthy foundation while maintaining an approachable personality.
• Supportive and motivational • Helpful and educational • Friendly and respectful • Uncomplicated • Trustworthy
The color strategy employs intentional psychological associations to support the app’s financial purpose:
Vibrant green serves as the primary brand color, representing income and growth with a modern energy that maintains user motivation.
A softened red indicates expenses without discouragement – acknowledging financial setbacks while encouraging continued progress toward goals.
Golden yellow highlights achievements and milestones, creating moments of celebration throughout the user’s financial journey.
Muted blue delivers stability and trustworthiness for informational elements and interactive components.
Dark gray and light gray complete the system, providing content hierarchy and ensuring optimal readability across all screens.
“Money is not the thing. It is the thing that get us to the thing.”
The visual language focuses on outcomes rather than currency:
“As a new user, I need to create a personalized profile so that financial advice matches my spending habits and goals.”
“As a user, I want a visual dashboard of my finances to understand my spending patterns at a glance.”
“As a user, I need to define my savings goal and timeline to develop an appropriate savings plan.”
“As a user, I want notifications and rewards for reaching milestones so I can track progress toward my goal.”
Initial wireframes established core functionality and information architecture, focusing on user flow and content hierarchy.
A cohesive component library was developed to ensure consistency across the application while maintaining platform-specific guidelines.
The refined designs incorporated the full brand identity, with attention to visual feedback mechanisms and milestone celebrations.
The comprehensive design system extended beyond mobile to include tablet and desktop product landing pages, serving as additional destinations for marketing campaigns.
Product App mockups were developed to showcase the application’s capabilities and reinforce the brand promise of financial empowerment.
The final deliverables provided:
This concept project was proof that working with focus, clear goals and deliverables, and an agile mindset, a lot can be done in under two weeks. From concept to brand design and full brand style guide, to user flows, mid and high-fidelity wireframes, and full app design, plus supporting marketing materials, even working on a team of one I was able to ship consistent and meaningful deliverables every step of the way.
The result was not only a testimony of my Swiss knife like skillset, but also a concept project ready for development.
Interested in collaboration, or just want to chat about design?
Then reach out and let’s talk.
