01 / 06 Fast prototyping
Prototypes it fast.
At Invisible I built the operations-manager app and the agent app while priorities shifted by the hour, keeping the front end ready ahead of the back end.
SkillsFast prototyping
- Clickable prototypesin Figma, then in code
- Claude Designexploring directions early
- Claude Codemy main build tool
- Vitefor apps
- Storybookcomponents in isolation
- Netlifya deploy preview for every change
2apps built while priorities shifted by the hourInvisible, the operations-manager and agent apps
02 / 06 UX/UI design
Designs the screen.
Five years of UX and UI design: every screen at Strevian, the Gamefound campaign page across two iterations, and the route-scheduling UI for Tri-County Pest Control.
SkillsUX/UI design
- Figmamy primary design tool
- User flowsInvisible onboarding, assessments to payout setup
- Visual designcampaign pages, handouts and a weekly bulletin
- Responsive webcarlislecofc.com, rebuilt on Storyblok
- Art directioncommissioned illustrators for Eternal Quest of Legends
- AccessibilityWCAG AA, contrast measured in CI
5years of UX and UI designfreelance clients, Dwinter and Strevian
03 / 06 Front-end engineering
Builds the product.
Three years building production React and TypeScript apps. At Invisible I was one of the first engineers on a from-scratch platform, and built an auto-save system used by 1,000+ annotation agents.
SkillsFront-end engineering
- Reactthree years in production
- TypeScriptstrict mode
- TanStack QueryInvisible's new platform
- Next.jsInvisible's marketing site, SEO score 100
- tRPC and PostgresChurchVue's foundation
- Micro-frontendsproduction exposure at Invisible
1,000+annotation agents on the auto-save system I builtInvisible, shared by every component on the canvas
04 / 06 Design systems
Builds the system.
Three accessible React design systems, 113-130 components each, with tokens layered Style, then Brand, then Theme, and WCAG AA contrast checked in CI.
SkillsDesign systems
- Design tokensStyle, then Brand, then Theme
- Theminglight and dark from one token set
- Storybookone for every design system
- Base UI and Radixthe primitives underneath
- Component librariesI started Invisible's, with accessibility tests
- Tailwind CSSon sites that suit it
3design systems, one per product line113-130 components each, private npm packages
05 / 06 Delivery
Proves every merge.
I write the standard: 20 rules and 82 checks behind a 10-stage merge gate, each proven by a fixture. AI coding agents build behind it. I review and merge; agents never approve their own work.
SkillsDelivery
- Vitest and Playwrightunit and end to end, with axe
- GitHub Actionsthe ten-stage merge gate
- Fixturesevery check proves it still fires
- Security checksgitleaks, semgrep and audit
- Lineartickets an agent can build from
- Self-hosted agent runnerticket to pull request
- Automated reviewCodex and Bugbot comment, the wall decides
- Multi-agent workflowsparallel reviewers, adversarial verifiers
82automated checks behind a 10-stage merge gatethe engineering standard I wrote
06 / 06 Leading initiatives
Leads the initiative.
I lead initiatives end to end: I keep every side of the work talking, and I keep the front end ready ahead of the back end, so integrations land smoothly and a change of direction reuses what is already built.
Read how I led onboarding and the marketing site at InvisibleSkillsLeading initiatives
- Leading initiativesonboarding and opportunities at Invisible
- Communicationmarketing's sole engineering liaison
- Front end ahead of the back endso integrations land smoothly
- Back-end partnershipa finance app built with its engineer
- Pivotscode structured to reuse prior work
- Marketing site leadSEO audit score raised to 100
5,000+agents onboarded, toward a 100,000-agent goalthe onboarding initiative I led at Invisible
02Proof · numbers with their sources
Measured, not marketed.
Each figure carries where it came from. None of them is a headline on its own.
Set in tabular numerals so the columns hold still.
Open to remote front-end, design-engineer and UX-engineer roles, full-time or contract-to-hire.
- 3accessible React design systems, 113-130 components each, with design tokens, theming, Storybook and WCAG AA contrast checks in CIprivate npm packages, used across three product lines
- 1,100+tests behind eternalquestoflegends.com8-act interactive tutorial and card gallery
- 5,000+agents onboarded through the onboarding front end I led at Invisibletoward a 100,000-agent goal
- 1,000+annotation agents on the auto-save system I built at Invisibleshared by every component on the annotation canvas
- 3years building production React and TypeScript appsresume, Sep 2026
- 5years of UX and UI designresume, Sep 2026
- 100SEO audit score on Invisible's marketing site, about a 50% improvementas marketing-site dev lead
- React
- TypeScript
- Next.js
- Astro
- Tailwind CSS
- Storybook
- design tokens
- Figma
- accessibility (WCAG AA)
- GSAP
- Three.js
- Claude Code
- Storyblok
- Netlify
03Selected work · four places, seven projects
What I built, and where.
Four places I have done the work: two and a half years at an AI-training company, the game company I co-founded, a church I build and design for, and my own software company. Each one opens with what I did there.
- 01 / 04
Invisible
I built the front ends thousands of AI trainers relied on.AI-training company01 project - 02 / 04
Dwinter
I build our card games for the browser, and I designed the Gamefound campaign page.Story-driven tabletop games02 projects - 03 / 04
Carlisle church of Christ
I rebuilt the church’s site so its staff edit it themselves, and I design its weekly bulletin.Freelance client01 project - 04 / 04
Strevian
I design every screen, write the engineering standard, and rule on every merge.My own software company03 projects
04Token bench · one slider, the whole Brand layer
Every color on this page is a token. Move one.
The hue rewrites all three Brand tokens on :root and the page follows, live. A WCAG AA check runs on the rendered colors in both themes, and only a set that passes reaches the page: anything that fails stays in the sandbox and the site keeps the last color that passed.
Style, then Brand, then Theme. The Switch in the hero rewrites only the third.
Lightness, presets and the merge are on the systems page, where a color can be pushed until the guard blocks it.
Brand layer --wd-amber
Amber is the human color: the ruling, the primary action, the focus ring.
CHK contrast · 5.9:1 text · 5.0:1 UI · pass · both themes · sample
05Delivery loop · the human is the only manual gate
A rule without a check is a wish.
I write the tickets and the engineering standard, make the rulings, and review and merge. AI coding agents build behind that standard, then prove the build. Agents never approve their own work.
Mechanism first, then the loop, then what it caught. The whole story is on the standard page.
Press Merge. The diagram will not do it for you.
The loop · Linear ticket to a self-hosted agent runner to a PR against a walled repo to the ten gates to automated review to my ruling
06Handcrafted · real illustration and print, credited
Humans lead creative work.
Every Eternal Quest of Legends illustration below is by a commissioned artist, credited by name on each card. Layout, type, art direction and campaign structure: Wesley. The bulletin is quiet editorial work for the same church whose site I rebuilt.
Convention handouts for Eternal Quest of Legends. One layout system, recolored per faction, each carrying its own headline and character.
One template, four faction colorways
Illustration by commissioned artists, credited by name on each card. Layout, type and art direction: Wesley.
07Method · how I work
Rulings, with options.
Three of the lines. The rest, and where each came from, are on the about page.
The five steps under all three run left to right at the foot.
- 01Director, not typist.
- 02Root cause over quick fix.
- 03Understand the system before changing it.
- Frame
- Options
- Pressure-test
- Lock
- Record
Frame it, weigh the options, pressure-test them, lock the ruling, record why.
Reuse before reinvent. Humans lead creative work. I want holes found, not reassurance.
08Hire · remote, Eastern Time
Open to remote front-end, design-engineer and UX-engineer roles.
Full-time or contract-to-hire. Wellsville, PA, working remote on Eastern Time.