ppro.com
Connecting Global Digital Payments Landscape
%20(1).png)
The case
From Fragmentation to Unity
Following rapid international hyper-growth, global payment provider PPRO faced severe UX/UI fragmentation across its internal operational tools and merchant-facing dashboards.
My Role in Product Design
As Senior Product Designer, I aligned stakeholders across 8 global teams in the Americas and EMEA to lead the modernization and unification of PPRO's cloud platform. By building a scalable multi-brand design system (Figma to React/Tailwind) and embedding frontend observability (Datadog RUM), we transformed fragmented legacy workflows into a unified enterprise ecosystem.
Due to non-disclosure agreements, specific proprietary data workflows and sensitive infrastructure blueprints have been omitted. I am happy to discuss my strategic methodology and system design process in detail during an interview.
Business Impact
- Task Time: 80% reduction in time required for partners and operational teams to complete core daily workflows.
- Customer Satisfaction: CSAT score increased by 66.7% (from 2.7 to 4.5) following the dashboard redesign.
- Engineering Speed: 2x faster development velocity across 5 cross-functional teams.
- Bug & Frustration Triage: Time to identify root causes and frustration signals dropped from over 24 hours to 5 minutes.
The Challenges
As PPRO scaled to support 150+ global payment methods, 2,000+ partners, and over 500K daily transactions, its digital tools failed to keep pace. Hyper-growth led to disconnected web applications, inconsistent UI components, and manual, paper-based operational processes.
This technical and visual debt impacted three core groups:
- External Merchants/PSPs: High Friction seraching across 500K daily transactions.
- Internal Operations: Manual paper based steps for customer onboarding and account setup.
- Product and Engineering: Siloed teams re-inventing UI components repeadtedly.
Strategic Objectives
- Consolidate Legacy Systems: Unify external Customer Dashboards, internal Employee Back Office tools, and Developer Hub services into a single platform across Dev, QA, Live, and Sandbox environments.
- Establish Design Operations (DesignOps): Build a production-grade, accessible design system encompassing design tokens, Figma libraries, and React component code.
- Embed Product Observability: Shift from subjective design decisions to data-driven product strategy by integrating quantitative telemetry tracking.
Strategic Execution & Solution Architecture
To address infrastructure and interface inconsistencies, I facilitated UX discovery workshops with engineering, product, and business leadership. I translated these insights into high-density enterprise UI patterns, iterative prototypes, and systematic code components.
3—Pillar Modernization Strategy
- 1. Unified workspace architecture: replaced fragmented legacy tools with a cohesive B2B enterprise workspace supporting both external customers (merchants, PSPs) and internal employees (operations, support).
- 2. Scalable Coded Design System and Token System: To ensure parity between design specifications and frontend implementation, I led the creation and governance of the PPRO Global Design System.
- 3. Product Telemetry & Observability: To establish quantitative metrics for user experience, I led the frontend integration of Datadog RUM (Real User Monitoring) alongside Hotjar feedback channels.
Business & Operational Impact
The unification of PPRO's digital ecosystem delivered immediate, measurable value within the first month after launch:
- Operational Efficiency — 80% Faster. Time required for merchants and internal teams to execute recurrent tasks dropped by 80%.
- User Satisfaction — 4.5 / 5.0 CSAT. Legacy customer satisfaction jumped +66.7% (from 2.7 to 4.5) post-launch.
- Development Velocity — 2x Speed. Synchronized Figma and React component libraries doubled feature delivery speed across 8 teams.
- Issue Detection — 24h → 5 min. Time to identify root causes for user frustration and UI bugs dropped from over 24 hours to ~5 minutes via Datadog.
- Platform Adoption — 1,000+ MAU. Onboarded 1,000 monthly active B2B enterprise accounts (Avg. ACV of USD $500K) in Month 1.
Key Lessons & Reflection
- Enterprise Design System Governance: Building a design system for complex B2B applications requires more than UI assets—it demands a shared language between Figma and production code (TypeScript, Tailwind, React) to eliminate edge-case risks during handoff.
- Design Telemetry is Essential: Integrating observability tools like Datadog RUM transforms UX design from a visual discipline into a measurable driver of business efficiency and platform stability.
- Cross-Functional Alignment at Scale: Modernizing legacy software across global regions (Americas & EMEA) requires continuous stakeholder engagement, clear documentation, and empathy for internal operational users as much as external clients.
