← Back to Selected Works

Design governance for an AI-native product: the WhatIff design rubric.

Authored a design rubric for an open-source AI assistant — accessibility standards, interaction guidelines, component conventions, and a 1–5 adherence scoring system. The goal was to give a small team a shared decision language so design quality could scale without a dedicated design reviewer on every PR.

Role
Lead Product Designer
Scope
Design system, standards documentation
Focus
Design Governance, Accessibility, Systems Thinking
Timeline
2025 – 2026
Team
1 designer, open-source engineering contributors

Impact

12 → 0AA contrast failures eliminated between the original theme and the proposed palette
1–5 scoringadherence scale in the rubric — engineers can trade off guidelines against deadlines without needing a designer in the loop
2 deliverablesdesign rubric and a live contrast audit report — both version-controlled with the codebase
WhatIff Chat — Design Rubric: document header with TOC sidebar, 1–5 adherence scoring chips, and section tags
WhatIff Contrast Report: before/after palette comparison showing 12 failing AA pairs reduced to 0

The situation

Open-source products face a specific design governance challenge: contributors ship code continuously, often without a designer in the loop. For most features this is fine — but for an AI product where memory surfacing and message routing directly shape user trust, inconsistent design decisions compound fast. An AI that presents its memory system differently across three screens is not just visually inconsistent; it erodes the confidence users need to rely on it.

The WhatIff design rubric was written to solve this without creating a design bottleneck. The goal was a reference that engineers could consult to make confident design decisions independently — not a strict spec that required designer sign-off on every change.

The rubric

19 sections with a 1–5 adherence scoring system — engineers can trade off any guideline against deadlines without needing a designer in the loop, as long as the trade is recorded. Every item states the rule, the score, the platform it applies to, and a standard reference (WCAG, Nielsen, platform HIG) so decisions are grounded, not subjective.

WhatIff Chat — Design Rubric
0 How to use this document
1 The 3-5-7 rule
2 Progressive disclosure
3 Accessibility: visual impairment
4 Accessibility: mobility & dexterity
5 Accessibility: cognitive & learning
6 Layout: spacing
7 Layout: hierarchy
8 Layout: positioning & responsive
9 Overall page design
10 UI: components, color, type, motion
11 Modal design
12 Clutter avoidance
13 Chat & conversation patterns
14 Feedback & system status
15 Navigation & wayfinding
16 Forms & input
17 Review checklist
18 Appendix: WCAG 2.2 criteria

The contrast audit is a companion artifact — a live HTML tool that computes AA/AAA ratios against every color pair in the app's theme token set. The "before" column is the original theme pulled from themes.scss; the "after" column is the proposed palette. 12 failing pairs resolved to 0 without changing brand identity.

Both artifacts are version-controlled with the codebase. When a component changes, the review checklist in section 17 is the first thing an engineer opens — not a Jira ticket or a Slack message to design.

← Back to Selected Works Start a conversation →