Richard Hess

Skills

UI & Frontend

ReactVueLitStencilWeb ComponentsTypeScriptJavaScript (ES6+)SVGTailwind CSSCSS Grid/FlexboxAtomic DesignDesign SystemsMaterial Design

Architecture & Patterns

Spec-driven UIMCP-based tooling (FastMCP)action–state patternsevent bus (pub/sub)component librariesdesign tokensportfolio-level standards

AI & Integration

MCP servers and appsLLM tool integrationsemantic UI interaction (actions/states/events, not DOM)AI-native UI workflowsmeta-data–driven behaviors

Backend & Tooling

Node.jsExpressGraphQLREST APIsMongoDB/Mongoosepnpm/Yarn/NPMWebpackbuild pipelinesCLIs

Practices

Agiletechnical leadershipmentoringdocumentationcross-functional collaborationremote workproof-of-concept development

Experience

Principal Architect, UI/UX — Shield Legal LLC

2026 to present

Authoring the ADR for an AI-native UI stack (React, shadcn/ui, Tailwind CSS, Zustand, MCP tooling) built around the action–state pattern, independently validated across 4 reference apps with multi-framework ports (autos 7 / funnel 8 / tinker 8 / sudoku 10).
Training and mentoring the engineering team on AI-integrated UI development — agents driving interfaces through the same declared action–state contract as human developers.

Principal Architect, Portfolio UI/UX — Cox Automotive

March 2024 to March 2026

Designed and built an AI-native, spec-driven UI platform where YAML specifications generate fully reactive interfaces, live previews, and framework-specific web components, enabling LLMs and human developers to work from a single source of truth.
Architected a custom MCP host server (built on FastMCP) and a suite of 5 MCP servers exposing UI capabilities, resources, and tools so LLMs can drive rich interfaces via declarative action–state patterns — without reliance on DOM structure.
Created the Juris runtime as the core reactive engine, with a 17-component registry (design system, Material Design, layout, marketing) styled via Tailwind and backed by a unified SVG icon system of 18,978 icons across 9 families.
Implemented a client-side event bus (pub/sub) and meta-data–driven action–state models so both LLMs and users can trigger and observe UI state transitions in a robust, testable way.
Defined portfolio-wide UI, web component, and design system standards; partnered with product, UX, and engineering leadership across multiple products and teams.

Senior Lead Architect, Portfolio UI/UX — Cox Automotive

February 2023 to March 2024

Guided portfolio-level UI architecture across multiple products, aligning teams on shared components, patterns, and design system usage.
Drove adoption of web component–based architecture (Lit, Stencil) to increase reuse, standardize behavior, and decouple UI from specific frameworks.

Portfolio Technical Architect, UI/UX (IMS) — Cox Automotive

September 2020 to February 2023

Served as UI/UX technical lead for the IMS portfolio; introduced spec-driven approaches and componentized layouts that reduced duplication and improved feature delivery speed.

Lead Software Engineer / Lead Technical Architect, UI — Cox Automotive

July 2019 to September 2020

Built and maintained front-end features for customer-facing products; developed reusable UI components that evolved into portfolio-wide standards.

Principal UI Engineer — Skava

June 2018 to April 2019

Contributed to a next-generation e-commerce platform; created an SVG-based Material Design icon component for the internal UI framework and refactored a reference store to adopt latest framework components.
Authored Markdown documentation for the UI library and development environment; provided focused training for SI and in-house engineering teams.

Senior UI Software Engineer — Demandbase

July 2007 to January 2018

Delivered UIs for enterprise SaaS products over 10+ years as the stack evolved through Adobe Flex/AIR, AngularJS, and React/Redux.
Developed a programmatically generated SVG information funnel and a desktop AIR ticker-tape display — both requiring deep custom UI work with no off-the-shelf solutions.
Built reusable React components, rapid prototype UIs, and mock API servers in Node to validate design and technology directions.

Senior UI Software Engineer — Sapias

April 2004 to July 2007

Built a rich internet application in Adobe Flex for a vehicle tracking platform, including custom map rendering of vehicle locations before Google Maps was widely available.
Designed custom dynamic dashboard dials and worked closely with designers to refine the full application UI.

Early Career Highlights — SGI, Netscape, Taligent, Xaos Tools, Consilium, Measurex, Teknowledge

1985 to 2004

