Spring-physics segmented switch
One layout-shift-safe pill indicator, sliding on a spring. Arrow keys work too.
active: Design
transform-only · aria-selected · reduced-motion aware
Craft, running live
The interaction lab
Touch anything below. Four interactions, hand-built on this site's own motion dependency: springs, notification choreography, keyboard-first commands, and the vitals telemetry that keeps them honest.
Motion
Fluid toast notification engine
Stacked, self-dismissing, layout-aware. Queue depth capped so a burst never buries the page.
queue empty — trigger one ↓
aria-live polite · max 3 · timers cleaned on unmount
Keyboard-first command actions
Fuzzy filter, roving focus, Enter to run. Every action reachable without a pointer.
⌘K
4 actions · 0 pointer events required
↑ ↓ to move · enter to run · focus-visible ring
Production web vitals telemetry
Measured against a production build, not the dev server — the number that actually ships.
0.82s
LCP
34ms
INP
0.000
CLS
Accessibility 100SEO 100Contrast fixed to 4.5:1
muted token darkened site-side · published token untouched
Selected work
Case studies
How I build
AI-augmented development workflow
- 01
Plan with a frontier model
Use Claude Code with advanced models for planning and architecture decisions on complex tasks and larger features.
- 02
Delegate execution
Hand off implementation to smaller, faster models once the plan and architecture are locked in.
- 03
Iterate in the editor
Use Cursor as the primary IDE, with integrated AI chat for rapid iteration and quick fixes.
- 04
Review, ship, monitor
An end-to-end workflow: task planning → implementation → self code review → pull request creation → monitoring and resolving review comments.
Toolbox
Skills
Frontend
- React
- Next.js
- TypeScript
- TanStack Query
- Storybook
- Tailwind CSS
- HeroUI
Backend
- Node.js
- NestJS
- tRPC
- GraphQL
- REST APIs
- Prisma
- PostgreSQL
Architecture & Engineering
- Frontend Architecture
- Design Systems
- Nx Monorepos
- API Design
- Performance Optimization
DevOps & Observability
- Docker
- GitHub Actions
- CI/CD
- Grafana
- Production Debugging
Testing
- Jest
- Cypress
- Unit Testing
- Component Testing
AI & LLM Tooling
- Vercel AI SDK
- RAG
- Claude Code
- Cursor
- Radix Primitives
Experience
Where I've worked
Senior Software Engineer · Couchsurfing
Aug 2024 – Present
Guadalajara, MX (Hybrid)
- Key contributor to Couchsurfing's next-generation web platform, replacing a legacy application with a modern React, TypeScript, and tRPC architecture alongside a Principal Engineer and distributed teams.
- Shape frontend architecture within an Nx monorepo — scalable patterns, shared libraries, and reusable components consumed across product areas.
- Own the team's Design System end to end: component API design, token architecture, and Storybook documentation, so product teams build consistent UI without re-deriving spacing or color decisions each time.
- Lead performance initiatives across Lighthouse, Core Web Vitals, bundle size, and runtime behavior — treating performance as a design-system concern, not an afterthought.
- Investigate and resolve production issues using Grafana.
Software Engineer · SoftServe
Oct 2023 – Aug 2024
Remote
- Led migration of a smart-home e-commerce platform from Ember to React/TypeScript.
- Built customer-facing features across Coupons, Fulfillment, and Customer workflows.
- Raised engineering standards via ESLint, Prettier, and testing strategy adoption.
- Mentored engineers on React, TypeScript, and frontend architecture.
Fullstack Developer · Intel
Dec 2021 – Oct 2023
Remote
- Built and maintained internal engineering platforms used by ~100 engineers.
- Designed automated ticket routing workflows, reducing manual triage effort.
- Led migration of a corporate platform from WordPress to React/Node.js, cutting page load times from ~9s to ~3.5s.
Fullstack Developer · Oh Travel Marketing
Apr 2018 – Dec 2021
Puerto Vallarta, MX
- Delivered end-to-end software for tourism and hospitality clients, from requirements through production support.
- Built a custom event reservation platform with dynamic pricing logic.
Background
Education
B.S. Software Engineering
Universidad Tecnológica de Bahía de Banderas
2014 – 2017English Language Scholarship
Dominican University, Chicago
2014Asynchronous-ready
Six years across hybrid, remote, and fully distributed teams — bilingual written communication, timezone-agnostic handoffs, and decisions documented where the next person can find them.
Writing
Latest posts
September 9, 2026
I started writing in public. Here's what the numbers say.
I began posting at the end of August to force myself to understand things properly. Every chart here reads live from Buffer's API — including the one that shows my most-seen post isn't writing at all.
- Writing
- Data Viz
- Career
September 3, 2026
Your Design System Is Only as Good as Your CSS Architecture
A good Design System isn't just a collection of components — it's a system of rules that makes UI predictable. And that starts with understanding CSS.
- Design Systems
- CSS
- AI
August 15, 2026
Open source: I published my first npm package
Publishing @neftaliaguilar/ui taught me more about API design and maintenance burden than any internal component library ever did.
- Open Source
- React
- Design Systems
Craft
How this site is built
Lighthouse scores measured against a production build, not the dev server — the number that actually ships.
- Accessibility
- 100
- SEO
- 100
- A skip-to-content link, correct heading order on every route (each page has exactly one h1), and focus-visible states — using the design system's own
--nef-focus-ringtoken — on every interactive element that didn't already have one. - Every animation on this page — the scroll reveals, the view transitions, the interaction lab's own motion — honors
prefers-reduced-motion. Turn it on in your OS settings and reload.