Experience

I lead the shared HQ UI component library used across 28+ international markets, turning design specs into reusable, brand-faithful React primitives on solid HTML and CSS foundations, and act as the technical bridge between Design, Product and Engineering.

• Lead the shared HQ UI component library used across 28+ international markets, turning design specs into reusable, brand-faithful React primitives on solid HTML and CSS foundations.
• Maintain the design system as a Yarn monorepo with a foundations package for design tokens and a react package for components, versioned and released independently so token updates and component API changes remain separate contracts for consuming teams.
• Own the token pipeline: tokens defined in Figma (spacing, colour) and exported in two formats, Sass variables for stylesheets and JSON for JavaScript consumption, giving design and engineering a single source of truth. Components are TypeScript and SCSS, themeable, alongside a framework-agnostic layer in plain JavaScript, HTML and CSS.
• Automated the release pipeline end to end: Conventional Commits on main drive semantic-release to resolve versions, generate changelogs, create scoped Git tags, publish to GitHub Packages and open GitHub Releases with notes.
• Enforce quality in CI with Vitest, Playwright, axe for automated accessibility checks and SonarQube for static analysis and quality gates.
• Expose the design system to AI coding agents through Figma MCP so generated code builds on real system primitives instead of inventing markup; integrated GitHub Copilot into the component development lifecycle and defined the review process that keeps AI-assisted contributions polished and regression-free.
• Delivered the frontend for a worldwide brand campaign reaching 350,000+ users, preserving a cinematic, boutique look and feel through careful motion and detail work.
• Act as the primary technical bridge between Design, Product and Engineering; author component documentation and lead hands-on React and UI workshops that scale shared engineering standards across markets.
• Orchestrated the accessibility strategy for core HQ UI components, achieving a 90% compliance rate across 28+ international markets and eliminating issues on automated auditing tools.
• Engineered a monitoring system using PowerBI to track digital health across all regions, enabling proactive resolution of performance and accessibility regressions.

• React
• TypeScript
• SCSS
• Sass
• Design Tokens
• Figma
• Figma MCP
• Yarn Workspaces
• Monorepo
• semantic-release
• Conventional Commits
• GitHub Packages
• GitHub Actions
• Vitest
• Playwright
• Axe
• SonarQube
• Storybook
• Next.js
• Contentful
• WCAG 2.1
• WCAG 2.2
• European Accessibility Act
• VoiceOver
• GitHub Copilot
• Claude Code

Freelance design and frontend engineering for brands and startups, alongside a public library of accessible component patterns and an AI-assisted workflow in which I act as the developer-validation step.

• Authored and published a public library of 12+ reusable, WCAG-compliant component patterns (tabs, modals, accordions, dropdowns, tables, pagination, scroll-jacking), structured to be consumable by AI coding agents so the accessible implementation is the default one an agent reaches for. Includes original work on accessible scroll-jacking and hotspot interfaces, areas with no prior published guidance.
• Use Claude Code daily to scaffold and ship polished component patterns, accelerating delivery without sacrificing quality, and operate as the developer-validation step in design-to-AI-to-code workflows, reviewing generated output for structure, semantics and interaction quality before production.

• React
• TypeScript
• CSS
• Storybook
• Module Federation
• Internationalisation
• Next.js
• Contentful
• Nunjucks
• Drupal
• WCAG 2.1
• WCAG 2.2
• European Accessibility Act
• Axe
• VoiceOver
• Claude Code
• AI skills

Led the migration of blog and dashboard from a legacy architecture to a modern stack at a fintech platform supporting investors, focusing on SEO, performance and maintainability.

• Migrated a legacy SQL-backed architecture to a modern React, TypeScript and GraphQL stack; comfortable diving into and modernizing unfamiliar legacy code.
• Built SSR patterns (Apollo, Next.js) for pagination and data-rich dashboards and revitalized Core Web Vitals with a custom image pipeline, sharpening LCP and mobile performance.
• Shipped Optimizely SSR A/B testing with behavior-based segmentation; contributed across PHP, Python and SQL alongside core React and TypeScript work.
• Developed a suite of high-performance tools, including financial filters and dynamic modals, ensuring consistent state management across the blog and dashboard.

