Theme

David Paterni

Design Engineer

Los Altos, CA|Remote only|415-350-0268|david.paterni@gmail.com

Portfolio: https://www.davidpaterni.com/

LinkedIn: https://www.linkedin.com/in/davidpaterni/

GitHub: https://github.com/davidpaterni/

Summary

I build interfaces in React and TypeScript, from the component API to the running product. I've designed, built, and shipped three live products end to end: an accessibility compliance agent on Next.js and Supabase that opens fixes as real pull requests, an AI interview coach in React, Next.js, TypeScript, and Tailwind, and an investment calculator on Vercel that statically generates a page for every asset and year. I build token pipelines from primitive to semantic to component, hand build accessible SVG charts with no charting library, and ship keyboard, focus, and ARIA behavior inside the component. I build with Cursor and Claude Code and review what they produce. Inside organizations I've partnered with engineering through production, including a real estate transaction lifecycle carried from offer through disbursement.

Capabilities

  • Front End: React (Hooks, Composition, Server Components), TypeScript, Next.js App Router, Semantic HTML, State Management
  • Styling: Tailwind, CSS Grid and Flexbox, Container Queries, :has(), Custom Properties, clamp(), vanilla-extract, CSS Modules
  • Component Engineering: Component API Design, Variants, Composition, Slots, Polymorphism, Controlled and Uncontrolled Patterns
  • Headless Primitives: Radix, React Aria
  • Design Systems in Code: Primitive to Semantic to Component Tokens, Style Dictionary, Multi Brand Theming, Light and Dark From One Token Set With No Flash on Load, Storybook, Versioning and Distribution
  • Accessibility Engineering: WCAG 2.2 AA, EN 301 549, ARIA Semantics, Keyboard Navigation, Focus Management and Focus Return, Reduced Motion
  • Screen Reader Testing: NVDA, JAWS, VoiceOver, TalkBack
  • Data Visualization: Hand Built Accessible SVG, No Charting Dependency, Keyboard Navigable Charts, ARIA Live Readouts
  • Motion: Web Animations API, Spring Physics, Enter and Exit Orchestration, Gesture and Drag, Reduced Motion Fallbacks
  • Quality and Performance: Visual Regression (Chromatic, Playwright), Core Web Vitals, Performance Budgets, Browser Rendering Model, DevTools Debugging
  • Workflow: Git, Pull Requests, Code Review, Monorepos, Reading API Contracts
  • Platforms: Vercel, Supabase, Static Generation
  • AI Tooling: Cursor, Claude Code, v0
  • AI Interface Patterns: Human in the Loop Review, Explainability, Agent Oversight, Approval and Permission Surfaces
  • Design: Figma (Variables, Libraries), Interaction Design, Prototyping, Usability Testing

Experience

Proof Practice Consulting

Product Design Consultant | Dec 2025 to Present

  • https://www.proofpracticeconsulting.com
  • Building solutions for law firms, accountants, clinics, consultancies, trades, contractors, agencies, and any small to mid size business that sells a service rather than a product off a shelf.

Anywhere Real Estate

Senior Product Designer | Remote | 2022 to Dec 2025

  • Increased lead intent conversion 8 to 12% by redesigning property search and discovery, validated with funnel analysis and experimentation.
  • Reduced task time 15 to 25% with guided agent workflows built on templates and structured steps.
  • Designed the transaction lifecycle end to end and shipped to production: offer and contract, escrow and earnest money, title and closing, and commission and disbursement across payment rails.

Altia

Senior Product Designer | Nov 2019 to Dec 2021

  • Built a streamlined selection tool for configuration heavy workflows, shortening time to decision to seconds.
  • Designed a unified SaaS platform for project and file management, improving onboarding and daily workflows across roles.
  • Translated complex system logic into usable, consistent workflows for enterprise teams.

ForeSee Results

Senior Product Designer | Mar 2017 to Nov 2019

  • Reduced admin setup time 30% by redesigning permissions and onboarding.
  • Led zero to one design of Replay, a session replay product for experience analytics.

Earlier

StatMuse, Design Lead. Meltwater, Senior UX Designer. The Huffington Post, Founding Designer, mobile apps. Compete, Designer.

Projects

KeySign

Field app that carries a real estate agent from a buyer's yes at the curb to an open escrow file, with each state's forms and deadlines built in.

Case study for KeySign, opens in a new tab Prototype for KeySign, opens in a new tab

Allowance

Business banking app where an AI agent pays routine vendor bills inside the owner's rules, stops on new bank details or an unusual amount, and holds every payment a day so it can be stopped.

Case study for Allowance, opens in a new tab Prototype for Allowance, opens in a new tab

1QR

Scan to pay flow that confirms who a QR code pays and shows the true total before money moves.

Case study for 1QR, opens in a new tab Prototype for 1QR, opens in a new tab

How Much Would I Have If

What if investment calculator with a static page for every asset and year.

Case study for How Much Would I Have If, opens in a new tab Live site for How Much Would I Have If, opens in a new tab

Watchtower

Supervision console that holds an autonomous voice agent's consequential actions on a timer that fails closed.

Case study for Watchtower, opens in a new tab Prototype for Watchtower, opens in a new tab

Criterion

AI interview coach where every score links to the words that earned it and can be challenged.

Case study for Criterion, opens in a new tab Live site for Criterion, opens in a new tab

Readout

A data story about Japanese earthquakes, told in hand built SVG charts with a public dashboard behind them.

Case study for Readout, opens in a new tab Prototype for Readout, opens in a new tab

Conformly

European Accessibility Act compliance agent that ships fixes as pull requests and never says compliant.

Case study for Conformly, opens in a new tab Live site for Conformly, opens in a new tab

Vantage

Incident investigation console that collapses an alert cascade to its originating signal.

Case study for Vantage, opens in a new tab Prototype for Vantage, opens in a new tab

Steer

Turns a loose request into a visible, editable brief before the model writes.

Case study for Steer, opens in a new tab Prototype for Steer, opens in a new tab

Ground

Traces every AI claim to its sources, confidence, and freshness.

Case study for Ground, opens in a new tab Prototype for Ground, opens in a new tab

Oversee

Agent control surface to scope, preview, interrupt, and undo real actions.

Case study for Oversee, opens in a new tab Prototype for Oversee, opens in a new tab

Recall

Assistant memory you can read, scope, edit, and revoke.

Case study for Recall, opens in a new tab Prototype for Recall, opens in a new tab

Kinetic

Consumer banking design system with one token engine driving any brand.

Case study for Kinetic, opens in a new tab Prototype for Kinetic, opens in a new tab

Education

  • BFA, Graphic Design, Art Institute of California
  • AAS, University of Colorado Boulder