mountains

Dylan Smith

Designing & developing
0px
pixel-perfect interfaces. Building reusable and scalable systems for the people who use them.
Leading design at SmartAdvocate.
Resume

Intro

First Principles

“You don't rise to the level of your goals, you fall to the level of your systems.”

— James Clear

0px
The details matter

Small details compound over large surfaces to make a big difference.

Solutions over tools

Work backwards from the blue-sky result. Systems support the solution, not the other way around.

Be kind to your future self

Document the why and leave clever breadcrumbs.

Design TokensLayout SystemsPrototypingMCPSkills & Agents

Outcomes

2design systems

Designed & shipped end-to-end, from token architecture to WCAG-compliant components.

Tokens
States
Spacing
100+

pages of documentation authored

10+ years

across design, development, and data engineering

60%faster data migrations

Cut from 3 months to 2 weeks across 12+ concurrent projects by standardizing project structure and building a custom Python CLI package.

migration-starter-kitrepository$ db-cli migratepython cli

Work

Design SystemASP.NETTokensWCAG

SmartAdvocate UI Refresh

Sole designer & developer on the site-wide UI refresh — first design system at the company, shipped into a legacy ASP.NET / DevExpress codebase with no regressions.

Bank Reconciliation

Bringing the experience of reconciling bank statements into the 21st century.

RapidPay

Two-panel design with a guided workflow for processing payments, replacing a disjointed legacy multi-step experience.

Side projects

What I build after hours. The prompt fighter and crosscheck demos run each project's own code; rarebrew's is a recreation built on my deck data. Go ahead and poke at them.

rarebrew.gg

A Commander deckbuilder for paper Magic players, built phone first. It has a custom component library on design tokens, a Scryfall + EDHREC data layer, and insights meant to help you decide what to cut.

The card is the row
Each row is a cropped strip of the real card image, so the card's own name plate and mana cost do the work a table row would. Tap one to expand it in place. Double-faced cards get a flip.
Tabs navigate, never filter
The type strip follows your scroll and jumps between sections. Collapsing a group is the only way cards leave the screen. Tap the stats strip for insights, and drag the sheet down to dismiss it.
ReactNext.jsTypeScriptTailwindCSSSupabasePWA
Open rarebrew.gg
Recreated · my Light Party deck

Prompt
Fighter

Build a fighter from four 80-character prompts. Claude turns them into stats, two moves, a flaw, and a 16×16 sprite, and then it fights a ghost that someone else built.

The budget is the anti-cheat.
Stats must total exactly 30 body and 20 spirit points. Describe something invincible and you get a lopsided spread, not extra points.
The model picks, the engine decides.
Moves come from a fixed set of effects, so no prompt can invent “instantly wins.” Same seed, same fight, every time.
The roster · 6 of 84
  • Grull the Unblinking, 177 wins, 71 losses
  • Sax Solomon, 4 wins, 4 losses
  • Vaelith Nyx-9, 9 wins, 5 losses
  • Broadsheet Kestrel, 6 wins, 18 losses
  • Sir Wobbly Bramm, 9 wins, 13 losses
  • Vivienne Mirage, 1 wins, 28 losses

HI-SCORE GRULL 177–71

Next.jsSupabaseClaude APIVitest
Play prompt fighter ▶
Replay · real generations, real sim
Mobile-first PWA

Type a crossword clue, get candidate answers as letter tiles plus what the word means.

It's installable and works offline, and there's no backend: every source is called straight from the browser.

Convention over association
Datamuse knows which words sit near a clue. Crosswords want the words setters actually use. A hand-curated corpus of crosswordese answers instantly, and the network results merge in underneath it.
Evidence, not padding
Answers backed by published puzzles get top billing, and everything else is labeled as related words. When Datamuse pads its results with junk, the app shows nothing rather than looking broken.
TypeScriptVitePWAVitest
Try crosscheck ↗Source ↗
Live · real parser + corpus, live Datamuse