# Tastemaker Tastemaker es una habilidad de flujo de trabajo para agentes de programación que convierte el contexto del producto y referencias visuales en pantallas, recursos, sistemas de color con contraste verificado y decisiones de diseño locales. - Findings24: - Sitio web: - Precios: Freemium - Categorías: Asistente de Código IA, Asistente Diseño IA, Herramientas IA Dev ## ¿Qué es Tastemaker? Tastemaker es una habilidad de flujo de trabajo para agentes de programación que les ayuda a crear interfaces con un sistema visual más coherente. Toma el contexto del producto y material de referencia, y lo convierte en pantallas, recursos, comprobaciones y decisiones de diseño registradas que el agente puede reutilizar en trabajos posteriores. En lugar de pedirle al agente que «tenga mejor gusto», el producto se centra en pasos concretos: delimitar las pantallas, fundamentar la paleta, verificar el contraste, reunir los recursos, crear la interfaz y guardar las decisiones localmente. La página de inicio lo presenta para agentes como Claude Code, Windsurf y Gemini CLI, con resultados que permanecen junto al proyecto en lugar de depender de un servicio alojado. ## ¿Qué puede hacer Tastemaker? ### Delimitación de pantallas a partir del briefing El flujo de trabajo comienza delimitando las pantallas a partir del briefing del producto antes de tomar decisiones sobre color o tipografía, para que el sistema de diseño parta de la estructura y no de suposiciones. ### Paletas generadas con comprobaciones de contraste Puede leer píxeles de referencia de imágenes de origen o generar una paleta nueva para el ambiente del proyecto, y después comprueba todas las combinaciones de colores permitidas mediante cálculos de contraste. ### Recursos visuales creados Tastemaker produce un conjunto coherente de recursos: iconos, imágenes cuando son necesarias, un logotipo construido y favicons, en lugar de marcadores de emoji o sistemas visuales incompletos. ### Pruebas renderizables en lugar de afirmaciones solo textuales La misma pasada puede producir maquetas de UI, flujos, gráficos, estados de antes y después, y movimiento con GSAP, de modo que la pantalla se construye como evidencia y no como texto descriptivo. ### Memoria del proyecto en archivos locales Las preferencias resueltas del proyecto se conservan en archivos locales, y las decisiones de desarrollo se trasladan como un perfil para trabajos posteriores. ### Resultados compatibles con repositorios El sitio muestra un modelo de resultados basado en archivos de texto plano que utiliza Markdown, Python, SVG, CSS y JavaScript, lo que facilita inspeccionar el resultado en el repositorio. ## Casos de uso ### Páginas de aterrizaje de marketing y producto Úsalo cuando quieras que un agente de programación produzca una página de aterrizaje con una paleta coherente, una combinación tipográfica adecuada, iconos reales y movimiento, en lugar de un primer borrador genérico. ### Estados de UI de aplicaciones Úsalo para estructuras de productos o aplicaciones que necesiten estados vacío, de carga y con contenido, creados a partir de un sistema visual coherente. ### Rediseños basados en referencias Úsalo cuando una imagen de referencia, un moodboard o una dirección de marca existente deba convertirse en tokens y recursos reales a partir de los cuales pueda trabajar el agente. ### Comparaciones de prompts antes y después Úsalo para trabajos comparativos en los que quieras examinar cómo se comporta el mismo prompt antes y después de instalar la habilidad. ### Continuidad del sistema de diseño Úsalo cuando un proyecto necesite memoria de estilo local para que las pantallas posteriores mantengan las mismas decisiones visuales en lugar de desviarse entre sesiones. ## Preguntas frecuentes ### ¿Cómo se instala Tastemaker y cómo se empieza a usar? Tastemaker se instala en un flujo de trabajo de un agente de programación con un comando como \`npx skills add codeswithroh/tastemaker\`. La página de inicio también indica que puede activarse cuando pides a tu agente que cree, aplique estilos o mejore una UI, sin una frase especial ni una API alojada. ### ¿Qué agentes de programación son compatibles con Tastemaker? Está diseñado para agentes de programación como Claude Code, Windsurf y Gemini CLI. La página de inicio también menciona un marketplace de plugins de Claude Code y una vía de instalación manual. ### ¿Tastemaker es gratuito o de pago? La fuente muestra un núcleo gratuito y Aesthetic Modes exclusivos para patrocinadores, disponibles por 8 $ al mes. El sitio no dispone de una página de precios independiente. ### ¿Qué deja Tastemaker en el proyecto? El flujo de trabajo produce archivos y recursos concretos del proyecto, como \`.tastemaker/style-lock.md\`, \`decisions.log\`, \`profile.md\`, \`design/assets\` y archivos de implementación para las pantallas reales. ### ¿Para qué tipos de trabajo de UI está pensado Tastemaker? Está orientado a trabajos de UI como páginas de aterrizaje, estructuras de aplicaciones, pantallas de productos y comparaciones en las que el agente necesita elementos visuales basados en referencias, contraste de color verificado, recursos y movimiento. ## Datos rápidos - **Categoría**: Herramienta para desarrolladores - **Uso principal**: Flujo de trabajo de UI y diseño para agentes de programación - **Agentes compatibles**: Claude Code, Windsurf, Gemini CLI - **Instalación**: \`npx skills add codeswithroh/tastemaker\` - **Resultados**: Markdown, Python, SVG, CSS, JavaScript y archivos locales del proyecto - **Modalidad de precios**: Núcleo gratuito con modos exclusivos para patrocinadores por 8 $ al mes