# ux-skill Motor de diseño para herramientas de programación con IA. Un color de marca genera un sistema validado con WCAG. Sin conexión, sin LLM, MIT. https://laithjunaidy.com/es/research/ux-skill Por Laith Aljunaidy. Publicado: 2026-06-04. Actualizado: 2026-11-09. - Estado: v4.0.0 Foundations, disponible, MIT - Abrir el proyecto: https://uxskill.laithjunaidy.com ux-skill es un motor de inteligencia de diseño de código abierto que se integra con Claude Code y otras 16 herramientas de programación con IA para que las interfaces que generan dejen de parecer hechas por IA. La versión 4.0, Foundations, construye un sistema de diseño completo a partir de un solo color de marca y un brief, comprueba cada combinación de color frente a WCAG y solo escribe lo que pasa la validación, con árabe y escritura de derecha a izquierda integrados desde el inicio. Funciona sin conexión, nunca llama a un LLM y es gratuito bajo MIT. Creado y mantenido por Laith Aljunaidy en Amán. --- ## Por qué lo construí Las herramientas de programación con IA pueden crear un producto entero en una tarde, y casi todas acaban pareciéndose entre sí. El mismo degradado morado, las mismas tres tarjetas, el mismo hero estándar, la misma tipografía. Se detecta una página hecha con IA desde el otro lado de la sala. Me dedico al diseño y trabajo a diario con estas herramientas. Quería que diseñaran como lo haría una persona de diseño: partir de la marca y del brief, rechazar los patrones que parecen generados por máquina y comprobar el trabajo antes de publicarlo. Y quería que el árabe y la escritura de derecha a izquierda formaran parte del sistema desde el primer token, no como un arreglo al final, porque ahí es donde fallan la mayoría de las herramientas con las que diseño para otras personas. Por eso ux-skill no pega una plantilla. Compila un lenguaje de diseño para el brief que tiene delante, a partir de especificaciones reales de marca tratadas como datos de entrenamiento, y de un linter que rechaza lo mediocre. ![Una landing page creada con ux-skill, una foto real de una obra bajo un velo oscuro, un titular editorial y un formulario de presupuesto en el hero](https://laithjunaidy.com/research/ux-skill/before-after.jpg) *La misma herramienta de programación con IA, el mismo prompt. Con ux-skill aportando las restricciones, la página deja de parecer genérica.* ## Qué cambia en la versión 4.0 La versión 4.0, Foundations, se publicó el 2 de noviembre de 2026. Un color de marca y un brief como entrada, un sistema de diseño completo como salida. ![El sitio de ux-skill, un color de marca como entrada, un sistema de diseño como salida](https://laithjunaidy.com/research/ux-skill/cover.jpg) - **Nueve fundamentos.** Color, tipografía, espacio, layout, radio, borde, elevación, movimiento e imagen, desde primitivas hasta roles semánticos, escritos como tokens de diseño W3C y CSS. - **Cinco modos en cada rol.** Claro y oscuro, contraste estándar y alto, cómodo y compacto, izquierda a derecha y derecha a izquierda, movimiento completo y reducido. Un atributo en la página cambia cada uno. - **La validación WCAG.** Cada combinación de texto, control y foco se mide en modo claro y oscuro, con contraste estándar y alto. Si un sistema falla, no se escribe, y el mensaje indica qué hay que cambiar. - **El árabe integrado.** Con derecha a izquierda, el texto cambia a una fuente árabe con su propia escala y altura de línea, el espaciado pasa a ser lógico y el movimiento se refleja. - **Lee el sistema que ya tienes.** Importadores para tokens de diseño, CSS, Tailwind, reglas de Markdown y variables de Figma. Indica lo que falta y lo añade junto a tus archivos sin reescribir un solo token. - **Componentes y secciones con contratos.** 23 contratos de componentes y 14 contratos de secciones indican a qué tokens se vincula cada parte en cada estado y cómo funciona cada sección en un móvil. - **Un linter que ejecuta la página.** Abre la página en un navegador real, en escritorio y en móvil, y comprueba lo que percibiría una persona: contornos de foco que no aparecen, hover que responde tarde, movimiento que ignora el movimiento reducido. ## Cómo funciona Un núcleo de razonamiento en Python con un sintetizador determinista de siete ejes: calidez, contraste, densidad, geometría, formalidad, movimiento y personalidad tipográfica. Le alimentan doce manifiestos estructurados, entre ellos estilos, paletas, combinaciones tipográficas, componentes, sectores, gráficos, preajustes de movimiento, leyes UX, reglas antipatrón, stacks tecnológicos y 160 especificaciones reales de marca. Mismas entradas, mismo resultado, siempre. Se integra en Claude Code, Cursor, Windsurf, GitHub Copilot, Gemini CLI, Codex y otras once herramientas, como comandos slash, subagentes y un servidor MCP. Funciona completamente sin conexión, nunca llama a un LLM y no recoge nada. ![ux-skill en GitHub](https://laithjunaidy.com/research/ux-skill/github.jpg) ## En cifras
Versión4.0.0, Foundations, 2 de noviembre de 2026
Herramientas de programación con IA compatibles17
Fundamentos de diseño9
Reglas de análisis de antipatrones171
Especificaciones reales de marca160
Herramientas MCP25
Comandos de barra18
Contratos de componentes y secciones23 y 14
Idiomas del README17
Estrellas en GitHub, 9 de noviembre de 202695
LicenciaMIT, gratuita
## Estado En directo y con mantenimiento. Se instala con `pip install uxskill`, el código está en [GitHub](https://github.com/Laith0003/ux-skill) y se puede ver en [uxskill.laithjunaidy.com](https://uxskill.laithjunaidy.com). Este sitio web se construyó con él. ## Preguntas frecuentes ### ¿Qué es ux-skill? ux-skill es un motor de inteligencia de diseño gratuito y de código abierto para herramientas de programación con IA como Claude Code, Cursor y Windsurf. Construye sistemas de diseño a partir de un color de marca y un brief, y analiza páginas creadas con IA para detectar los patrones que las hacen parecer genéricas. ### ¿Qué hay de nuevo en ux-skill 4.0? La versión 4.0, Foundations, construye un sistema de diseño completo a partir de un solo color de marca: nueve fundamentos, cinco modos en cada rol, una validación de contraste WCAG, árabe y escritura de derecha a izquierda integrados, importadores para sistemas existentes y contratos de componentes y secciones. ### ¿ux-skill llama a un modelo de IA? No. Funciona completamente sin conexión con un motor determinista y datos estructurados, nunca llama a un LLM y no recoge telemetría. Las mismas entradas siempre dan la misma salida.