5 min

Crea carruseles de LinkedIn con Gemini y Claude

Crea carruseles para LinkedIn con Gemini y Claude: un SVG por diapositiva, conversión a PDF con Puppeteer y unión con Python, todo desde el terminal en unos diez minutos.

Crear diapositivas tipo carrusel para LinkedIn con Gemini y Claude consiste en generar un SVG por diapositiva con Gemini MCP, convertir cada SVG a PDF con Puppeteer y unirlos en un único PDF con un script de Python de cuatro líneas; el flujo completo corre desde el terminal en unos diez minutos. El problema con LinkedIn es que es una especie de necesidad horrible, un poco como ir a visitar a los suegros. Ese algoritmo tan detestable que prefiere recompensar las actualizaciones triviales sobre el estilo de vida antes que el contenido con sustancia de verdad me crispa los nervios. Pero un mal necesario es: puede que haya un cliente buscando exactamente lo que haces, aunque también es probable que sean tus colegas buscando una idea que robar o un empleado que arrebatar. Está claro, entonces, que la idea de producir cualquier propiedad intelectual original para esa plataforma es una pérdida de tiempo. Pero tener cierta visibilidad y una representación de tu trabajo y de tu empresa es imprescindible.


Si tengo que dedicar tiempo a LinkedIn, voy a aprovecharlo; y para lo que vale, los carruseles son probablemente el formato con mayor impacto visual y más capaz de captar la atención. Así que he montado un flujo de trabajo (porque claro que lo iba a hacer) para quitar el dolor de la producción.


Así es como funciona: Gemini MCP genera archivos SVG a partir de un prompt de texto, un script de Puppeteer convierte cada uno a PDF, y un script de Python de cuatro líneas los fusiona en un único archivo que LinkedIn puede leer. Todo corre desde el terminal y tarda unos diez minutos de principio a fin una vez tienes los scripts configurados.

Flujo de SVG a PDF: Gemini genera SVG, Puppeteer convierte a PDF, pypdf fusiona

Qué necesitarás

  • Una cuenta de Google AI Studio (el nivel gratuito funciona bien)
  • Node.js instalado (para Puppeteer)
  • Python instalado (para fusionar PDFs)
  • Un artículo de blog o un conjunto de puntos clave para convertir en diapositivas

Si tienes Claude Desktop con el servidor Gemini MCP, puedes ejecutar todo este flujo sin salir del terminal. La interfaz web de Google AI Studio también funciona, pero tendrás que copiar y pegar la salida SVG a mano.

¿Por qué SVG y no imágenes?

La mayoría de herramientas de IA para carruseles generan imágenes de mapa de bits. Gemini también puede hacerlo, pero el renderizado del texto es impredecible. Las letras se difuminan, el espaciado y las fuentes se descontrolan, y al final acabarás retocándolo en Canva de todos modos. Lo cual frustra todo el propósito.

SVG sortea todo eso. Estás generando marcado estructurado, no píxeles. El texto se renderiza como texto real, no como un mapa de bits. Los colores caen en valores hexadecimales exactos (¡branding!). Cada diapositiva sale idéntica en estilo porque es código, no una imagen renderizada.

Hay una ventaja menos obvia también: los PDF construidos a partir de SVG mantienen el texto seleccionable, algo que el algoritmo de LinkedIn, conocido por su sed de calidad, puede indexar. Tus lectores pueden robar copiar de él. Y tampoco hay pixelación en móvil, porque los vectores escalan al viewport en el que se muestren.

Así es como se hace:

Paso 1: Planifica tus diapositivas

Los carruseles de LinkedIn funcionan mejor con entre 8 y 12 diapositivas. Intenta plantear un único punto por diapositiva. Apunta a un máximo de 25-50 palabras. Cualquier cosa que supere eso se aplastará en móvil.

