10 min

Cómo crear imágenes con Claude y Gemini MCP

Genera imágenes, vídeo y SVG en Claude Desktop con @converly/gemini-mcp y una clave de Google AI Studio: guía práctica con ejemplos y trucos reales.

Mi última versión de @converly/gemini-mcp (Gemini MCP) ya genera imágenes, vídeo, SVG y maquetas HTML en la interfaz de Claude Desktop con la versión más reciente de las MCP apps. Y, por si te lo perdiste, puedes generar imágenes, SVG y vídeo desde Claude. Solo necesitas una clave de API de Google AI Studio. Así es como se hace:


Navegación rápida

Salta directamente a lo que buscas:

Lo que necesitas | Cómo se ve | Tu primera imagen | Editar imágenes | Generación fundamentada | Consejos | Flujos reales


Lo que necesitas

Necesitarás Claude Code o Claude Desktop, además del servidor @converly/gemini-mcp instalado con una clave de API de Gemini. Consigue tu clave en Google AI Studio; el plan gratuito cubre a un usuario sin problema (básicamente gratis).

Añade Gemini MCP a Claude Code con un solo comando:

claude mcp add gemini-mcp -s user -- npx -y @converly/gemini-mcp

Luego define tu clave: export GEMINI_API_KEY=tu-clave-aquí (o añádela a tu perfil de shell).

Añade Gemini MCP a Claude Desktop: añade esto a tu claude_desktop_config.json:

{
  "mcpServers": {
    "gemini": {
      "command": "npx",
      "args": ["@converly/gemini-mcp"],
      "env": {
        "GEMINI_API_KEY": "your-api-key-here"
      }
    }
  }
}

Para tu información: el archivo de configuración de Desktop está en C:\Users\{username}\AppData\Roaming\Claude\claude_desktop_config.json en Windows, o en ~/Library/Application Support/Claude/claude_desktop_config.json en Mac.

Reinicia Claude Desktop tras guardar y las herramientas aparecen automáticamente. npx descarga el paquete en la primera ejecución; no hay un paso de instalación aparte.

¿Nunca has configurado un MCP? Escribí una guía paso a paso para Claude Desktop aquí, y también hay una guía para principiantes de Claude Code si ese es tu entorno.

Cuando termines y hayas reiniciado, trece herramientas aparecen en tu caja de herramientas de Claude: gemini_chat para conversaciones fundamentadas, gemini_deep_research para informes de investigación de varios pasos, generate_image y edit_image para el trabajo con imágenes que cubrimos aquí, generate_video para clips de vídeo de Veo 3.1, generate_svg para diagramas vectoriales, generate_landing_page para páginas HTML autónomas, describe_image y analyze_image para tareas de visión, load_image_from_path para pasar archivos locales a cualquier herramienta de imágenes, gemini_prompt_assistant para guidance de prompts, gemini_list_models y gemini_help.

Este artículo se centra en las dos herramientas de imágenes —generate_image y edit_image—, pero las demás merece la pena explorarlas una vez tengas todo configurado.


Cómo se ve

Antes de entrar en las herramientas, esto es lo que ves en Claude Desktop: las imágenes generadas se renderizan en línea con controles de zoom, la ruta del archivo y el prompt que las creó:

Una imagen generada en Claude Desktop: vista previa completa con zoom, ruta del archivo y el prompt que la creó.

Los diagramas y las imágenes técnicas funcionan igual:

Los diagramas de arquitectura también se renderizan en línea; este muestra el propio flujo de datos del MCP.

La vista previa ocupa todo el ancho dentro de la ventana del chat, no es una miniatura. Puedes evaluar la composición y el contenido en unos cinco segundos sin abrir el archivo. La versión a resolución completa queda en disco en la ruta que hayas indicado.

En Claude Code (la versión de terminal), obtienes la misma vista previa en línea si tu terminal admite imágenes, o un enlace a la ruta del archivo si no. En cualquier caso, el PNG acaba en disco.


Crear tu primera imagen

Literalmente, solo tienes que pedirle a Claude lo que quieres. Claude escribe el prompt de generación entre bastidores, llama a Gemini y la imagen aparece en línea en tu ventana de chat. La semana pasada necesitaba un diagrama de arquitectura para un artículo; esto fue más o menos lo que escribí:

