| name | Blog a Google Slides |
| description | Convierte entradas de blog en presentaciones visuales sorprendentes para Google Slides |
Blog a Google Slides
Esta habilidad transforma entradas de blog en presentaciones profesionales y visualmente impactantes para Google Slides. El resultado incluye un script de Google Apps Script listo para ejecutar que genera automáticamente las diapositivas.
Requisitos Previos
- Cuenta de Google con acceso a Google Slides
- Acceso a Google Apps Script (script.google.com)
- URL o contenido de la entrada de blog
Proceso de Transformación
Paso 1: Analizar el Contenido del Blog
Lee y analiza la entrada de blog identificando:
| Elemento | Uso en la Presentación |
|---|
| Título principal | Diapositiva de portada |
| Subtítulos/H2 | Diapositivas de sección |
| Párrafos clave | Puntos de contenido |
| Listas | Bullets visuales |
| Citas destacadas | Diapositivas de cita |
| Datos/estadísticas | Diapositivas de impacto visual |
| Conclusiones | Diapositiva de cierre |
Paso 2: Estructurar la Presentación
Crea una estructura que siga este flujo:
- Portada - Título impactante + subtítulo
- Agenda/Índice - Temas a cubrir (opcional)
- Introducción - Contexto y gancho
- Secciones de contenido - Una por cada H2 del blog
- Datos destacados - Estadísticas o citas importantes
- Conclusión - Resumen de puntos clave
- Llamada a la acción - Siguiente paso para el lector
- Cierre - Agradecimiento y contacto
Paso 3: Diseñar el Estilo Visual
[!IMPORTANT]
Las presentaciones deben ser visualmente sorprendentes. Aplica estos principios:
Paleta de Colores
Sugiere una paleta coherente basada en el tema del blog:
const PALETAS = {
tecnologia: {
primario: '#1a73e8',
secundario: '#34a853',
acento: '#ea4335',
fondo: '#f8f9fa',
texto: '#202124'
},
negocios: {
primario: '#1e3a5f',
secundario: '#c9a227',
acento: '#e74c3c',
fondo: '#ffffff',
texto: '#2c3e50'
},
creativo: {
primario: '#6c5ce7',
secundario: '#00cec9',
acento: '#fd79a8',
fondo: '#dfe6e9',
texto: '#2d3436'
},
salud: {
primario: '#00b894',
secundario: '#0984e3',
acento: '#fdcb6e',
fondo: '#ffffff',
texto: '#2d3436'
}
};
Tipografía Recomendada
- Títulos: Montserrat Bold, Poppins Bold, o Playfair Display
- Cuerpo: Open Sans, Roboto, o Lato
- Tamaño título: 44-60pt
- Tamaño subtítulo: 28-36pt
- Tamaño cuerpo: 18-24pt
Principios de Diseño
- Regla del 6x6: Máximo 6 puntos por diapositiva, máximo 6 palabras por punto
- Espacio en blanco: Deja respirar el contenido (40% vacío mínimo)
- Una idea por diapositiva: No sobrecargues
- Contraste alto: Asegura legibilidad
- Imágenes de calidad: Usa fotos profesionales o iconos vectoriales
Paso 4: Generar el Script de Google Apps Script
Genera un script completo que el usuario pueda ejecutar en Google Apps Script:
function crearPresentacion() {
const presentacion = SlidesApp.create('Título de la Presentación');
const slides = presentacion.getSlides();
if (slides.length > 0) {
slides[0].remove();
}
const COLORES = {
primario: '#1a73e8',
secundario: '#34a853',
fondo: '#ffffff',
texto: '#202124'
};
agregarPortada(presentacion, COLORES);
agregarCierre(presentacion, COLORES);
Logger.log('Presentación creada: ' + presentacion.getUrl());
return presentacion.getUrl();
}
function agregarPortada(presentacion, colores) {
const slide = presentacion.appendSlide(SlidesApp.PredefinedLayout.BLANK);
slide.getBackground().setSolidFill(colores.primario);
const titulo = slide.insertTextBox('TÍTULO IMPACTANTE');
titulo.setTop(200).setLeft(50).setWidth(620).setHeight(100);
titulo.getText().getTextStyle()
.setFontFamily('Montserrat')
.setFontSize(48)
.setBold(true)
.setForegroundColor('#ffffff');
titulo.getText().getParagraphStyle().setParagraphAlignment(SlidesApp.ParagraphAlignment.CENTER);
const subtitulo = slide.insertTextBox('Subtítulo descriptivo');
subtitulo.setTop(320).setLeft(50).setWidth(620).setHeight(60);
subtitulo.getText().getTextStyle()
.setFontFamily('Open Sans')
.setFontSize(24)
.setForegroundColor('#e8eaed');
subtitulo.getText().getParagraphStyle().setParagraphAlignment(SlidesApp.ParagraphAlignment.CENTER);
}
function agregarDiapositiva(presentacion, titulo, puntos, colores) {
const slide = presentacion.appendSlide(SlidesApp.PredefinedLayout.BLANK);
slide.getBackground().setSolidFill(colores.fondo);
const tituloBox = slide.insertTextBox(titulo);
tituloBox.setTop(40).setLeft(50).setWidth(620).setHeight(60);
tituloBox.getText().getTextStyle()
.setFontFamily('Montserrat')
.setFontSize(36)
.setBold(true)
.setForegroundColor(colores.primario);
let yPos = 130;
puntos.forEach((punto, index) => {
const puntoBox = slide.insertTextBox('• ' + punto);
puntoBox.setTop(yPos).setLeft(70).setWidth(580).setHeight(50);
puntoBox.getText().getTextStyle()
.setFontFamily('Open Sans')
.setFontSize(20)
.setForegroundColor(colores.texto);
yPos += 55;
});
}
function agregarCita(presentacion, cita, autor, colores) {
const slide = presentacion.appendSlide(SlidesApp.PredefinedLayout.BLANK);
slide.getBackground().setSolidFill(colores.secundario);
const citaBox = slide.insertTextBox('"' + cita + '"');
citaBox.setTop(150).setLeft(60).setWidth(600).setHeight(150);
citaBox.getText().getTextStyle()
.setFontFamily('Playfair Display')
.setFontSize(32)
.setItalic(true)
.setForegroundColor('#ffffff');
citaBox.getText().getParagraphStyle().setParagraphAlignment(SlidesApp.ParagraphAlignment.CENTER);
const autorBox = slide.insertTextBox('— ' + autor);
autorBox.setTop(320).setLeft(60).setWidth(600).setHeight(40);
autorBox.getText().getTextStyle()
.setFontFamily('Open Sans')
.setFontSize(18)
.setForegroundColor('#e8eaed');
autorBox.getText().getParagraphStyle().setParagraphAlignment(SlidesApp.ParagraphAlignment.CENTER);
}
function agregarCierre(presentacion, colores) {
const slide = presentacion.appendSlide(SlidesApp.PredefinedLayout.BLANK);
slide.getBackground().setSolidFill(colores.primario);
const gracias = slide.insertTextBox('¡Gracias!');
gracias.setTop(180).setLeft(50).setWidth(620).setHeight(80);
gracias.getText().getTextStyle()
.setFontFamily('Montserrat')
.setFontSize(56)
.setBold(true)
.setForegroundColor('#ffffff');
gracias.getText().getParagraphStyle().setParagraphAlignment(SlidesApp.ParagraphAlignment.CENTER);
const contacto = slide.insertTextBox('contacto@ejemplo.com | @usuario');
contacto.setTop(280).setLeft(50).setWidth(620).setHeight(40);
contacto.getText().getTextStyle()
.setFontFamily('Open Sans')
.setFontSize(20)
.setForegroundColor('#e8eaed');
contacto.getText().getParagraphStyle().setParagraphAlignment(SlidesApp.ParagraphAlignment.CENTER);
}
Paso 5: Entregar el Resultado
Proporciona al usuario:
- Script personalizado con el contenido del blog transformado
- Instrucciones de ejecución (ver sección siguiente)
- Sugerencias de imágenes para cada diapositiva
- Paleta de colores en formato hexadecimal
Instrucciones para el Usuario
Ejecutar el Script
- Abre script.google.com
- Crea un nuevo proyecto
- Pega el script generado
- Haz clic en Ejecutar →
crearPresentacion
- Autoriza los permisos cuando se soliciten
- Revisa el log para obtener el enlace de la presentación
[!TIP]
Puedes modificar los colores en el objeto COLORES para personalizar la paleta.
Consideraciones Especiales
[!WARNING]
Google Slides tiene límites de API. Si el blog es muy largo, divide en múltiples presentaciones.
[!CAUTION]
Las imágenes deben agregarse manualmente o mediante URLs públicas. El script solo crea la estructura.
Mejoras Visuales Adicionales
Para presentaciones aún más impactantes, sugiere al usuario:
Solución de Problemas
| Problema | Solución |
|---|
| Error de permisos | Autoriza la app en la primera ejecución |
| Script no corre | Verifica que seleccionaste la función correcta |
| Colores no aparecen | Asegúrate de usar formato hexadecimal (#RRGGBB) |
| Texto cortado | Reduce el tamaño de fuente o el contenido |