Aquí va una estructura decente:

  1. Diapositiva de portada – Una pregunta o afirmación contundente que frene el scroll
  2. Diapositiva del problema – Por qué importa esto, qué está roto
  3. Diapositivas de contenido (4-6) – Un punto clave por diapositiva
  4. Diapositiva de conclusión – Resumen o «lo que he aprendido»
  5. Diapositiva de CTA – Invitación a seguir, enlace al artículo completo

Si estás reutilizando un artículo de blog, saca los fragmentos que se sostengan por sí mismos. La mayor parte de lo que escribiste no sobrevivirá al corte (mi estilo de escritura puede volverse un poco vago según la hora del día). Intenta destilar tu prosa hasta cinco o seis líneas utilizables a partir de un artículo de 1.200 palabras.

Paso 2: Configura tu sistema de diseño

Dedica el tiempo necesario para fijar una paleta de colores y una pila de fuentes (o haz un buen trabajo replicando tus directrices de marca). Luego podrás reutilizar tu sistema de diseño para cada carrusel hasta el inevitable proyecto de reposicionamiento. Este paso merece la pena al principio.

Paleta de ejemplo (todas tonos stone/amber de Tailwind):

Background: #1c1917
Card:       #292524 (with 24px border-radius)
Accent:     #f59e0b (amber)
Title:      #fafaf9 at 84px, weight 700
Body text:  #a8a29e at 42px
Footer:     #a8a29e at 28px, centred

Usa estas dimensiones de diapositiva para LinkedIn: 1080 x 1350 píxeles. Es la relación vertical 4:5 recomendada por LinkedIn, y rellena la mayor parte de la pantalla del móvil, lo cual importa porque, según las estadísticas, ahí es donde se produce más del 70 % de la navegación en LinkedIn. El formato cuadrado de 1080 x 1080 también funciona, pero el vertical capta más espacio en el feed.

Paso 3: Genera diapositivas SVG con Gemini

Un SVG por diapositiva. Da a Gemini tu sistema de diseño y el contenido de la diapositiva, y te devolverá un marcado limpio.

Un prompt típico se ve así:

Generate an SVG slide at 1080x1350 pixels with this design system:
- Background: #1c1917, card: #292524 with rx="24", 40px margin
- Accent colour: #f59e0b
- Title: #fafaf9, 84px, weight 700
- Body text: #a8a29e, 42px

Slide 3 of 8:
Title: "Your Text Stays Selectable"
Body: "Unlike raster images, SVG-generated PDFs keep
text as actual text. LinkedIn can parse it. Readers
can copy from it. And it never pixelates on mobile."
Footer: "converly.es | 3/8"

Diapositiva de contenido renderizada de un carrusel de LinkedIn sobre SVG

Lo que vuelve es un SVG válido. Tu texto se renderiza de forma nítida, los colores deberían coincidir exactamente y, con suerte, cada diapositiva sigue tu sistema de diseño porque Gemini parte del mismo esqueleto de prompt cada vez.

Un tropezo que me costó un poco de tiempo: SVG no tiene ajuste de línea automático. A partir de unos 40 caracteres por línea, tienes que hacer el ajuste tú mismo. Yo uso elementos <tspan>. Es manual pero predecible:

<text x="110" y="640" class="body">
  <tspan x="110" dy="0">Unlike raster images, SVG-generated</tspan>
  <tspan x="110" dy="65">PDFs keep text as actual text.</tspan>
</text>

También puedes usar <foreignObject> para incrustar HTML dentro del SVG y dejar que CSS gestione el ajuste. Lo probé. Puppeteer se atragantó con el renderizado en dos de cada tres pruebas, así que <tspan> será.

Paso 4: Convierte los SVG a PDF

Puedes usar Puppeteer para pasar de SVG a PDF, lo cual, como he mencionado, mantiene el texto como vectores. Archivos más pequeños, texto seleccionable y nitidez en cualquier nivel de zoom.

Guarda esto como convert.js:

const puppeteer = require('puppeteer');
const path = require('path');