Senior Software Engineer — SGI (Silicon Graphics): Maintained ViewKit, SGI's C++ application framework; ported Quake 3 Arena to IRIX under NDA with id Software, where the official binaries ran in SGI's wall demo room; owned the official Netscape for IRIX release builds.
Senior Software Engineer — Netscape: Member of the XFE (X Windows Front End) team shipping Communicator 4.x on the X Windows workstation platform. Invented HTML signature support in Netscape Messenger and defended it until the Mac front-end team adopted it and it shipped as an official feature — the Communicator ship award reads "Inventor And Defender of The HTML Sig." Credited in Firefox's about:credits when Netscape open-sourced the browser.
Senior Software Engineer — Taligent: Systems-level object-oriented UI on Apple and IBM's joint next-generation platform — an all-OO application framework where the UI was assembled from deeply composable primitives rather than a widget toolkit.
UI Technical Lead — Xaos Tools: Led UI for creative imaging software.
Senior Staff Engineer / UI Project Manager — Consilium: Hired and led a UI group of three, then handed off management to one of those hires and moved to staff engineer as an individual contributor. Wrote a Motif application that read the TTY screen output of a large COBOL manufacturing system and generated a matching GUI — the primary modernization path for the product. Two issued patents came out of this era, on object-oriented factory-floor architecture and on viewing relationships between entities. Negotiated a four-day week in order to spend two days maintaining SGI's Motif toolkit — libXpm stewardship, maze demo X11 extensions, and WINTERP contributions.
UI Software Engineer — Measurex Automation Systems: Early industrial UI for process automation.
Apprentice Knowledge Engineer — Teknowledge (1985): First job out of Rose-Hulman, and the move that redirected a mechanical engineering degree into software. Built expert system UIs in Oyster, Teknowledge's proprietary object-oriented system, on Xerox Lisp Machines running Interlisp-D during the first commercial AI wave. Knowledge engineering was declarative work — modeling how an expert's reasoning behaves rather than writing algorithms — and those inspectable, live environments still shape the design philosophy.

Education

BS, Mechanical Engineering (Cum Laude)
Rose-Hulman Institute of Technology, Terre Haute, IN

Patents

US 5,398,336 — Object-oriented architecture for factory floor management
Consilium — issued March 14, 1995

US 5,295,242 — Apparatus and method for viewing relationships in a factory floor management system
Consilium — factory automation era

US 4,449,422 — Transmission center support mounting
Mechanical engineering — Allison Transmission / GM era

Notable Projects

Spec-Driven Development & Cleanroom Benchmark

Publishes implementation-derivable specs instead of code — each `SPEC.md` pins down behavior precisely enough (status codes, field names, validation rules, concurrency guarantees) that someone with zero access to the original implementation can rebuild it faithfully.
Used as a reproducible benchmark for how well an AI coding agent can turn a complete specification into working software with no reference implementation to copy from.
spec-cleanroom — the experiment built on top of it: two different coding agents (Gemini via Antigravity CLI, and Grok Build) independently implemented the same poker and retro apps from the identical spec, with no visibility into each other's work.

StackSpec-driven developmentTechnical writingAI evaluation

Real-Time Prototype Apps

proto-poker — free, no-signup planning-poker tool. Create a room, share the link, vote on a Fibonacci deck, reveal together.
proto-retro — sibling project mirroring proto-poker's architecture: a team retro board (Went well / To improve / Action items) with the same hidden-until-reveal mechanic.
proto-bbot — a Slack bot that tracks teammates' birthdays and announces them in-channel via a daily cron job.
proto-draw — weekend PoC: collaborative Pictionary-style drawing over the same real-time stack (stroke sampling over SSE) — exploratory architecture stress test, not daily-use tooling.
All four run on plain Vercel serverless functions with Upstash Redis for state and Server-Sent Events for realtime push — no accounts, no subscriptions, no third-party realtime vendor.

StackWeb ComponentsRedisServer-Sent EventsVercel

eswat2-mcp

personal knowledge base

A hybrid MCP + REST server (Python, FastMCP + FastAPI) exposing 40+ years of career history, projects, research, and an art collection across 7 namespaces, so any MCP-aware LLM can query who I am and what I've built.
Four interfaces onto the same underlying knowledge base — server-rendered documents, a browsable wiki, a 2D knowledge graph, and an interactive 3D graph visualization.
A `/render` endpoint turns any internal MCP URI (e.g. `eswat2://manifest`) into standalone HTML, letting individual knowledge-base resources be viewed or linked to directly outside of an MCP client.
Runs as a living personal knowledge graph rather than a static resume — this page's content was pulled directly from it.

StackPythonFastMCPFastAPIMCP

Spec-Driven MCP Server Suite

5 MCP/REST servers, Docker-orchestrated

info: yaml-platform

