Background

An international public health non-profit operating across Asia required a digital transformation. Moving away from a fragile ecosystem of manual spreadsheets and paper records, the organization needed an Enterprise Resource Planning (ERP) platform. However, traditional commercial ERPs were cost-prohibitive and too rigid for their specific grant-funded operation and multi-border approval workflows.

I led the end-to-end UI/UX design strategy to architect a custom enterprise platform tailored to the organization's legacy workflows, simplifying complex cross-border finance and project operations without disrupting their established organizational culture. I collaborated deeply with the Project Manager, Lead Programmer, and Data Scientist to ensure balance between ambitious UX goals with technical feasibility, ensuring the system met rigid compliance rules while remaining performant and intuitive.

Problem

Unlike traditional corporate entities, this small-to-medium non-profit relied on an unconventional grant-funding structure to mobilize fieldwork and research across multiple Asian borders. Their operations required a highly specific, interconnected flow spanning procurement, project expenses, and salaries that included a multi-level approval flow catered to their unique organisational structure.

The primary challenges included:

• Legacy Preservation: The client refused to distort their working habits to fit a rigid software mould. The system had to conform to them, not the other way around.

• Domain Complexity: Translating a massive web of manual cross-border finance paperwork into a delicate, mistake-proof digital ecosystem.

• Remote Engineering Alignment: Communicating highly intricate UI flows to a fractured engineering team consisting of internal stakeholders and remote freelancers.

Research & Process

Context Mining & Stakeholder Alignment

To map a system they didn't yet understand, We conducted exhaustive deep-dive interviews with department heads, auditing their sample documents and tracking data lineages to see exactly how money and permissions moved across borders.

Failing Fast

Early in the project, I pushed out rapid designs for the finance and accounting module based on initial assumptions. However, we quickly realized that we had misunderstood the intricate, delicate flow of the finance data. This necessitated a rework of some mechanisms within the Finance and Accounting module that had already begun development, though—thankfully—it was early in the process. This friction taught me the value of front-loading context gathering. I halted high-fidelity UI production to dig deeper into the domain logic, preventing what could have been a catastrophic rework phase closer to deployment.

Engineering Compromise

Reporting was critical to their operation as they required board approval for each leg of their operation. At that point, they already had a schema for their quarterly, bi-annual and annual reports. Thinking ahead to accommodate the potential for changes to their reporting needs in the future, I designed a completely open-ended, dynamic reporting engine using modular filters, allowing to fully customize their reports. While technically a "nice-to-have," the development scope was massive for the timeline. After negotiating with the engineering team, we agreed to compromise: we would ship a simplified, template-based report system that fulfilled the client's immediate reporting needs, before pushing out a "lite" dynamic reporting engine in a later phase.

Async Design Governance

Managing remote freelancers made handoffs incredibly complex. To bridge the communication gap, I built out exhaustive FigJam boards mapping the entire financial structure and recorded detailed video walkthroughs, ensuring asynchronous alignment across the engineering pipeline.

Solution

The final e-Management System was modularized cleanly into four distinct corporate pillars: Human Resources, Procurement, Finance & Accounting, and Project Management.

High-Level Clarity to Low-Level Granularity

To prevent data fatigue, I introduced a "bird's-eye view" dashboard layer at the top page of each domain. Executives could digest macro-level organizational health via data visualizations and charts at a glance, then drill down into dense lists and forms only when granular action was required.

Information Dense, but Simplified

Across the system, I designed multi-panel layouts that was intended to minimise navigational context switching and cognitive load by grouping logically similar information together into panels. I also utilised familiar mental models where possible, such as an email reader-like two-panel interface for viewing invoices, receipts and payment vouchers, with the list of documents on the left, and the document viewer on the right for viewing its contents.

Impact

Despite a prolonged post-launch bug-fixing window natively tied to the complexity of the custom financial backend architecture, the e-Management System successfully digitized the organization's cross-border workflows.

The client expressed high satisfaction with the interface's ease of use and historical continuity. While external funding constraints ultimately paused further development cycles, the platform stands as a benchmark for how non-profits can scale operationally without losing their organizational identity to bloated commercial software.