Overview

To accelerate organic user growth in a competitive exchange market, Catalyx introduced a tiered referral model that rewarded users as their invitees traded.

The core UX challenge was data complexity: commissions were paid out in multiple fluctuating cryptocurrencies across different rate tiers, making accurate accounting difficult for users to follow. Working alongside the CTO, Business Director, and frontend engineers, I led the interface iterations to balance business logic with engineering constraints. We prioritized creating a clean, time-series data visualization that allowed traders to easily verify payouts and evaluate the ongoing value of their referral network.

Iterations on Commision Table

Exploring Two Distinct Directions (Type A & B)

To address how users explore their commission data, I initially designed two distinct directions:

• Type A (Feature-Rich): Included a live keyword search, export functionality, and simple preset date dropdowns, catering to users who need fast data extraction.
• Type B (Streamlined): Removed the search and export tools to minimize UI clutter, relying instead on an interactive custom calendar picker for precise date-range filtering.

The Final Decision: Combining the Best of Both

Through cross-functional reviews with the CTO and developers, we realized that both quick search/export and flexible date filtering were critical for active referrers. Rather than forcing a compromise, the final iteration adopted Type A's full control bar (Search & Export) while integrating Type B's custom date-range calendar selector. This synthesis delivered the best of both worlds: a clean, unified toolbar that supported high-level search and granular, custom-date auditing.

Developer Handoff & Interaction Specs

Documented interactive states, responsive pagination rules (10, 15, 20, 30, 50 items per page), and data-dependency states directly within the design deliverables. Collaborating closely with the CTO and developers ensured that all conditional logic — such as real-time keyword search and CAD conversion estimates — was technically feasible and smooth to implement.

Referral Dashboard: Full Page Layout

To prevent cognitive overload, the referral page was organized into three primary visual zones: (1) high-level commission totals and tier status at the top, (2) frictionless sharing controls in the center, and (3) historical earnings analytics at the bottom. This structure allowed users to quickly check their balance or grab an invite link without losing access to detailed transaction histories.