Signals Hero.

Centible - Savings Goals

Team
Yae Young Kim
Sanjana Gopalswamy
Johanna Lomus
My Role
UI Designer
Tools
Figma
Notion
Timeline
4 Weeks

01. Overview

Context

Saving is a long game—and often a quiet one.

Most savings tools emphasize the end result: a number, a threshold, a completed bar. For users trying to build healthy financial habits, the challenge isn't just how to save, but how to stay with it. Numbers alone rarely sustain motivation. What's needed is a way to make progress feel real—even when the finish line is far away.

Centible wanted to introduce a new savings feature that respected this emotional journey. It had to feel simple, but thoughtful. Lightweight, but persistent. A feature designed not for perfect savers, but for committed ones.

Goal

Create a savings goal experience that helps users:

1. Set intentional financial goals (vacations, emergency funds, large purchases)
2. Track and visualize progress in a way that feels clear and encouraging
3. Feel emotionally reinforced by their consistency—not just by hitting targets

It needed to live within the broader Centible ecosystem, integrating smoothly into the budgeting flow while offering enough autonomy to feel personalized.

02. Process

1. Setting a Goal

The flow begins with a simple prompt: What are you saving for?

Users create a goal by:

  • Naming it ("Emergency Fund," "Thailand Trip")
  • Setting a target amount
  • Optionally adding a note
  • Optionally logging any existing savings as a starting balance

We intentionally kept this flow minimal. Conversations during early design reviews surfaced the need to reduce friction, especially for users new to structured saving.

We consolidated "Do you have existing savings?" into the new goal flow (instead of a separate screen) to avoid interrupting momentum.

2. Manual vs. Linked Deposits

Once a goal is created, users update their progress by logging deposits—either manually or via linked accounts.

We explored three implementation paths:

  • Manual input (MVP): Most direct and flexible; users add deposits anytime they save.
  • Linked savings account via Plaid: Automatically attributes transfers toward goals based on rules. More seamless, but higher technical complexity and risk of misattribution.
  • Percentage-based automation: E.g., "10% of any deposit goes to savings goals." Simple for users but blurs the boundary between spending and saving accounts.

We prioritized manual entry for the initial release. It gave users control, required minimal backend complexity, and avoided the confusion of automated withdrawals. Smart allocation rules via Plaid were logged as a future enhancement.

3. Visual Feedback

Savings progress is visualized through a clean progress bar or percentage wheel. This made progress tangible and satisfying, even if the numbers were small.

Each goal screen displays:

  • Goal name + editable note
  • Target amount + current progress
  • Estimated completion time (based on deposit history)
  • Deposit log (manual + linked, with dates and amounts)
  • Optional motivational insights (e.g. "You've saved $200 this month!")

Progress visualization was designed to feel fluid, not mechanical. Completion estimates offer orientation without pressure.

4. Dashboard + Goal Management

Goals live in a consolidated dashboard view, where users can:

  • See all active goals at a glance
  • Toggle to show/hide completed goals (inspired by the iOS Reminders app)
  • Tap into any goal for deeper insights

We originally considered using category icons for each goal (e.g. plane for travel, piggy bank for emergency), but this created confusion with spending categories. Instead, we adopted a universal icon with color customization, giving users a small moment of ownership.

Color-coding let users bring personality to their goals without cluttering the UI.

5. Reinforcement + Motivation

We wanted users to feel recognized—not in a gamified, high-stakes way, but in small, timely moments.

Ideas we explored:

  • Milestone badges for reaching 25%, 50%, 100%
  • Encouraging notifications tied to deposit behavior
  • Streaks for regular saving (ultimately scrapped—see below)

We intentionally removed streaks after user research showed that inconsistent savers felt discouraged by them. Instead, we leaned into quiet encouragement, like, "You added to your savings again this week—nice work."

We also decided against implementing recurring savings schedules. Users who forgot they turned on automation often felt confused or frustrated when money moved unexpectedly.