Claude toma eso, escribe un prompt detallado para el modelo de imágenes de Gemini (gemini-3-pro-image-preview, llamado internamente Nano Banana Pro) y el resultado vuelve como vista previa a todo el ancho justo en la conversación.

Mientras tanto, el archivo a resolución completa —unos 2-5 MB, calidad de producción real— ya ha aterrizado en disco donde le dijiste que guardara. (Y si se te olvidó especificar una ruta, cosa que me ha pasado más veces de las que me gustaría reconocer, acaba en el directorio de salida por defecto del MCP.)

Este diagrama lo generó el propio MCP: describí la arquitectura en lenguaje natural, Claude llamó a generate_image y esto volvió en línea en el chat.

Lo que diferencia esto de pegar un prompt en un generador de imágenes independiente es que Claude entiende el contexto. A mitad de un artículo, pides un diagrama y Claude ya conoce la arquitectura que llevas discutiendo los últimos veinte minutos. Claude ya tiene el contexto; te ahorras por completo la reexplicación.

Las relaciones de aspecto van de 1:1 a 16:9; yo uso sobre todo 16:9 para cabeceras de artículos y 1:1 para redes sociales. La resolución llega hasta 4K para cosas con calidad de impresión, aunque siendo honesto, la opción por defecto sobra para cualquier cosa web.

Generado en Claude con Gemini


Editar imágenes con lenguaje natural

La otra herramienta —edit_image— es, francamente, probablemente la que más uso. Pásale la ruta de un archivo de imagen, describe en lenguaje natural qué hay que cambiar y Gemini hace el resto.

Lo uso constantemente para capturas de artículos. Capturo una ventana y luego le digo a Claude:

Gemini edita la imagen in situ —añade la anotación, deja todo lo demás intacto— y guarda el resultado. Para el tipo de anotaciones de «haz clic aquí» que hacen que las guías sean realmente útiles, es más rápido que abrir Figma o Preview.

edit_image añade anotaciones directamente a tus capturas; no hace falta Figma.

También puedes encadenar ediciones. Cada generación devuelve un thoughtSignature: un blob de estado del modelo que permite a Gemini recordar en qué estaba trabajando. Pásalo en la siguiente edición y el modelo retoma donde lo dejó, de modo que puedes refinar de forma iterativa: «haz esa etiqueta más pequeña», «mueve el borde un poco a la izquierda», «cambia el color de la llamada a rojo». Sin la firma, cada edición empieza de cero, lo cual es molesto cuando llevas cinco ajustes en un diagrama.

He comprobado que tres o cuatro ediciones seguidas es el punto óptimo. A partir de ahí, empiezan a colarse pequeños artefactos y conviene regenerar desde cero con un prompt más preciso.


Generación fundamentada con datos de búsqueda reales

Define use_search: true en una llamada de generación y Gemini consulta Google antes de crear la imagen, fundamentando el resultado visual en datos reales y actuales.

También recuperas las URLs de origen, así puedes verificar de dónde salieron los datos.

Eso es muy útil para:

  • Clima actual visualizado como infografía (temperaturas reales, previsión real)
  • Tarjetas comparativas de precios de productos con precios reales extraídos de la web
  • Gráficos resumen de noticias con fechas y datos correctos

Para cualquier cosa en la que «más o menos correcto» sea suficiente, la generación estándar funciona. Si la imagen tiene números que podrían verificarse, activo use_search. Lo aprendí por las malas.

Esta es la salida real: Gemini buscó en Google, extrajo precios de cierre reales del FTSE 100 de la London Stock Exchange y generó este gráfico. Los enlaces a las fuentes vuelven en la respuesta junto con la imagen.

Compromiso que conviene conocer: la generación fundamentada es más lenta —quizá 15-20 segundos frente a 5-8 de una llamada estándar— y el acabado visual baja un poco porque el modelo gasta capacidad de procesamiento en la precisión de los datos en lugar de en la estética. Los 15 segundos de espera son un precio pequeño. Y, francamente, un gráfico algo más burdo pero correcto es infinitamente más útil que uno precioso en el que los números son pura fantasía.


