UiFlow

Studio Refactor

Read Case Study

Description

Finfare is a business expense management platform that simplifies spending through an intuitive dashboard. The product enables businesses to track expenses, automate categorization, and earn rewards seamlessly, allowing teams to manage finances efficiently without added overhead.

For this project, I led the design of Finfare’s core product, the Finfare Dashboard, enhancing UX/UI, ensuring responsive behavior across web and mobile, and aligning the experience with established brand standards.

The goal was to create a streamlined experience for managing purchases, tracking expenses, and onboarding clients across both web and mobile platforms.

Challenge

How might we design an intuitive, unified platform that simplifies business purchasing and expense management for small businesses while providing real-time visibility and a consistent experience across web and mobile?

Constraints

When I joined Finfare as Product Manager and Lead UI/UX Designer, the project was under a tight deadline and limited budget tied to an upcoming fundraising round. The team needed an MVP quickly that was polished enough for investor demos and stable enough for real users.

With limited engineering capacity, a full rebuild wasn’t feasible. New workflows had to integrate across web and mobile while preserving existing systems. Alongside owning brand identity, marketing visuals, and core product interfaces, I prioritized high-impact, low-effort improvements to deliver clarity and usability.

Working in two-week sprints, we shipped a focused MVP, including a refined onboarding experience, a simplified expense dashboard, and a foundational design system that supported Finfare’s first fundraising milestone.

Research

In the early stages of developing Finfare, our main challenge was finding unique features that would distinguish our product from other financial management solutions, e.g., Ramp, Brex, and Mercury.

As a product manager and lead designer, I led research and convinced stakeholders of the importance of conducting thorough market and user research. With the UX team, we tested multiple products, documenting strengths and weaknesses, and analyzed their design patterns, color systems, and UI components. This research revealed major issues: cluttered visuals, confusing onboarding, repetitive expense workflows, and limited mobile access.

These insights shaped our priorities—clarity, speed, and mobility—and became the foundation for the redesign of Finfare’s visual identity, onboarding flow, and dashboard experience

Seamless Onboarding

