Just Intelligence v2

Led the UX strategy and front-end development for the Just Intelligence v2 ecosystem. In collaboration with backend engineering, I translated complex LLM outputs into intuitive, conversational interfaces and engineered the supporting data-to-code infrastructure. My work focused on auditing divergent user flows to transform the platform from a static data source into a high-utility decision tool. By rebuilding the UI around real-world analyst behaviors, I replaced manual CSV-heavy workflows with native peer-benchmarking and scenario-modeling features that drive daily strategic engagement. I also sole-engineered the entire front-end codebase, from component architecture to production deployment.

The Thinking

The core strategic hurdle was the rebrand. The new corporate branding was designed exclusively for the parent company’s marketing presence, not for a dense, data-heavy intelligence platform. I led the effort to extrapolate and upgrade these brand guidelines, creating a specialized visual language that supported complex data visualization without losing the core brand identity. Because the underlying information architecture was already validated in Phase 1, my focus was on UX strategy with the front-end execution and CSS migration. I updated the entire front-end to utilize the new semantic token structure and refined the UX for the conversational AI search interface, establishing a highly polished design foundation prepared for future live deployment.

What I Was Responsible For

I owned the full front-end refactor from V1’s rigid styling to a scalable, semantic CSS token structure — the architectural foundation the upcoming rebrand required. From there, I extrapolated the parent company’s marketing brand into a specialized visual language built for dense data interfaces, then carried that system through to production: implementing disclosure workflows surfaced by user feedback, refining micro-interactions across the UI, and redesigning the conversational UX for the AI search interface ahead of its live release.

The Execution

Key Tradeoffs

v1 → v2

AI Ask Me Anything — prompt cards scaffold common queries. 4-min manual workflows → 30-second lookups. Every response cites its source data.

Before

After

v1: raw ranks in a flat table. v2: quintile-coded pillar cards, expandable bar charts benchmarked against industry average and top performer, live index return. Scan-and-export → at-a-glance diagnostic.

Before

After

Engineered a dynamic hierarchy locator. This solves navigation friction by keeping general users oriented across all 5 drill-down levels.

Before

After

V1: Required navigating away to a hidden page just to view performance summaries. V2: Eliminated this friction. Users now see a brief, immediate summary of their top and worst 5 metrics alongside total industry size without a single click.

Before

After

V1: A dense research view containing legacy tables and charts but lacking actionable next steps. V2: Applied a complete visual overhaul to the existing charts and tables to improve legibility. The core challenge was integrating new workflows like the “Peer Comparison” and “Disclose Now” buttons into this highly constrained space. I engineered a harmonious layout that balances the dense data with these new primary actions without causing visual clutter.

Before

After

V1: Legacy peer benchmarking relying on constrained views and tooltips. V2: Upgraded to a highly legible, structured format. The critical UX enhancement is the new direct path to Scenario Analysis. Users can now compare against peers and immediately run predictive models in a single, continuous research flow.

Before

After

Workflow Unification: V1: Scenario creation and results were fragmented across multiple separate pages, creating a disjointed user loop. V2: Unified the modeling workflow into a single dynamic workspace. By anchoring the layout with distinct “Create” and “Find” cards, I consolidated multiple legacy views into interchangeable modules on a single screen. During scenario creation, company data is intentionally restricted to just core rankings to eliminate visual noise and keep the user entirely focused on their inputs.

The System in Code

The token architecture that powered the V2 migration. A single semantic layer that connected brand identity, data visualization, and accessibility compliance — so every component spoke the same language from day one.

/* 1. Global Token System (The Architecture) */
:root {
  /* Brand Typography with System Fallbacks */
  --font-primary: 'Nexa', system-ui, sans-serif;

  /* Core Brand & Accessible Surfaces */
  --surface-primary-dark: #00426a;
  --action-primary-blue: #006298;

  /* Semantic Data Scale (Performance Quintiles) */
  --data-tier-top-5: #93C47D;
  --data-tier-bottom-5: #E95858;
}

/* 2. Component Application (The Execution) */
.data-table-cell[data-rank="top-5"] {
  /* Enterprise best practice: providing a hardcoded fallback */
  background-color: var(--data-tier-top-5, #93C47D);
  color: var(--surface-primary-dark);
}

.company-switch-dropdown {
  background-color: var(--surface-primary-dark);
  font-family: var(--font-primary);
}

/* 3. Accessibility (Proving WCAG AA Compliance) */
.company-switch-dropdown:focus-visible {
  outline: 2px solid var(--data-tier-top-5);
  outline-offset: 2px;
}

If you're transforming a product that people already depend on — I've architected that transition without breaking the trust that took years to build.

All Projects