Work · Spyne · full-stack product

Spyne Dealer Intelligence Dashboard.

A dealer-facing intelligence dashboard I designed, built, and validated with real dealers: using Claude Code to go from product vision to an interactive, validated prototype without a designer.

View live dashboard

The problem

The agents were doing real work. Dealers couldn't see it.

As we scaled Vini, Spyne's conversational AI agent for US auto dealerships, to 30+ rooftops, the agents were handling calls, booking appointments, and running outbound campaigns. But dealers had no way to see the value being created. The ROI was invisible, which made renewals harder and expansion conversations vague.

The console experience was long overdue for a redesign that kept getting pushed back to focus on AI agent quality and dealer outcomes.

As the PM, I took this on end-to-end: not just defining how it should work, but building the functional prototype myself without a designer and validating the designs directly with dealers.

What I built

A working console, not a Figma file.

What it is

A dealer-facing console for Spyne's AI sales agent: an Overview dashboard, Action Items queue, Appointments tracker, and Leads by Source funnel.

Why I built it this way

A working spec, not a mockup, so we could validate with real dealers immediately instead of waiting for engineering bandwidth.

Next.jsTypeScriptTailwind CSS shadcn/uiReact ContextREST APIsClaude Code

Overview dashboard: a 5-metric strip (leads interacted, qualified, after-hours, handoffs, appointments booked), a Speed-to-Lead panel with week-over-week trends, and a full-funnel Leads by Source table tracing every lead from source to sold.
Action Items (redesigned): replaced an unusable flat list of "Reach out to customer" items with a prioritised card queue: urgency indicators, typed actions ("Schedule Test Drive," "Trade-In Follow-Up"), due dates, and one-click follow-ups.
Appointments: tracking with show-rate visibility, confirmation cadence, and the booking-to-sold funnel dealers use to judge ROI.
Leads by Source: channel-level performance (internet, walk-in, phone, other) with connect, appointment, show, and close rates, separating "our work" from "dealership work" with a visual dashed border.
A demo scenario system with mock data pipelines, so stakeholders could click through the product before backend APIs existed.

90+

component files

6,600+

lines of code

dashboard modules

How I validated it

I didn't design in isolation.

I put the prototype in front of real dealers and let their feedback reshape the product. The screens weren't designed from assumptions: the customer conversations directly informed what went on them.

"If you had to meet your GM tomorrow morning and present that the agent is actually doing some real work: is this good enough?"

My question to a BDC manager during validation. She immediately did live math on the screen: 127 appointments × 80% show rate = 101 walk-ins × 30% close = 34 cars sold. That told me two things: the funnel strip was the right format, and the numbers had to survive a dealer doing mental math on the spot.

"That's the stuff that makes salespeople's heads spin. They just need to be served up on a platter: do this next. To sell a car."

An industry veteran during the demo. This directly shaped the action-items redesign: away from a flat list of every call's follow-up, toward a prioritised queue with one-click actions. A salesperson should open the page and know exactly what to do next without reading a transcript.

"How many appointments set, how many showed, how many sold? That's what I look at before I sign up for another month."

A multi-rooftop dealer GM, then the critical qualifier: "Customers just say yes to an appointment to get you off the phone. So the actual conversations of 'yes, I am interested': that's what matters." He was warning us about vanity metrics in our own product. That is why the dashboard leads with a full-funnel table tracing every lead from source to sold, by channel.

What these conversations shaped

From feedback to screen.

Overview dashboard

The top strip shows five numbers at a glance: leads interacted, qualified, after-hours, human handoffs, and appointments booked. This is the "10-second check" the BDC manager validated: is the agent working or not?

Speed-to-Lead panel: hero metric is average first-contact time with week-over-week comparison, plus leads instantly reached, engaged, appointments from instant response, and % of CRM leads captured.
Leads by Source table: full funnel by source across leads, connect rate, appointments, visits, show rate, sold, and close rate. The close-rate column is separated with a dashed border to distinguish "our work" from "dealership work."

Action Items (redesigned)

The old page was a flat list of "Reach out to customer" on every call: unusable noise. The redesign, shaped by the "serve it on a platter" feedback:

Tabs by status (Open, In Progress, Completed) with counts.
Each card shows customer name, typed action, urgency indicator, and due date.
Click-through opens a slide-out with full context: conversation summary, customer preferences, vehicle of interest, and a one-click action.