Down Arrow icon to symbolise navigationRight Arrow icon to symbolise navigation
OverviewLet’s take it from the startThe Team Behind the ScenesPutting myself in the user’s shoesSketching the Path to SimplicityDesigning for DelightOutcomesMy LearningsArrow icon that navigates to the top of the page
Laptop Minimal icon

Product

MitiManager is one of Mitigram's key products, allowing enterprise users to manage, edit, and track all their financial transactions. Users can also communicate and share information with internal teams and banks through this platform.

Octagon icon

Problem

The transaction interface was cluttered and overwhelming, making it hard for users to locate critical Workflow Messages (WFMs). With no prior user testing and tight deadlines, designing an intuitive solution became the primary challenge.

Gavel icon

Impact

WFMs are now a main feature of MitiManager, with a 95% adoption rate for seamless transaction management. The scalable design has supported ongoing enhancements and improved user workflows significantly.

Section Break

Let’s take it from the start

Core Need

Enterprise users needed a simpler way to manage complex financial transactions.

Insight

Creating, editing, and referencing transactions felt scattered and overwhelming.

How might we?

Creating, editing, and referencing transactions felt scattered and overwhelming.

WFM Overview UI
Section Break

The Team Behind the Scenes

  • 1 Product Manager, 1 Front-End Dev, 2 Back-End Devs, and me—the Product Designer.
  • I led the design process, ensuring a user-centric perspective throughout.
  • Collaboration was key: each person’s expertise shaped the WFM feature.
Section Break

Putting myself in the user’s shoes

User Research

Based on the feedback themes gathered, we focused on the following user pain points,

Tally 1 icon

Cluttered Transaction Pages

Tally 2 icon

Hard-to-find WFMs

Hick’s Law

Keeping Hick’s Law in mind, I aimed to reduce on-screen distractions thereby enabling users to make faster decisions.

Screenshot of Hick's Law

Goal

Goal icon

Ensure WFMs are easy to locate and adopt in daily tasks.

Section Break

Sketching the Path to Simplicity

Circle Dot icon

Early wireframes centered on a streamlined layout for transaction details.

Circle Dot icon

We drew from the user feedback: “Keep critical info visible at all times.”

Circle Dot icon

This helped us prioritize clarity while keeping all essential actions within reach.

Update Transaction with wfm - wireframe
Section Break

Designing for Delight

Building Consistency with Components

To ensure a cohesive experience across the platform, we designed reusable Workflow Message (WFM) components that maintain visual and functional consistency.

Guiding Users through an Intuitive Interface

The interface was crafted to seamlessly guide users through creating and editing transactions, eliminating confusion and ensuring actions were intuitive.

Minimizing Friction

Every design decision prioritized reducing cognitive load and creating a seamless interaction flow.

Processing of a WFM UIProcessed WFM edits the transaction UI
Section Break

Outcomes

Trending icon

Daily Adoption

With more than a 95% adoption rate, users use WFMs for nearly every transaction.

Chart Bar icon

Scalable Design

WFMs serve as a foundation for ongoing improvements and new functionalities

Section Break

My Learnings

Users icon

Understanding Users

Understanding real user behavior shaped our decisions.

Chart Bar icon

Keeping It Simple

We trimmed unnecessary complexity to meet pressing deadlines.

Chart Bar icon

Improved Navigation

Future sprints refine navigation and address overlooked scenarios.

Main Section Break

Other Projects