Design Decisions

  • Location in app: After discussion, we housed Savings Goals under the Budgets tab instead of introducing a new one—simplifying navigation and maintaining cohesion with financial planning.
  • Completion flow: We debated adding a "Mark Goal Complete" CTA, but opted for automatic completion when the goal target is met. It reduces friction and avoids unnecessary decision-making.
  • Filtering: Completed goals are hidden by default, but accessible via a toggle. This gives users a sense of closure without visual noise.

03. Design

Initial Sketches

The design process began with quick sketches to explore different layouts and interactions for the savings goals feature. I focused on making the experience feel lightweight while maintaining clarity.

Early sketches explored different ways to visualize progress and handle goal creation.

Wireframes

Moving from sketches to wireframes, I refined the layout and interaction patterns. The goal was to create a clear hierarchy while keeping the interface minimal and focused.

Initial sketch of savings goals interface

🎯 Wireframes helped validate the information architecture and user flow.

Dashboard + Goal Management

Goals live in a consolidated dashboard view, where users can:

  • See all active goals at a glance
  • Toggle to show/hide completed goals (inspired by the iOS Reminders app)
  • Tap into any goal for deeper insights

We originally considered using Centible's existing category icons (e.g., travel, emergency, home), but during testing, these created confusion when visually overlapping with spending categories. To reduce cognitive load and keep the feature feeling distinct, we explored a separate set of icons specifically for savings goals. These were designed to be more aspirational and symbolic—reflecting goals like "Peace of Mind" or "Adventure"—rather than transactional.

Icon design exploration

Ultimately, we decided to adopt a more universal icon with optional color customization for the MVP. This provided users with a moment of ownership and clarity while keeping the UI clean and focused. Custom goal icons remain on our roadmap as a potential enhancement for future personalization.

Final Design System

The final design system established consistent patterns for the savings goals feature, ensuring it felt cohesive with the rest of the Centible app while maintaining its unique identity.

Design system components

🎯 The design system ensured consistency across all savings goal interactions.

04. Solution

Problem
  1. Many savings tools focus on outcomes—how much you’ve saved—without supporting the ongoing experience of saving. This leaves users feeling detached, especially when progress is slow or inconsistent.
  2. Automation without clarity often leads to confusion, and features like streaks or rigid deposit schedules can unintentionally discourage users who don’t save regularly.

We designed Centible’s savings goals to reframe saving from a rigid metric-driven task into a flexible, emotionally resonant experience. The solution emphasized clarity, control, and consistency over perfection. Key design choices included:

  1. Simple goal setup with minimal friction to help users get started quickly, even with informal saving intentions.
  2. Manual deposit tracking as the default to avoid automation fatigue or unintended withdrawals.
  3. Visual progress tools (bars, wheels, and estimates) that made even small wins feel visible and rewarding.
  4. A cohesive design system that blended seamlessly into the budgeting tab but allowed for a distinct sense of personalization through color and naming.
Grad Trip Goal Screen Goal Customization Screen

05. Review

App Team Carolina Gala

At the end of the semester, I had the opportunity to present our team's work at the App Team Carolina Gala. It was a rewarding experience to showcase our progress and share the story behind Centible with peers, mentors, and industry professionals. The event highlighted the impact of our project and the value of collaborative, student-driven innovation.

Presenting at App Team Carolina Gala

🎉 Presenting at the gala was a proud moment for our team and a great way to celebrate our hard work.

Reflections on Cross-Functional Collaboration

Working on Centible as part of a cross-functional team was a transformative experience. Unlike solo projects, collaborating with developers and backend engineers required me to think beyond just the user interface. I had to consider technical constraints, communicate design intent clearly, and adapt my process to fit the needs of the entire team.

This collaboration pushed me to be more flexible and pragmatic in my design decisions. I learned the importance of clear documentation, open communication, and iterative feedback. Ultimately, working with a diverse team made the final product stronger and more user-centered.

🤝 Designing alongside developers and backend engineers taught me how to bridge the gap between vision and implementation.

Go Centible!!

Presenting at App Team Carolina Gala