CURRICULUM VITAE

Tomás Fernández Pérez

Frontend & UX/UI Engineer · Design Systems

Madrid, Spain (remote preferred, hybrid also possible)

uipixeltomas@gmail.compixeltomas.comLinkedIn
Download as PDF

Profile

Frontend & UX/UI engineer with 22 years of experience, 9 of them at Game Strategies, specialised in design systems and with a full stack background (Node, Express and NestJS). Since 2020 I have been the main developer of Skeletor, the web components design system now used by around 15 applications in Angular, Vue, React and Lit.

I design micro-frontend architectures, define products with UX briefs and take them all the way to code. I'm obsessive about clean, simple code: readable, small pieces and the simplest architecture that solves each feature well. I have advanced knowledge of AI applied to development: Claude (Fable and Opus), Claude Code and Claude Design. I have trained teams in micro-frontends, UX and SASS.

Key skills

  • Design systems and web components: Lit, Shadow DOM, design tokens with style-dictionary, Storybook and accessibility (ARIA, keyboard, RTL, high contrast). npm publishing with semver: ~87 releases.
  • Frontend and micro-frontend architecture: embeddable web components, Module Federation, event-based communication between MFEs and host, Angular migrations.
  • UX taken to code: product briefs, metrics audits, roles and permissions, empty states, responsive design, prototyping in HTML/SCSS.
  • AI in the product and in the process: interfaces for AI products (voice roleplay, smart guide). Advanced knowledge of Claude (Fable, Opus), Claude Code and Claude Design: a CLAUDE.md per repository, brief-to-design-to-code workflows, AI-assisted PR review.

Stack: Lit · Angular · Vue 3 · React · TypeScript/JavaScript · SASS/modern CSS (grid, container queries, popover) · Storybook · Node, Express and NestJS · Playwright, Vitest and mocha · Webpack, Vite and esbuild · GitHub · npm · Contentful · Chart.js

Experience

Game Strategies (formerly Gamelearn) · Go-to frontend and UI developer · 2017–present

Training platform built on gamified serious games. I contribute to 52 of the company's private frontend and backend repositories: LMS, campus, course editor and micro-frontends.

  • Design system: main developer of Skeletor since 2020, built together with the team; I wrote 27 of its 35 original components. I maintain it today (v2 to v4.2, Lit 3) and around 15 applications use it. I also maintain the design tokens and iconography (gl-style-dictionary).
  • LMS admin app (Angular): one of its main contributors since 2017, with 2,000 commits. I built the styling architecture, the new Class dashboard and the Progress/FUNDAE tab, from UX brief to production, and much of the client dashboard's widgets (metrics, NPS, hours and skills). I integrated Skeletor into Angular, replacing Angular Material.
  • Lit micro-frontends: I built almost all the interfaces and components of the AI Roleplay panel, and created My Account (~83% of the code, with Playwright tests), gl-reports, the Mentor guide and the cookie consent manager.
  • AI product: part of the UI of the 3D roleplay in React 19 (real-time indicators, preview mode and report viewer) and end-to-end features on the Node backend.
  • Migration: I moved the supervisors' portal from Angular 7 to 22 and fully redesigned it.
  • Learner campus (Vue 3): I designed and built the layout of the portal where every course is played (home, learning paths, course detail, progress and ranking), and I've written more of the app's styles than anyone else. Shareable diplomas, PWA with push notifications and RTL support for Arabic.
  • Serious games and gamification (2017–2021): I was responsible for practically the whole gamified interface of three commercial games (ADA, TKS and MARS; 1,323 commits) and of the GAT engine: points, rankings, rewards, menus, HUD, viewers and game screens. I also built the menu and button UI of Pacific and Merchants. I wrote 100% of the styles in MARS's UI and 98% of the GAT engine's. I prototyped more than 130 screens.

HCD (Human Computer Development) · UI Developer · 2011–2017

  • Interfaces for Orange: online store, customer area, Orange Empresas and the miOrange app (iPhone, Android and BlackBerry).
  • Projects for BBVA, Banco Popular, Banco Santander (AngularJS with REST services), IBM and Pandora.
  • Internal SASS and Flexbox trainer.

Earlier roles · 2004–2011

  • Ximetrix (2005–2009): accessible AA and AAA portals (060.es, Casa Real, Fundación Reina Sofía) and business logic for Telefónica.
  • Freelance (2009–2011) and Vector Software (2004–2005): content management systems in .NET, WordPress and projects for Banco Santander.

Teaching and technical leadership

  • Design systems with LitElement · Game Strategies, 2023.
  • Micro-frontend architecture · Game Strategies, 2021–2022. Included the MFE–host communication guide (gl-notice).
  • UX and product definition · Game Strategies, 2021–2022.
  • SASS + Kit + Prepros and Flexbox · HCD, 2016. Course with its own 5-module website and attendee evaluation.
  • Technical documentation for Game Strategies' SASS frameworks and for Skeletor; product briefs for design and development.

Education

  • Java J2SE/J2EE, Oracle and UML programming (Microforum, Madrid) and graphic design (650 h, 2003)
  • Professional Certificate in Software Application Programming · 2004
  • Higher Technical Diploma in IT Systems Administration · 2001–2003, Salamanca
  • Competency Development Programme (DISC assessment and development plan) · Elige, 2014

Languages and interests

Native Spanish and intermediate English, spoken and written. In my free time: cooking, flamenco guitar and cinema.