Onboarding needed to be far more approachable, especially for small-business CEOs who often handle setup themselves. The process was cluttered and unclear, and it asked for information they didn’t always have (as required fields / couldn't skip), causing delays and mistakes.

We redesigned the flow around people, not paperwork. A new step-by-step onboarding journey focuses on one action per screen with clear progress and guidance so that anyone can start quickly and consistently. Visual cues match the target audience, language is easy to understand, and only essential fields appear when needed (they can also skip and come back later).

A strong hierarchy and clear primary actions help users stay oriented and know exactly what to do next.

The result is a faster, more intuitive onboarding experience with far less confusion and fewer errors. Users were able to complete account setup and activation confidently, regardless of their financial background.

All Cards — one place to see spend

Before this, managers chased card activity across exports and emails. Simple questions like Who’s spending right now? Which cards are close to their limit? took too long to answer.

The All Cards dashboard brings every card into one view. The manager can see all cardholders, recent activity, and what’s left on the limit at a glance. Filters and search make it easy to find a person or team. Subtle alerts flag low balances or unusual activity. When something needs action, you can open details, adjust a limit, or freeze a card without leaving the page.

The result: Fewer surprises at month-end and less time digging through spreadsheets allow managers to get a clear picture in seconds and act before small issues become bigger problems.

Real-time Expense Reports

We designed a flow for uploading receipts, eliminating the need to save and upload each one manually. Cardholders can easily add virtual cards to their Apple Wallet and upload receipts and memos via mobile, desktop, email, or SMS without logging into the platform. Finfare will automatically notify cardholders to submit receipts promptly, empowering them with better control over their expenses and budgets.

This functionality has also a great impact in use cases like reducing the finance team's time for reviewing and approving expenses, issuing virtual cards, and controlling spending limits.

Final Deliverable

After multiple rounds of iteration and review, we conducted a Maze usability test with 42 participants to validate the updated onboarding and dashboard. The results were largely positive, confirming clearer user paths and reduced confusion, while also identifying targeted refinements for the next release.

Here’s the live demo:

Takeaway

Working on Finfare showed me how much clarity and consistency matter in products that can feel intimidating. By simplifying flows, leaning on familiar patterns, and guiding users step by step, we made a complex process feel approachable.

It also underscored the value of early validation and scalable foundations: simplify first, test often, and build a system that can grow with the product. The outcome was faster onboarding, less manual work, and stronger user trust.

If I were to revisit this, I’d go deeper into analytics and usability testing to quantify improvements, track confidence after launch, and guide iterations with more precision.

* This work was completed in 2022, and my design solutions has been improved significantly since then.

Clocks is an app designed, developed and released on the App Store.

View in App Store

Challenge

How might we design an intuitive, unified platform that simplifies business purchasing and expense management for small businesses while providing real-time visibility and a consistent experience across web and mobile?

Constraints

When I joined Finfare as Product Manager and Lead UI/UX Designer, the project was under a tight deadline and limited budget tied to an upcoming fundraising round. The team needed an MVP quickly that was polished enough for investor demos and stable enough for real users.

With limited engineering capacity, a full rebuild wasn’t feasible. New workflows had to integrate across web and mobile while preserving existing systems. Alongside owning brand identity, marketing visuals, and core product interfaces, I prioritized high-impact, low-effort improvements to deliver clarity and usability.

Working in two-week sprints, we shipped a focused MVP, including a refined onboarding experience, a simplified expense dashboard, and a foundational design system that supported Finfare’s first fundraising milestone.

Seamless Onboarding

Onboarding needed to be far more approachable, especially for small-business CEOs who often handle setup themselves. The process was cluttered and unclear, and it asked for information they didn’t always have (as required fields / couldn't skip), causing delays and mistakes.

We redesigned the flow around people, not paperwork. A new step-by-step onboarding journey focuses on one action per screen with clear progress and guidance so that anyone can start quickly and consistently. Visual cues match the target audience, language is easy to understand, and only essential fields appear when needed (they can also skip and come back later).

A strong hierarchy and clear primary actions help users stay oriented and know exactly what to do next.

The result is a faster, more intuitive onboarding experience with far less confusion and fewer errors. Users were able to complete account setup and activation confidently, regardless of their financial background.

All Cards—one place to view

Before this, managers chased card activity across exports and emails. Simple questions like Who’s spending right now? Which cards are close to their limit? took too long to answer.

The All Cards dashboard brings every card into one view. The manager can see all cardholders, recent activity, and what’s left on the limit at a glance. Filters and search make it easy to find a person or team. Subtle alerts flag low balances or unusual activity. When something needs action, you can open details, adjust a limit, or freeze a card without leaving the page.

The result: Fewer surprises at month-end and less time digging through spreadsheets allow managers to get a clear picture in seconds and act before small issues become bigger problems.

Real-time Expense Reports

We designed a flow for uploading receipts, eliminating the need to save and upload each one manually. Cardholders can easily add virtual cards to their Apple Wallet and upload receipts and memos via mobile, desktop, email, or SMS without logging into the platform. Finfare will automatically notify cardholders to submit receipts promptly, empowering them with better control over their expenses and budgets.

This functionality has also a great impact in use cases like reducing the finance team's time for reviewing and approving expenses, issuing virtual cards, and controlling spending limits.

Research

In the early stages of developing Finfare, our main challenge was finding unique features that would distinguish our product from other financial management solutions, e.g., Ramp, Brex, and Mercury.

As a product manager and lead designer, I led research and convinced stakeholders of the importance of conducting thorough market and user research. With the UX team, we tested multiple products, documenting strengths and weaknesses, and analyzed their design patterns, color systems, and UI components. This research revealed major issues: cluttered visuals, confusing onboarding, repetitive expense workflows, and limited mobile access.


These insights shaped our priorities—clarity, speed, and mobility—and became the foundation for the redesign of Finfare’s visual identity, onboarding flow, and dashboard experience

Final Deliverable

After multiple rounds of iteration and review, we conducted a Maze usability test with 42 participants to validate the updated onboarding and dashboard. The results were largely positive, confirming clearer user paths and reduced confusion, while also identifying targeted refinements for the next release.

Here’s the live demo:

Takeaway & Reflection

Working on Finfare showed me how much clarity and consistency matter in products that can feel intimidating. By simplifying flows, leaning on familiar patterns, and guiding users step by step, we made a complex process feel approachable.

It also underscored the value of early validation and scalable foundations: simplify first, test often, and build a system that can grow with the product. The outcome was faster onboarding, less manual work, and stronger user trust.

If I were to revisit this, I’d go deeper into analytics and usability testing to quantify improvements, track confidence after launch, and guide iterations with more precision.

* This work was completed in 2022, and my design solutions has been improved significantly since then.

Powered by 30 different Metal shaders, it was a great chance to learn more

about shaders, SwiftUI, and the app development process.

Powered by 30 different Metal shaders, it was a great chance to learn more

about shaders, SwiftUI, and the app development process.

Powered by 30 different Metal shaders, it was a great chance to learn more

about shaders, SwiftUI, and the app development process.

Description

Finfare is a business expense management platform that simplifies spending through an intuitive dashboard. The product enables businesses to track expenses, automate categorization, and earn rewards seamlessly, allowing teams to manage finances efficiently without added overhead.

For this project, I led the design of Finfare’s core product, the Finfare Dashboard, enhancing UX/UI, ensuring responsive behavior across web and mobile, and aligning the experience with established brand standards.

The goal was to create a streamlined experience for managing purchases, tracking expenses, and onboarding clients across both web and mobile platforms.

Description

This project is a refactor of the Uiflow Studio no-code editor. This effort was intended to further empower engineers and product managers by enabling the ability to connect live data from any data source and elevate the logic tool for creating and managing workflows.

© Joann Kim All rights reserved.
© Joann Kim All rights reserved.