Juris MCP Server — YAML specs generate fully reactive Juris.js component data structures.
Lit MCP Server — YAML specs compile to production Lit 4.x web components with Shadow DOM, typed props, and state management.
Stencil MCP Server — "Components as Spec": YAML compiles to production-ready Stencil 4.x web component distributions, dual MCP + REST protocol.
SVG Icon MCP Server — unified access to 18,978 unique icons (29,710 assets) across 9 families, including Material Design, Feather, Lucide, Tabler, MDI, Nucleo UI, Phosphor, and automotive brand logos.
Tailwind MCP Server — Tailwind CSS generation with post-processing into layered CSS for Shadow DOM and document-level use.
All five are orchestrated together via Docker Compose (proto-spec-dkr), letting any MCP-aware LLM generate framework-specific UI directly from a YAML spec.

StackMCPFastMCPDockerStencilLitTailwind CSSSVG

Tinker

Minimal reference app for validating the action–state interaction pattern across frameworks — the simplest member of the same suite as Autos, Funnel, and Sudoku.

Sudoku App

one design, 10 framework implementations

app	framework	store
sudoku-wc	Stencil	@stencil/store
sudoku-uce	uCE	nanostores
sudoku-sld	Solid	built-in
sudoku-lit	Lit	nanostores
sudoku-p4t	Preact	Signals
sudoku-r3t	React 19	Zustand+persist
sudoku-s4e	Svelte	Runes
sudoku-vue	Vue 3	Pinia
sudoku-p4t+	Preact CE	Signals
sudoku-s4e+	Svelte CE	Runes

Puzzle API: serverless Rust — sudoku-rust-api, deployed at a live endpoint.
Stores utilize a simple action/state pattern; state is persisted to Local Storage.
Styling is done with Tailwind CSS and a custom color plugin.

StackStencilSvelteSolidPreactLituCEReactVueNano StoresZustandPiniaRunesSignalsTailwind CSSTypeScriptRust

Autos — Technology Demonstration

one design, 7 framework implementations

app	framework	store
autos-lit	Lit	nanostores
autos-p4t	Preact	Signals
autos-r3t	React 19	Zustand+persist
autos-sld	Solid	built-in
autos-s4e	Svelte 5	Runes
autos-vue	Vue 3	Pinia
wc-autos	Stencil	@stencil/store

Started as a take-home exercise during the Cox Automotive interview process — the prompt was to build a dealer/vehicle browsing UI against a provided API. The API didn't support CORS, so the server was re-engineered from scratch and deployed independently to unblock the work.
A GraphQL layer was built on top unprompted, as a second, more sophisticated submission — the extra work reportedly helped solidify the job offer. The GraphQL backend, gt-forza (Forza Horizon 5), still runs on Vercel today as the replacement for the original gt-sports (Gran Turismo Sport) backend.
Each app: 10 components, action/state pattern, Tailwind CSS, SVG icons via a dynamic web component loader.
Car data is sourced from racing video games — Forza Horizon 5 and Gran Turismo Sport — for rich, structured, publicly known datasets with no licensing concerns.
SVG icons provided via a dynamic web component loader.

StackStencilSvelteSolidLitPreactReactVueNano StoresZustandPiniaRunesSignalsTailwind CSSSVGGraphQL

Custom SVG Funnel

one design, 8 framework implementations

app	framework	tween engine
funnel-s4e	Svelte 5	built-in
funnel-uce	uCE	Anime.js
funnel-sld	Solid	Anime.js
funnel-lit	Lit	Anime.js
funnel-p4t	Preact	Anime.js
funnel-wc	Stencil	Anime.js
funnel-vue	Vue 3	Anime.js
funnel-r3t	React 19	Anime.js

The funnel geometry originated at Demandbase, procedurally generated at runtime with Raphael.js in ~278 lines of code. For this suite it was translated into static SVG elements, with Anime.js (or Svelte's own tweening) animating against them instead — same visual result, animation now a separate concern from the drawing logic.
The animation is fully interruptable — if the target changes mid-animation, the tween restarts from its current position with no reset or shudder, so rapid selections feel seamless.
Each app: 12 building blocks as single-file components, Tailwind CSS with a custom color plugin, responsive layout, state persisted to Local Storage, deployed on Vercel.
Styling is done with Tailwind CSS and a custom color plugin.

StackStencilSvelteSolidLituCEPreactReactVueNano StoresPiniaRunesSignalsViteTailwind CSSSVGAnime.js

Icon Libraries & Tools

s4e-icons — Material Design icon component library for Svelte (33 icons) — proofs.
s4e-ikons — automotive manufacturer logo icon library for Svelte (86 logos) — proofs.
proto-ikon-loader — dynamic SVG icon web component loader used across the Autos and Funnel suites.
Icon Proofs Web Component — wc-proofs, a simple icon proofs sheet implemented in Stencil, optimized with SVGOMG, laid out with flexbox.