Hola, soy Tomás Fernández

Del brief al píxel,
del píxel al sistema.

Desarrollador frontend y UX/UI con 22 años de experiencia, especializado en design systems. Domino Angular, Vue, Lit y React, y llevo funcionalidades completas de la API en Node a la interfaz. Soy el principal responsable de Skeletor, el design system de Game Strategies, y trabajo cada día con Claude.

Descargar CV Ver casos de estudio

EN 30 SEGUNDOS

Perfil: Frontend y UX/UI senior, con base full stack
Especialidad: Design systems y micro-frontends
Stack principal: Angular · Vue · Lit · React · Node
Ubicación: Madrid · remoto preferido, también híbrido
Idiomas: Español nativo · inglés medio
Ahora: Game Strategies, desde 2017

Ver el CV completo Escribirme

años construyendo interfaces

~15

apps usan Skeletor

frameworks en producción: Angular, Vue, Lit, React

repositorios privados de Game Strategies con código mío

01 — CASOS

Casos destacados

Cinco proyectos que muestran cómo trabajo: design systems, producto, juegos e IA. El código es de Game Strategies y está en repositorios privados, así que aquí verás capturas, decisiones y resultados.

2020 — hoy · Principal responsable

Skeletor, el design system de Game Strategies

Web components y design tokens que usan unas 15 aplicaciones en Angular, Vue, React y Lit. Nació de mi framework SASS de 2014 y sigue creciendo.

LitDesign tokensStorybookAccesibilidadnpm

Leer el caso →

Nuevo Dashboard de clase del LMS de Game Strategies con KPIs, estado de alumnos y opinión

Dashboard de cliente del LMS con aplicabilidad, recomendación, valoración media y NPS

2019 — 2026 · UX y desarrollo

Dashboards del LMS: de clase y de cliente

Dashboard de clase, del brief a producción: 16 métricas auditadas, roles y estados vacíos para 4 breakpoints, en Angular con Skeletor. Y los widgets del dashboard de cliente: métricas, NPS, horas y competencias.

2025 — 2026 · Interfaces y componentes

Roleplay con IA

Una herramienta para crear, medir y probar roleplays de voz con avatares: interfaces y componentes del panel de administración y UI del juego.

Home del campus de Game Strategies con el curso destacado, los itinerarios y los cursos del alumno

2020 — hoy · Interfaz

Campus del alumno y Mentor, su guía con IA

El portal donde los alumnos encuentran y juegan sus cursos: diseño, maquetación y estilos. Dentro vive Mentor, el guía con IA en Lit que recomienda cursos y conversa por voz o texto.

Juego MARS: HUD de recursos sobre la colonia

2017 — 2021 · UI de juegos

Juegos de formación: interfaz gamificada

Menús, HUD, recompensas y pantallas de juego de ADA, TKS y MARS, y la UI de Pacific y Merchants, sobre el motor GAT.

Leer el caso →

Micro-frontends en Lit

Piezas que se integran en Admin, LMS y campus como web components.

Mi Cuenta
El área de cuenta de Admin y LMS: datos de empresa, plan y suscripción, perfil y administradores. De la API en Node a la interfaz, con tests en Playwright.
Roleplay
Panel para crear y medir roleplays con IA: asistente de creación, módulos e indicadores.
Mentor
El guía con IA del campus: recomienda cursos y conversa por voz o texto.
Informes
Visor de informes que cualquier aplicación puede incrustar.

02 — QUÉ HAGO

Lo que aporto a un equipo

Frontend y UX/UI

Interfaces claras y accesibles en Angular, Vue, Lit y React. Defino el producto con briefs y lo construyo yo mismo.

Lo demuestra: Dashboard de clase →

Design systems y web components

El sistema con el que se construyen unas 15 apps: componentes Lit, tokens, Storybook y publicación en npm.

Lo demuestra: Skeletor →

Full stack y micro-frontends

Micro-frontends que encajan en cualquier stack y funcionalidades completas, de la API en Node a la interfaz. Ese código vive en repos privados de Game Strategies: LMS, campus, editor de cursos y micro-frontends.

Lo demuestra: Mi Cuenta →

IA en el producto y en el proceso

Diseño interfaces para productos con IA y uso Claude a fondo en mi trabajo: Fable, Opus, Claude Code y Claude Design.

Lo demuestran: Roleplay y Mentor →

03 — STACK

Cuatro frameworks, años en producción

No solo los he probado: los he llevado a producción.

2017 — hoy

Angular

LMS de administración (2.000 commits), migración de Angular 7 a 22, integración de web components.

2019 — hoy

Vue

Campus del alumno con PWA y RTL, herramienta de autoría y visor de informes.

2020 — hoy

Lit

Skeletor y micro-frontends: Mi Cuenta, Roleplay, Mentor e informes.

2017 — hoy

React

Interfaz gamificada de los juegos de formación ADA, TKS y MARS (y UI de Pacific y Merchants), y parte de la UI del roleplay 3D (React 19).

TypeScript · JavaScriptNode · Express · NestJSSASS · CSS modernoStorybookPlaywright · VitestGitHub · npmWebpack · ViteClaude: Fable, Opus, Code, Design

04 — FORMACIÓN

Lo que enseño y cómo trabajo

Formación impartida

2023Sistemas de diseño con LitElementGame Strategies

2021 — 22Arquitectura de micro-frontendsGame Strategies

2021 — 22UX y definición de productoGame Strategies

2016SASS + Kit + PreprosHCD · curso con web propia de 5 módulos

HCDFlexboxTaller interno

Cómo trabajo

1Componentes antes que páginas. Lo que se repite se convierte en sistema.
2Código limpio y sencillo. Soy maniático del orden: nombres claros, piezas pequeñas y la arquitectura más simple que resuelva bien cada funcionalidad.
3Estándares primero, frameworks después. Por eso Skeletor funciona en cualquier stack.
4La UX decide la forma. Una tarea principal por vista; cada elemento se gana su sitio.
5Para todos los dispositivos y todas las personas. Accesibilidad desde que hacía portales AA en 2005.
6La IA, parte del equipo. Briefs, diseño y código con Claude, con criterio propio en cada paso.