Platform redesign & frontend performance

MNTN Nova

A full frontend redesign with a consistent design system, clearer campaign workflows and more efficient data access.

View the workflow Explore the build

Business problem

The challenge

A fragmented mix of UI libraries and styling approaches made the platform harder to use, maintain and evolve.

Technical solution

Our approach

Tailwind and shadcn design system, responsive campaign workflows and PAPI-backed data access.

  1. 01

    Establish a consistent UI

    Owned the frontend redesign, replacing Ant Design, styled-components and raw CSS with Tailwind, custom design tokens and shadcn components matched to Figma.

  2. 02

    Build the campaign workspace

    Implemented responsive empty, single and multi-campaign dashboards, cards/table views, server pagination, search, sorting, status/strategy filters and row actions. Added mode/objective selection, name validation, step navigation, goal editing and persisted themes.

  3. 03

    Rework Budget & Goal

    Built budget filters, monthly totals, mobile sheets and create/edit/delete/review drawers. Covered gaps, overlaps, running-flight changes, stale previews, high-intent/Max Reach sliders and budget alerts while retaining backend rules.

  4. 04

    Reduce data overhead

    Trimmed GraphQL selections and unnecessary calls; fetched one summary row with server totals and prefetched alternate views. Later branch work brought Express mode and simplified creation into Nova.

Results & impact

Project outcomes

A full frontend redesign with a consistent design system, clearer campaign workflows and more efficient data access.

Up to 45%

Frontend performance improvement

Reported project outcome from reduced data requests and frontend optimization.

One system

Consistent platform styling

Shared components and tokens across responsive campaign workflows.

Visual assets

How the workflow fits together

MNTN Nova

flowchart TD
  A["Figma and design tokens"] --> B["Shared components"]
  B --> C["Responsive campaign workflows"]
  C --> D["PAPI"]
  D --> E["GaryQL business rules"]
01 Tailwind and shadcn design system, responsive campaign workflows and PAPI-backed data access.

Tech stack

Technology and ownership.

Owned the frontend redesign and campaign/budget workflows. Express consolidation includes later branch work.

ReactTypeScriptTanStack StartTailwind CSSshadcn/uiFigmaPAPIGraphQL