• Next.js
• React
• TypeScript
• GraphQL
• Apollo
• PHP
• Python
• SQL
• WordPress
• Optimizely
• Mixpanel
• Core Web Vitals

Developed dashboards and geospatial tools for an agricultural analytics platform serving growers across North America, Europe and South America, while contributing to a design system built on third-party libraries.

• Worked on a design system built on third-party libraries, Vuetify and Material UI, theming them through design tokens written in plain CSS rather than building components from scratch, and assessed where an off-the-shelf system is the correct trade-off and where its component APIs constrain accessibility and brand differentiation.
• Built interactive, data-rich dashboards with TypeScript and Vue/Vuex, serving real-time analytics to clients across three continents.
• Key contributor migrating internal dashboards from Django to a modern Next.js, React and GraphQL (Hasura) architecture, improving interactivity and performance.
• Implemented advanced frontend performance techniques including lazy loading, code splitting and rendering optimization, ensuring smooth cross-browser performance on Safari, Chrome and Firefox.
• Identified and resolved critical geolocation bugs, directly improving the accuracy of data layers for international clients.

• Vue.js
• Vuex
• TypeScript
• React
• Next.js
• GraphQL
• Hasura
• Django
• Design Tokens
• Vuetify
• Material UI
• Mapbox GL JS
• Vercel

Worked on consumer-facing platforms and internal tools with a strong focus on a local design system, accessibility and testing practice.

• Built accessible, reusable components for a local design system in React, TypeScript and plain CSS, backed by design tokens, versioned and released through a private npm registry for internal consuming teams.
• Refactored legacy code into a reusable component library and drove the documentation migration from disorganised inline code comments to Storybook, accelerating new user-flow development across teams; led the styling migration to Emotion.
• Established accessibility testing at two layers: React Testing Library with Jest for unit and interaction coverage and Cypress for end-to-end, with axe integrated into both so accessibility regressions failed the build instead of surfacing in later audits. Raised unit-test coverage to 85%, sharply reducing regressions in consumer-facing flows.
• Engineered custom focus-management and keyboard-navigation systems for interactive components across high-traffic platforms.

• React
• TypeScript
• CSS
• Design Tokens
• Private npm registry
• Emotion
• Sass
• Redux
• React Testing Library
• Jest
• Cypress
• Axe
• Storybook
• WCAG 2.1 AA
• ARIA

Contributed to the Flow Smart TV app, covering both legacy maintenance and migration to a modern frontend stack, and addressed performance and stability during high-traffic events.

• Built custom spatial navigation for the Flow Smart TV app, tuning the remote-control model to feel native on a high-traffic media platform.
• Migrated legacy Vanilla JS and Redux to a modern Next.js, TypeScript and React Context monorepo; engineered a queue system for stability during peak live-sports events.

• React
• Next.js
• TypeScript
• Redux
• React Context
• Monorepo
• Storybook
• JavaScript (ES6+)

Technical audits, remediation and consulting for global brands in finance, retail and food.

• Implemented technical remediation (HTML, CSS, JavaScript, React) across platforms for global finance, retail and food brands; mentored junior engineers.
• Audited sites using axe, NVDA, JAWS, VoiceOver and keyboard navigation, evaluating against WCAG 2.1 AA.
• Delivered accessibility reports and action plans to clients, and collaborated in SCRUM teams across technical and non-technical stakeholders.

• WCAG 2.1 AA
• WCAG 2.2
• EN 301 549
• European Accessibility Act
• Axe
• NVDA
• JAWS
• VoiceOver
• HTML
• CSS
• JavaScript
• React

Built responsive web interfaces for enterprise applications and refactored UI components for performance and maintainability.

• Built responsive Vue.js interfaces for enterprise applications and refactored UI components for performance and maintainability.
• Implemented responsive design principles and improved accessibility across enterprise screens.
• Used AWS and Node.js for backend integration and cloud deployment.

• Vue.js
• JavaScript
• HTML/CSS
• AWS
• Node.js
• Responsive Design