Rediseño integral de la experiencia digital de la Federación de Deportes de Invierno de Castilla y León: arquitectura de información, sistema visual, web responsive y PWA llevadas hasta producción.
Durante años, la web de FDICYL había acumulado documentación, reglamentos, resultados, competiciones e históricos desde 2010. El problema no era la falta de contenido. Era una arquitectura que había crecido de forma fragmentada y una experiencia que funcionaba más como repositorio que como producto digital de consulta cotidiana.
“El reto no era crear más contenido. Era convertir años de contenido acumulado en una experiencia digital coherente, útil y fácil de navegar.”
La plataforma contenía información valiosa, pero su crecimiento durante años había provocado duplicidades, secciones desconectadas, patrones repetidos y una experiencia difícil de recorrer.
La necesidad no era simplemente modernizar la apariencia. Había que reorganizar la información, mejorar su jerarquía y construir una experiencia capaz de servir a deportistas, clubes, técnicos, familias y aficionados.
El proyecto se desarrolló desde dentro de la propia Federación y como parte de mi responsabilidad en la organización.
Mi trabajo combinó conocimiento profundo del producto y sus contenidos con decisiones de Product Design, UX/UI, arquitectura de información, sistema visual, responsive, PWA e implementación sobre el entorno real.
Estrategia y visión integral del producto digital.
Patrones de interacción, jerarquía y diseño visual.
Reestructuración de contenidos y modelos de navegación.
Foundations, tokens y biblioteca de componentes.
Diseño enfocado a mobile first con adaptación fluida.
Configuración de producto instalable y experiencia app.
Auditoría, depuración y organización de históricos.
Apoyo con agentes e integración MCP en producción.
Proyecto real · no ejercicio académico
La primera preocupación no fue el aspecto visual, sino la arquitectura de información.
Una persona que busca un reglamento, un resultado, una competición o documentación federativa no debería necesitar entender previamente cómo está organizada internamente la Federación.
El trabajo comenzó revisando el contenido existente, detectando repeticiones y observando cómo resolvían problemas similares otras federaciones autonómicas y la referencia nacional.
En esta fase no hubo entrevistas, encuestas, card sorting ni pruebas formales de usabilidad. Las decisiones se apoyaron en el conocimiento acumulado de la organización, en la observación directa de los problemas existentes, en benchmarking y en experiencia previa desarrollando productos digitales.
La primera transformación se realizó sobre JNews, modernizando portada, noticias e identidad visual.
El resultado mejoraba claramente la capa editorial, pero también permitió descubrir una limitación importante: FDICYL no era únicamente un medio de noticias.
El producto debía combinar actualidad con competiciones, calendarios, resultados, reglamentos, documentación, clubes, licencias, tecnificación y contenidos específicos por modalidad.
Modernización editorial y nueva identidad visual.
Evolución hacia una arquitectura y sistema de producto propios.
A medida que el producto crecía, fue necesario definir un lenguaje visual común capaz de mantener coherencia entre la web y la PWA.
Se establecieron foundations, reglas de color y tipografía, spacing, layouts, componentes reutilizables, estados de interacción y patrones responsive.
El sistema evolucionó junto al producto: cada nueva necesidad obligaba a comprobar si un patrón existente era suficiente, si debía ampliarse o si era necesario incorporar uno nuevo.
Azul institucional, naranja de acento y familias semánticas para success, warning, error e info.
Poppins para titulares y acciones. Heebo para lectura, metadatos y contenido funcional.
Escala modular basada en 4 / 8 para mantener consistencia entre web y PWA.
Botones, cards, badges, tablas, feedback, navegación, estados y patrones de WebAPP.
Deportistas, familias, clubes, técnicos y aficionados consultan información en contextos donde el ordenador no siempre está delante.
Calendarios, clasificaciones, resultados, noticias y documentación debían funcionar primero en pantallas pequeñas y crecer después.
La experiencia móvil se trató como una condición del diseño, no como una adaptación final.
Con la nueva web tomando forma apareció una pregunta natural:
La PWA permitió mantener el mismo ecosistema de contenidos y acercarlo al comportamiento de una aplicación instalable, accesible desde un icono y pensada para consulta frecuente.
Una web tradicional depende de que el usuario recuerde volver.
La PWA permitió incorporar notificaciones push voluntarias para resultados, competiciones, publicaciones y avisos.
Esto transformó la relación con el producto: la Federación dejaba de limitarse a publicar información y adquiría la capacidad de comunicarla directamente.
Durante el proyecto incorporé Antigravity conectado mediante MCP con Elementor como capa de apoyo para acelerar implementación e iteración sobre el producto real.
La arquitectura, las jerarquías, los componentes, el comportamiento responsive y los criterios de diseño siguieron necesitando dirección.
El ciclo de trabajo se volvió muy directo:
Cuando una solución debía repetirse, se incorporaba al sistema.
Trabajar sobre un producto real implicó gestionar años de contenido heredado, documentación real, compatibilidades, responsive, restricciones técnicas, producción y necesidades que aparecían mientras el producto evolucionaba.
También significó aceptar que algunas decisiones tendrían que revisarse después del lanzamiento según el comportamiento real de los usuarios.
REAL PRODUCT · LIVE
Nueva experiencia web publicada y operativa.
La información institucional y deportiva se organiza dentro de una lógica común.
Web y PWA utilizan patrones y reglas comunes.
El ecosistema puede instalarse y consultarse desde el dispositivo móvil.
Canal voluntario de comunicación directa con la comunidad.
El lanzamiento es el inicio de una nueva fase de observación e iteración.
Las primeras reacciones han sido positivas, pero todavía no existe suficiente histórico como para convertir impresiones en métricas de uso fiables.
La siguiente fase consiste en observar contenidos consultados, dispositivos, adopción de la PWA, uso de notificaciones y posibles fricciones.
El resultado no fue una nueva web, sino una base digital común para contenido, consulta, comunicación y evolución futura.
El método debe adaptarse al contexto, a las restricciones y al momento del producto.
El cambio importante empezó cuando dejamos de pensar solo en páginas y empezamos a ordenar el sistema.
Su valor está en mantener coherencia y facilitar evolución, no en existir como documentación aislada.
Publicar abre una nueva fase: observar, medir, detectar fricciones y seguir iterando.
“No empecé intentando hacer una web espectacular. Empecé intentando que encontrar información dejara de ser complicado.
El resultado terminó siendo algo bastante más grande: los primeros cimientos de un ecosistema digital para FDICYL.”
El desarrollo completo del proyecto, sus decisiones, evolución y contexto están documentados también en Medium.
Leer en Medium ↗SIGUIENTE PROYECTO
LIFFEY →