Transparent.space

Transparent.space is a Web3 platform focused on verifiable proof of Market Maker performance, bringing together critical data such as SLA, liquidity, spreads, uptime, pool depth, and historical behavior in a single institutional environment.

The product was created to solve a central problem in today's crypto market:

• "Fragmented data, unreliable and difficult to compare for high-risk financial decisions."

Beyond its functional requirements, Transparent.space demanded a visual language that could immediately communicate trust, precision, and accountability, in an industry where credibility is the product.

This case documents the full design process: from discovery and problem framing to UX decisions, design system, and the reasoning behind every major design choice.

Market Makers play a critical role in crypto ecosystems — providing liquidity, maintaining spreads, and ensuring that exchanges and DeFi protocols can operate efficiently. Yet despite this importance, evaluating their actual performance is remarkably difficult.

Performance evaluation today is:

The opportunity was not to build yet another dashboard. It was to unify what is currently scattered across multiple tools into a single, verifiable, institutional-grade source of truth — one that decision-makers could trust without having a technical background.

The platform serves two distinct user types, each with fundamentally different needs, and the design had to satisfy both simultaneously.

User Type 1 — Institutional Clients (Strategic)

• Institutional crypto funds
• DeFi protocols
• Exchanges
• Web3 treasuries

User Type 2 — Market Makers (Self-assessment / Proof of compliance)

• Market Maker teams needing to demonstrate performance against agreed SLAs
• Compliance and reporting functions within trading desks

Key Needs (both user types):

• Quick comparison between Market Makers in the same context
• Trust in the data — verifiable, not self-reported
• Executive analysis layer alongside technical depth
• Clear evidence to support financial and partnership decisions

"The experience is built around a single-screen mental model: users should be able to understand the health of a Market Maker at a glance, and progressively dive into details without changing context."

The research approach was conceptual and comparative, grounded in understanding how institutional users consume complex financial data, rather than traditional user testing with end consumers

Conceptual Benchmark (non-visual):

• Crypto data platforms — Dune Analytics, DeFiLlama (identified as the baseline the market was using, and its limitations)
• Institutional financial tools — Bloomberg Terminal (studied as the gold standard for data density + trust)
• Traditional performance and SLA dashboards — Grafana, Datadog (studied for information architecture patterns)

Key Insights extracted:

• Data doesn't need to be ''more'', it needs to be better organized. Information overload was the primary failure mode of existing tools.
• Visualization should guide reading, not just display numbers. The eye needs a clear path through the data.
• UX needs to communicate credibility, not hype. In institutional contexts, restraint is a trust signal.
• Executives need to understand the scenario in less than 10 seconds. Everything else is depth for those who need it.

These insights directly shaped the three core design principles that governed every UI decision made throughout the project.

Each design decision in this product had a specific rationale. Below are the five most significant ones, including the alternatives that were considered and discarded.

Decision 1 - SLA as a contract, not a percentage

"View the SLA as fulfilled or not, not just as isolated percentages."

• The original approach displayed SLA as a raw percentage (e.g., 98.7% uptime). User testing on comparable tools showed that numbers without context don't communicate risk, a sophisticated user can interpret 98.7%, but a decision-maker asking 'is this vendor compliant?' cannot.
• We redesigned SLA visualization as a binary contract status, fulfilled vs. not fulfilled, with the supporting data available on drill-down. This made the primary decision signal immediately legible to non-technical stakeholders, while preserving full metric depth for analysts.

Decision 2 - Liquidity as behavior, not a number

"Liquidity isn't a number, it's behavior over time."

• Standard dashboards display liquidity as a single current value (e.g., $200K pool depth). The insight from our research was that a single number is meaningless without temporal context — a pool can show $200K now and have dropped 60% in the last 7 days.
• We introduced temporal behavior as a first-class citizen of the UI, every liquidity metric is presented alongside its trend, not as a static point. This required a significant architectural change to the information hierarchy, but was validated as the most critical insight for decision-making.


Decision 3 - Comparison without 'gamifying'

• When designing the Market Maker comparison feature, the initial direction used visual ranking (leaderboard-style with badges and rankings). We discarded this approach after recognizing that gamification creates visual bias, it encourages 'winning' over nuanced evaluation.
• The final design uses direct side-by-side comparison with the same metrics in the same context, with no visual hierarchy between providers. The data makes the case; the UI stays neutral.

Decision 4 - The three UX design pillars

Transparent.space required more than a functional UI, it required a visual language that could communicate trust, precision, and accountability before a user reads a single data point.

The product was conceptually designed around a blueprint-inspired system, a reference to engineering, architecture, and financial infrastructure, where every element exists to be measured, verified, and understood.

The interface is structured through visible grids and quadrants, reinforcing the idea of radical transparency. Data is never hidden behind decorative layers; instead, performance, liquidity, and SLA metrics are always observable, contextualized, and comparable.

This concept was developed collaboratively using AI-assisted workflows, specifically, using generative tools to rapidly explore spatial metaphors for data organization, blueprint grid systems, and institutional visual languages. The AI accelerated the ideation phase significantly, but every final decision was grounded in the UX principles established during research and validated against the needs of both user profiles.

The design process moved through four distinct phases, each feeding directly into the next:

Phase 1 - Information Architecture

• Defined the single-screen mental model: global status first, then progressive drill-down
• Mapped the two user journeys (executive scan vs. analyst deep dive) to the same interface
• Established the four core data layers: SLA Status, Liquidity Behavior, Market Comparison and Methodology

Phase 2 - Component Design

• Built a modular design system of 120+ components in Figma with AI commands
• Every component designed to work at multiple data densities, the same card layout handles both summary and detailed states
• Light mode as default, deliberate choice to reinforce the institutional, high-stakes environment

Phase 3 - Interaction Design

• Progressive disclosure pattern: every screen has a readable summary state and an expandable detail state
• Drill-down without context loss, breadcrumb navigation ensures the user always knows where they are in the data hierarchy
• Alert states designed as binary signals (fulfilled / not fulfilled) with supporting trend data on hover/expand

Phase 4 - Validation & Iteration

• Usability sessions with 2 operators, identified 'too many simultaneous metrics' as primary friction point in v1
• Reduced primary view from 12 metrics to 4 critical metrics, with remaining data accessible via drill-down
• Task completion rate improved from 61% to 88% between v1 and v2