Role
Lead Product Designer & Front-End Engineer
Company
Just Capital
Timeline
2025–2026
Tools
TypeScript, D3.js, Figma, HTML, PHP, CSS
Phase 2: redesigned the platform as Just Capital rebranded, introducing new features driven by real user usage patterns and fresh stakeholder feedback to improve the analyst experience end-to-end.
The Challenge
Engineering for Institutional Rigor
The primary challenge was balancing immense data density with the high standard of accuracy required in institutional finance. Professional analysts require total transparency to reconcile platform metrics with their own internal models, while general users need an intuitive entry point into complex corporate performance data. With 240+ weighted indicators across the Russell 1000, the architectural goal was to deliver mathematical precision for expert audit and visual clarity for public consumption.
The Philosophy
I embedded with the engineering team to ensure the interface could scale across various levels of data literacy. By operating as the direct link between user research and the UI layer, I eliminated the typical friction of design handoff. I translated research insights directly into Figma components and then implemented them into the production code. This created a "zero-gap" environment where every component was built with a deep understanding of the underlying data architecture, ensuring the design remained a faithful representation of production reality.
How It Got Built
Mapping Data Utility
- The Trust Gap: User sessions revealed a core tension. While users trusted the data methodology, they struggled to navigate the high-density environment at the speed required for professional analysis.
- Persona-Driven Prioritization: I evaluated specific persona requirements to determine how different users extract value from the data. I prioritized features and tools based on these distinct user goals, ensuring the interface served the most critical tasks for each group.
- Technical Constraints: Latency limitations ruled out real-time filtering of the full dataset. This turned progressive disclosure into a strict architectural requirement to maintain performance.
- User Segmentation: I identified three distinct user groups: Asset Managers, Market Researchers, and Corporates. These groups had different entry points, which required a modular Information Architecture that could adapt to varying data needs.
Foundational Architecture
- Token Infrastructure: I engineered a CSS variable system that mirrored Figma variables 1:1. This established a unified visual language between the design files and the production code from the start.
- D3 Visualization: I used D3.js logic to visually simplify complex data tables. By adding visual cues and patterns to the rows and columns, I enabled users to scan the Russell 1K and identify key trends much faster than reading raw text.
- Abstraction Model: I built every UI component from a centralized abstraction model. This ensured that the layout remained consistent and easy to manage as the scale of the data increased.
Fidelity and Hierarchy
- Integrated Workflow: I developed the UI layer and CSS alongside the engineering team. This proximity allowed for a zero-handoff environment where research insights were moved into production within the same deployment cycle.
- Information Hierarchy: I implemented a five-level drill-down structure to manage the 240+ indicators. This allows users to navigate logically from a high level Overview, to Stakeholder groups, then down to specific Issues, Metrics, and finally individual Data Points.
- Design Fidelity: I ensured that every interaction in the final product maintained 1:1 parity with the design intent. This resulted in a high-fidelity interface that remained a faithful representation of the underlying data.
Key Tradeoffs
What Got Built
The Scenario Analysis tool moves beyond static data by allowing users to modify specific indicator weights and observe the direct impact on final company scores. By simulating different performance scenarios, researchers can conduct hypothesis-based analysis grounded in adjustable and valid datasets.
The View Scenario Result page provides a focused analysis by highlighting only the specific stakeholders, issues, and metrics affected by ranking adjustments. By isolating these variables from the broader dataset, the interface allows users to concentrate on the direct outcomes of their modifications. The page also explicitly displays the value changes made relative to the original data, ensuring transparency in how custom inputs influence both overall and industry-level rankings.
The Performance Explorer consolidates overall and industry rankings into a horizontal view, allowing for simultaneous comparison of current and previous year data across every stakeholder. By displaying ranking weights and year-over-year shifts in a single layout, the interface enables users to evaluate performance trends without the need for multiple navigation steps. High-contrast color indicators are applied to categorize rankings into tiers, providing a visual shorthand that helps users quickly identify their standing and navigate the complexities of the stakeholder landscape.
What Shipped
Designing Just Intelligence proved that professional UX is about mastering data density, not avoiding it. When analysts navigate hundreds of metrics, the interface must prioritize mental speed and structural clarity. I learned that the real value of a design is measured by how quickly it helps a user reach a decision. A successful tool does more than look clean; it turns complex data into actionable confidence.
Reflection
I build products designed to last. If you need a foundation that works right the first time, let's talk.
All Projects