noé hidalgo.
PROYECTO DETALLADODesign System Experiment

PULSE.

Creación de un kit de componentes modulares y estructurados enfocado en la accesibilidad web (WCAG).

Diseño & Accesibilidad Agosto 2025
REACTTYPESCRIPTTAILWIND CSS

El Reto del Proyecto

Quería entender a fondo cómo las agencias y equipos de desarrollo profesional construyen sus librerías de componentes internos para mantener la coherencia en sus proyectos. Además, quería investigar cómo hacer que un panel de control interactivo fuera realmente accesible para usuarios que navegan bajo condiciones especiales.

  • Falta de coherencia visual al diseñar componentes de interfaz de forma aislada.
  • Reto de integrar soporte de navegación fluido por teclado sin usar ratón.
  • Investigar y cumplir normativas de contraste de color y lectores de pantalla.

Cómo lo Desarrollé

Construí 'Pulse UI', un conjunto de componentes reutilizables (botones, modales, alertas y menús) usando Tailwind CSS. Documenté todos los estados en Storybook e implementé patrones semánticos rigurosos de accesibilidad, asegurando un contraste perfecto y total usabilidad de teclado.

  • Desarrollo modular de bloques tipados con TypeScript.
  • Integración de pruebas visuales y documentación interactiva de interfaz.
  • Optimización de animaciones de retroalimentación sutil para el usuario.

Resultados

25+

Componentes Creados

100%

Soporte de Teclado

Cumplidas

Normas WCAG AA

Logros & Conclusiones

  • Estructuración de componentes fáciles de reutilizar en múltiples proyectos.
  • Accesibilidad nativa integrada desde el primer día.
  • Flujo de trabajo unificado y limpio para maquetaciones veloces.
Volver al Portafolio
Hablemos de tu idea