←All Work
03

03 / 03 — Product Module

DealerChat

Giving service teams control over when and how live chat shows up.

Role

Product Designer

Timeline

[TODO]

Year

2025

Team

[TODO]

“Dealerships wanted live chat available only during business hours, but changing that window required an engineer to edit a config file.”

Overview

DealerChat moves availability and working-hours configuration into a settings panel dealership staff can manage themselves.

The constraint: the scheduler had to handle multi-location dealerships with different hours per location, not just a single on/off switch.

My Role

Product Designer

Timeline

[TODO]

Team

[TODO]

Tools

FigmaFigma MCPClaude

Deliverables

  • Settings UI
  • Availability scheduler
  • Working-hours config
AI-native process
Figma MCP
Claude-anchored prompts
Prototype & build

The settings UI's component states were extracted from the existing DealerAssist design system via the Figma MCP, keeping DealerChat visually consistent with the rest of the platform by construction rather than manual review.

Edge cases — overlapping hours, holiday overrides — were worked through as prompts against the live prototype, then folded back into the Figma file.

Process

4 phases
01Discovery

Research

  • [TODO]
  • [TODO]
Segment
Count
Score
02Structure

Wireframes

  • [TODO]
  • [TODO]
03System

Design

  • [TODO]
  • [TODO]
04Handoff

Delivery

  • [TODO]
  • [TODO]
Handoff specs
Font size14px / 1.6
Spacing8px grid
Radius8px / 12px
Shadow0 2px 8px 0%
Duration200ms ease-out
Components
ButtonCardInputModalToastNav

Gallery

Screens
Holiday overrides
Offline state

Outcomes

Results
[TODO]

Config changes handled without engineering

[TODO]

Locations onboarded

Next Project

DealerAssist

B2B SaaS Platform — 2025