Existing projects often lack a clear record of their interface decisions. This skill extracts design tokens and current UX structure into practical documentation for future UI work.

Design reviews can vary between reviewers and slow down delivery. This skill applies repeatable checks to HTML and CSS so teams can catch token, layout, and accessibility issues before release.

La tipografía genérica puede hacer que un producto parezca inacabado. Esta skill ayuda a Claude, Codex y Claude Code a elegir mejores fuentes, combinaciones, pesos y contraste de tamaños.

Los equipos pierden consistencia cuando los componentes usan valores de color CSS sin procesar. Esta skill guía a Claude, Codex y Claude Code para usar colores del tema de MUI.

La salida de Figma MCP puede contener variables de diseño y estilos inline que son difíciles de mantener. Esta habilidad asigna esos valores a clases estándar de Tailwind CSS y tokens del proyecto.

Los sitios web responsivos pueden ocultar defectos de diseño después de cambios en animaciones. Esta habilidad captura capturas de pantalla desplazadas de página completa en distintos tamaños de dispositivo para una revisión visual enfocada.

Las animaciones web modernas pueden perjudicar el rendimiento y la accesibilidad cuando se implementan sin pautas claras. Esta habilidad proporciona a Claude patrones prácticos de GSAP, pasos de prueba y comprobaciones de lanzamiento para trabajos de animación pulidos.

Los equipos a menudo carecen de un registro claro de los colores de marca, la tipografía, las imágenes y las reglas responsive. Esta skill convierte recursos del sitio e información de marca en contenido de guía estructurado para flujos de trabajo de Claude, Codex y Claude Code.

Producir video con distintos modelos de IA, avatares y herramientas de código puede ser difícil de planificar. Esta habilidad guía la elección de herramientas, prompts, flujos de trabajo y pasos de producción.

Los equipos web a menudo tienen dificultades para organizar páginas, navegación y URLs. Esta skill crea jerarquías claras, sitemaps visuales, mapas de URLs y planes de enlazado.

Los flujos de registro suelen perder usuarios por campos adicionales, errores poco claros y señales de confianza débiles. Esta habilidad audita experiencias de registro y sugiere cambios de CRO enfocados.

Las páginas de marketing suelen perder visitantes por mensajes poco claros, CTAs débiles o señales de confianza ausentes. Esta skill revisa la estructura de la página y ofrece recomendaciones de CRO priorizadas.

Los equipos de marketing necesitan imágenes que se adapten a canales, marcas y objetivos de rendimiento. Esta habilidad guía prompts, elecciones de herramientas, dimensiones, mockups y optimización.

Las experiencias visuales pueden volverse inconsistentes, lentas o inaccesibles entre páginas. Esta habilidad guía las actualizaciones de animaciones, galerías, demos y Three.js con restricciones de seguridad claras.

Los equipos de marketing necesitan planes de video claros antes de usar herramientas de generación. Esta habilidad convierte ideas de campaña en guiones, listas de tomas, notas de plataforma y orientación de edición.

Los equipos necesitan componentes de interfaz de usuario coherentes que sigan las reglas locales de diseño. Esta skill guía la creación con shadcn/ui usando tokens, estados, diseños responsivos y accesibilidad.

Las herramientas para agentes fallan cuando las descripciones, los esquemas y los errores no son claros. Esta habilidad proporciona patrones prácticos para interfaces de herramientas más claras y conjuntos de herramientas más pequeños.

Los equipos necesitan componentes de UI y flujos de feedback consistentes sin reconstruir patrones comunes. Esta skill guía a Claude, Codex y Claude Code para generar UI accesible orientada a React.

Los equipos de juego necesitan contenido de exploración coherente que se ajuste a las reglas de SHINOBI WAY. Esta skill guía el diseño de regiones, ubicaciones, salas, misiones de inteligencia y rutas para Claude, Codex o Claude Code.

Los proyectos visuales pierden coherencia cuando los colores, las formas, la iluminación y la textura no están documentados. Esta skill convierte las decisiones de dirección artística en una guía de estilo estructurada.