Open Design es un proyecto open source de diseño con IA creado por nexu-io. Se posiciona como una alternativa local-first y abierta a Claude Design y Figma.
El problema que intenta resolver es claro: Claude Design demostró que los modelos grandes pueden generar artefactos de diseño directamente, pero si esta capacidad solo existe dentro de un producto cerrado, en la nube y atado a un único modelo, los usuarios no pueden autohospedar, conectar sus propios agentes, cambiar modelos, crear sistemas de diseño privados ni integrar los resultados en un flujo local.
Open Design no intenta construir un nuevo modelo base. En su lugar, conecta los coding-agent CLI que ya tienes en tu equipo a un espacio de trabajo de diseño. Claude Code, Codex, Cursor Agent, Gemini CLI, OpenCode, Qwen, Copilot CLI, Kimi, DeepSeek TUI y herramientas similares pueden convertirse en su motor de diseño.
Qué es Open Design
Open Design puede entenderse como la combinación de tres partes:
- Una Web UI para conversar, previsualizar, gestionar proyectos y exportar.
- Un daemon local que coordina agentes, gestiona archivos, guarda proyectos y ofrece APIs.
- Un conjunto de Skills, Design Systems y plantillas que guían al agente para generar artefactos de diseño, no páginas genéricas de IA.
Después de que el usuario introduce una petición, Open Design no se limita a enviar una frase al modelo. Primero pide completar el brief de diseño, elegir escenario y dirección, y luego inyecta metadatos del proyecto, el sistema de diseño activo, archivos de Skill, plantillas y checklists en el contexto del agente. El agente lee y escribe archivos en una carpeta real de proyecto y genera un artifact que se previsualiza en un iframe con sandbox.
Eso lo acerca más a un flujo de diseño con IA que a un generador de páginas de un solo disparo.
Por qué no es un generador web de IA común
Muchas herramientas de IA pueden generar una página HTML. El foco de Open Design no es “hacer que el modelo escriba una página”, sino “hacer que el modelo siga un proceso de diseño para entregar artefactos que puedan previsualizarse, exportarse e iterarse”.
Destaca varias decisiones:
- Preguntar antes de generar. Un nuevo design brief empieza con un question form interactivo para fijar audiencia, tono, contexto de marca, restricciones y dirección visual.
- Skills son archivos, no plugins de caja negra. Cada Skill contiene
SKILL.md,assets/yreferences/, por lo que puede leerse, reemplazarse y ampliarse. - Design Systems son Markdown, no JSON de tema fijo. Color, tipografía, espaciado, componentes, movimiento, voz de marca y antipatrones pueden escribirse en
DESIGN.md. - El agente trabaja en un directorio real de proyecto. Puede leer plantillas, escribir archivos, generar imágenes y producir
.pptx,.pdf,.zipy otros archivos. - Los artifacts se previsualizan en un iframe con sandbox, reduciendo el riesgo de ejecutar directamente código no controlado.
El objetivo es que la IA se parezca más a un colaborador de diseño con reglas, materiales y checklists.
Qué agentes soporta
Uno de los puntos fuertes de Open Design es que trata a los agentes como runtime, en lugar de fijarse a un solo proveedor de modelos.
El README lista soporte para Claude Code, Codex CLI, Devin for Terminal, Cursor Agent, Gemini CLI, OpenCode, Qwen Code, Qoder CLI, GitHub Copilot CLI, Hermes, Kimi, Pi, Kiro, Kilo, Mistral Vibe, DeepSeek TUI y otros. Detecta estos CLI desde PATH y permite cambiar entre ellos.
Si no hay un CLI local adecuado, también puede usar un proxy BYOK compatible con OpenAI. El usuario proporciona baseUrl, apiKey y modelo, y el daemon normaliza la salida en streaming al mismo flujo de chat.
Este diseño aporta varios beneficios:
- No bloquea al usuario en un único modelo.
- Reutiliza agentes ya instalados y configurados por el usuario.
- El daemon gestiona lecturas y escrituras locales de archivos, con límites de permisos más claros.
- Para empresas y usuarios avanzados, facilita conectar modelos propios y proveedores de API.
Skills y Design Systems son sus activos centrales
Open Design incluye muchas Skills y Design Systems. El README menciona Skills para prototipos web, SaaS landing pages, dashboards, mobile apps, gamified apps, carruseles sociales, posters tipo revista, decks, actualizaciones semanales, informes financieros, HR onboarding, facturas, kanban, OKRs y más.
Design Systems proporciona restricciones visuales de marca al agente. La descripción del repositorio menciona fuentes como Linear, Stripe, Vercel, Airbnb, Tesla, Notion, Apple, Anthropic, Cursor, Supabase, Figma, Xiaohongshu y otras.
La relación es sencilla:
- Skill decide qué tipo de artifact se debe entregar.
- Design System decide qué estilo de marca debe seguir.
Sin estas dos capas, la IA tiende a generar páginas genéricas que se ven familiares pero carecen de criterio. Con Skills y Design Systems, el modelo tiene límites de tarea, referencias visuales y reglas de revisión más claras.
Qué puede generar
Open Design no se limita a prototipos web.
Según el README, cubre web, desktop, mobile prototypes, slides, images, videos, HyperFrames y más. También soporta exportación a HTML, PDF, PPTX, ZIP y Markdown. La generación multimedia entra en el mismo ciclo de diseño: posters, avatares, infografías, mapas ilustrados, videos cortos y motion graphics HTML a MP4.
Esto amplía los usos posibles:
- Equipos startup pueden crear pitch decks rápidamente.
- Equipos de producto pueden generar landing pages o prototipos funcionales.
- Equipos de operaciones pueden crear páginas de campaña, imágenes sociales y reportes semanales.
- Diseñadores pueden usarlo para moodboards, direcciones visuales y primeros layouts.
- Desarrolladores pueden convertir requisitos en artifacts frontend ejecutables.
Su valor no es solo generar una página, sino poner múltiples formatos de contenido dentro del mismo workflow de agentes.
Qué significa local-first
Open Design enfatiza local-first. No entrega todo a un backend SaaS remoto, sino que ejecuta un daemon local y un workspace de proyecto local.
La arquitectura descrita en el README se resume así:
- Frontend con Next.js, React y TypeScript.
- Daemon local con Node, Express, SQLite y SSE.
- Proyectos, sesiones, mensajes, tabs y plantillas guardados en SQLite local y
.od/projects/<id>/. - Agentes iniciados con
child_process.spawn, leyendo y escribiendo en carpetas de artifact del proyecto. - Vista previa mediante iframe con sandbox.
- Exportación a HTML, PDF, PPTX, ZIP y Markdown.
Esta estructura encaja con usuarios que quieren mantener los resultados en su máquina, conectar agentes locales, controlar API keys y mantener workspaces privados.
Pero local-first no significa totalmente offline. La generación real depende del agente y modelo utilizados. Si usas una API de modelo en la nube, el contenido irá a ese proveedor. Una descripción más precisa es que Open Design trae workspace, scheduling, archivos y preview al control local, y deja la capa de modelo a elección del usuario.
Relación con Claude Design y Figma
Open Design se describe en el README como una alternativa open source a Claude Design y Figma, pero no es un clon tradicional de Figma.
Figma es una herramienta profesional para edición manual, colaboración y entrega de diseño. Open Design es más agent-native: el usuario guía agentes mediante lenguaje natural, formularios, Skills y sistemas de diseño para producir artifacts ejecutables.
Combina varias ideas:
- La experiencia artifact-first de Claude Design.
- La conciencia de sistemas de diseño de Figma.
- La capacidad de lectura, escritura y ejecución de agentes como Claude Code y Codex.
- Gestión local de proyectos y preview en sandbox mediante daemon.
Por eso quizá no reemplace todo el flujo profesional de diseño, pero sí funciona como ruta rápida desde una idea hasta un prototipo previsualizable.
Para quién es
Open Design encaja mejor con:
- Desarrolladores que ya usan Claude Code, Codex, Cursor, Gemini CLI y agentes similares.
- Usuarios que quieren gestionar outputs de diseño con IA dentro de carpetas locales de proyecto.
- Equipos startup que necesitan prototipos web, decks, posters y materiales de marketing rápidamente.
- Usuarios avanzados que quieren personalizar Skills, Design Systems y prompt stacks.
- Equipos que no quieren quedar atados a un solo modelo o producto cloud.
Encaja peor con:
- Usuarios ligeros que solo quieren abrir una web, escribir una frase y descargar una imagen.
- Personas que no quieren tocar Node, pnpm, daemons, CLIs ni configuración local.
- Flujos Figma profesionales que necesitan colaboración madura, revisión de diseño y edición vectorial.
En resumen, Open Design parece más una herramienta para usuarios de agentes y equipos de diseño técnicos que un SaaS ligero de diseño para todo el mundo.
Aspectos a tener en cuenta
El README marca el proyecto como 0.8.0-preview y señala que aún evoluciona rápidamente. Esa actividad es buena, pero también significa que APIs, directorios de datos, migración de la app desktop, estructura de Skills y flujos de exportación pueden cambiar.
Antes de usarlo en serio:
- No lo trates como una plataforma empresarial de diseño plenamente estable.
- Prueba el flujo con proyectos de test antes de importar materiales importantes.
- Haz backup de
.od/antes de migrar datos y asegúrate de detener el daemon y la app desktop. - Al usar BYOK, cuida API keys, URLs de proxy y riesgos de acceso a redes privadas locales.
- Revisa manualmente los diseños generados, especialmente marca, copyright, copy y consistencia visual.
La ventaja del open source es que puede inspeccionarse, modificarse y recibir contribuciones. El costo es aceptar cierta fricción de ingeniería.
Resumen
Lo interesante de Open Design no es solo ser una alternativa open source a Claude Design. Lo importante es cómo organiza Agent CLIs, Skills, Design Systems, daemon local y preview en sandbox dentro de un mismo workflow de diseño.
Mueve la generación de diseño desde un prompt único hacia un proceso más estructurado: preguntar, elegir dirección, cargar un sistema de diseño, leer la Skill, escribir archivos reales, previsualizar el artifact y exportar el resultado.
Si ya usas Claude Code, Codex o Cursor para trabajar con código, Open Design merece atención. Representa una nueva forma de producto: la IA no solo dibuja una imagen, sino que trabaja dentro de un espacio de proyecto local, siguiendo sistemas de diseño y habilidades de tarea, para generar artefactos de diseño que pueden seguir iterándose.