async function svgToPdf(svgFile, pdfFile) {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  await page.goto(`file://${path.resolve(svgFile)}`, {
    waitUntil: 'networkidle0'
  });

  await page.pdf({
    path: pdfFile,
    width: '1080px',
    height: '1350px',
    printBackground: true,
    pageRanges: '1'
  });

  await browser.close();
}

// Convert each slide
const slides = ['slide-01', 'slide-02', 'slide-03'];
for (const slide of slides) {
  await svgToPdf(`${slide}.svg`, `${slide}.pdf`);
}

Ejecuta node convert.js y obtendrás un PDF por diapositiva.

Esa opción waitUntil: 'networkidle0' importa si tu SVG carga fuentes web vía @import. Sin ella, Puppeteer renderiza antes de que las fuentes se carguen y obtienes Arial donde esperabas Inter. Me costó dos lotes de diapositivas feas descubrirlo.

Paso 5: Fusiona en un único PDF

LinkedIn quiere un único PDF, no ocho, obviamente. Pero con cuatro líneas de Python, con pypdf estás listo: (pip install pypdf):

from pypdf import PdfWriter

merger = PdfWriter()
for i in range(1, 9):
    merger.append(f"slide-{i:02d}.pdf")
merger.write("carousel.pdf")
merger.close()

El archivo fusionado debe mantenerse por debajo de 25 MB, pero con SVG vectoriales estarás en torno a 200 KB–2 MB para una presentación de 8 diapositivas.

Paso 6: Súbelo a LinkedIn

En el compositor de publicaciones de LinkedIn, busca el icono de documento (una página con un signo más, curiosamente difícil de localizar). Sube el PDF y ponle un título adecuado, no «carousel.pdf». Ese título aparece en la parte superior de cada diapositiva en el feed.

El texto de la publicación pesa tanto como el propio carrusel. Máximo 500 caracteres. Suelo dejar un adelanto de la diapositiva 4 o 5, para que haya un motivo para pasar más allá de la portada.

Referencia rápida: especificaciones

Referencia rápida si estás retocando algo de esto:

EspecificaciónValor
FormatoPDF (publicaciones orgánicas)
Dimensiones1080 x 1350px (vertical 4:5)
Alternativa1080 x 1080px (cuadrado)
Tamaño máximo25MB en total
Número de diapositivas8–12 ideal, 20 máximo
Tamaño mínimo de fuente24pt para móvil

Cosas que hice mal

Fuentes

Mi primer lote especificaba font-family: «Inter», salvo que en realidad no tenía Inter instalado en mi equipo. Chrome recurrió a Arial y el espaciado quedó completamente descontrolado. La solución es instalar la fuente o añadir un @import de Google Fonts al bloque <style> del SVG. Chrome Headless la obtiene y la renderiza correctamente.

Malgastando mi vida con ImageMagick

El renderizador de SVG de ImageMagick en Windows es pésimo. Simplemente falla: el estilo CSS, ignora los degradados y destroza la alineación del texto. Evítalo como la peste y usa simplemente Puppeteer, que emplea el motor de renderizado real de Chrome.

Demasiadas cosas en una sola diapositiva

Atiborré 80 palabras en cada diapositiva de mi primer lote. Se renderizaban bien a 1440p pero eran un muro de masa gris en mi teléfono. Recorté todo a 30-40 palabras y el engagement se duplicó aproximadamente. Resulta que la regla de 25-50 palabras existe porque la mayoría de la gente lee en una pantalla de 6 pulgadas.

Qué creo que haré con esto a continuación

Es automatización total: darle una URL de blog a Claude, extraer los puntos clave, generar los prompts de SVG automáticamente y pasar todo por estos scripts. Tengo una versión rudimentaria funcionando como un prompt de agente multi-paso. Es genial. Y absolutamente aterrador para los del bando de las single page web app.

¡Disfrútalo!

Artículos relacionados

Artículos relacionados