Consejos para mejores resultados

Algunas cosas que he aprendido después de cientos de generaciones:

Deja que Claude escriba el prompt.

No necesitas escribir un prompt de imagen optimizado para Gemini. Solo describe lo que quieres en lenguaje natural —«un diagrama que muestre X conectado con Y»— y Claude lo traduce a un prompt de generación detallado con las palabras clave de estilo, especificaciones de color e instrucciones de composición adecuadas. Claude es constantemente mejor que yo en esto.

Especifica el estilo desde el principio.

Si quieres algo plano y minimalista, dilo. Si quieres fotorrealista, dilo. Si no especificas, el modelo recurre a algo intermedio que rara vez es lo que querías. Mi opción habitual para diagramas de artículos: «estilo técnico plano y limpio, fondo blanco, paleta de azul y gris, sin degradados, sin 3D». Para gráficos de redes sociales pido algo más atrevido: «moderno, vibrante, fondo oscuro».

Generado con Gemini

Usa imágenes de referencia para las ediciones.

La herramienta edit_image puede tomar una imagen existente como punto de partida. Hago una captura de un esquema burdo en una pizarra, la paso y le pido a Gemini que «redibuje esto como un diagrama técnico limpio». La referencia aporta al modelo un contexto espacial que las palabras solas no pueden transmitir.

Sé específico sobre lo que no quieres.

«Sin superposiciones de texto», «sin personas», «sin bordes decorativos»: las restricciones negativas son tan útiles como las descripciones positivas. He comprobado que esto ahorra un ciclo de regeneración aproximadamente la mitad de las veces.

Ajusta la relación de aspecto al destino.

16:9 para cabeceras de artículos e imágenes de blog. 1:1 para avatares y miniaturas de redes sociales. 4:3 para contenido embebido. Acertar desde el principio evita recortes raros más adelante.

Nombra tu ruta de salida.

«Guárdalo en ./images/architecture-diagram.png» en tu prompt. Si no, acabarás buscando en directorios temporales un archivo llamado gemini-1774353179041.png. Pregúntame cómo lo sé.


Para qué puedes usar esto

Después de unos meses de uso diario —construí este MCP para mi flujo de trabajo—, esto es lo que yo (y tú) puedo hacer.

Diagramas para artículos: diagramas de arquitectura, visuales de flujo de datos, gráficos comparativos. Más rápido que Figma para cualquier cosa esquemática porque no tengo que pensar en el diseño; describo las relaciones y Claude se ocupa de la estructura visual. Escribí sobre combinar esto con el flujo de mejora de diseño, usando también Gemini para criticar y pulir visuales burdos.

Capturas anotadas: capturo una ventana y luego uso edit_image para añadir recuadros de llamada, marcadores numerados o regiones resaltadas. Nunca he necesitado otra cosa y por eso.

Visuales para redes sociales: gráficos rápidos para publicaciones en LinkedIn, imágenes de portada para carruseles. Cubrí un flujo completo de creación de carruseles con la generación de SVG de Gemini en un artículo anterior, pero para publicaciones de una sola imagen en redes sociales, generate_image es el camino más rápido.

Maquetas rápidas: exploraciones de «cómo quedaría esto como imagen de marketing» antes de comprometerse con un diseño en condiciones. A veces la respuesta es «suficientemente bien para publicarlo»; a veces es «tira eso y empieza de cero».

Para qué no lo uso: para nada que necesite realismo fotográfico preciso, nada con rostros humanos donde la precisión importe, ni nada con texto denso que deba ser legible al píxel. El modelo es bueno, de verdad que lo es, pero es un modelo generativo y el renderizado de texto sigue siendo su punto más flojo.

¿Ya usas Claude Code o Desktop? Escribí una visión general completa de Gemini MCP que cubre todo lo demás que puede hacer. El MCP hace mucho más que imágenes —chat, fundamentación con búsqueda, generación de vídeo con Veo—, pero las herramientas de imágenes son las que más suelo usar. ¡Disfrútalo!


Artículos relacionados