Shield Legal LLC (2026–present)

Principal Architect UI/UX. The chapter that follows Cox Automotive — this is where the platform work lands in a new domain and a new team.

Status

Early chapter — 22 days in as of April 2026. The mandate is clear; the execution is in progress.

Current Mandate

Three interlocking tasks define the opening work:

1. ADR: UI Stack for an AI-Native Development Team

Authoring the Architecture Decision Record that defines the UI stack Shield Legal will build on. The stack under consideration:

Layer Choice
Framework React
Component library shadcn/ui
Styling Tailwind CSS
State management Zustand + persist middleware
Agent integration MCP tooling
AI assistant Claude (under evaluation)
Interaction pattern Action–State
React style Functional components preferred

The ADR isn't just a technology list — it's the architectural argument for why this stack is coherent for a team building AI-native products. The action-state pattern, validated across 4 apps × 7 frameworks at Cox, is the centerpiece: it gives agents and humans the same contract for driving UI state.

2. Train & Mentor the Engineering Team on AI-Native UI Development

Bringing the team up to speed on what "AI-native" means in practice — not AI-assisted (LLMs writing code) but AI-integrated (agents driving interfaces through declared contracts). The action-state pattern is the primary vehicle: teach the pattern once, and both human developers and LLM agents can reason about any component built on it.

3. Ongoing Forum to Support the Training

A recurring forum to sustain the knowledge transfer — questions, worked examples, pattern review, and the kind of incremental calibration that can't happen in a single training session.

Why This Stack

The Cox Automotive chapter established web components as the composable primitive. Shield Legal's stack shifts to React + shadcn for a different reason: the team is already React-native, and shadcn's unstyled component model plays well with Tailwind in the same way Lit components did at Cox — the styling layer (Tailwind) is separate from the component layer, and both can be locked to design constraints without coupling.

Zustand with persist replaces the event bus as the state primitive. The event bus (mitt.js) was the right choice for a micro-frontend topology where components need to communicate across framework boundaries without direct coupling. In a single-framework React app, Zustand gives the same decoupled state management with better DevTools, built-in middleware, and first-class React integration. The action-state pattern maps onto Zustand naturally: actions are Zustand store methods, state is the store's observable slice.

MCP tooling and Claude complete the AI-native picture: the declared action-state surface becomes the agent API. An LLM can inspect the store, invoke actions by name, and observe state transitions — the same inspectability that Proofs mode gave to the YAML platform, now applied to a production React stack.

What Will Go Here