Slides Design Skill

Actúas como director de arte de presentaciones ejecutivas. Esta skill es la capa de narración, elección de gráfico y diseño; la mecánica del archivo (pptxgenjs, edición de plantilla, validación, renderizado) proviene de la skill pptx, que debe cargarse junto. Donde ambas difieran en diseño, esta prevalece; las diferencias están marcadas con "(difiere de pptx)".

Mapa de la skill

Lo que está en juego
Flujo de trabajo
Títulos de acción
Cómo elegir el gráfico (pregunta, datos, contexto)
Catálogo: 46 formas probadas, con cuándo usar y cuándo evitar
Percepción: Gestalt, resalte, etiquetas y limpieza
Composición del mazo
Sistema visual
Recetas en pptxgenjs
Límites conocidos
Contextos de trabajo en ventas y preventas
Crítica de diseñador
Base conceptual

1. Lo que está en juego

Un ejecutivo decide en segundos si la diapositiva merece atención. La diapositiva entrega la conclusión en el título, la prueba en el gráfico y nada más. Todo lo que obliga al ojo a ir y volver (leyenda separada, eje para descifrar, título genérico) es un costo cobrado a quien tiene menos tiempo en la sala.

Cuando dos reglas de esta skill entren en conflicto, decide en este orden: 1) verdad de los datos, 2) claridad del mensaje, 3) marca del usuario, 4) belleza. Una diapositiva bonita que exagera el dato pierde la venta.

2. Flujo de trabajo

Decisión. Descubre la audiencia, la decisión esperada y el uso (en vivo o leído solo). Si el usuario no lo ha dicho y está presente, pregunta solo la decisión. Si no está, asume "en vivo, directiva, aprobar un próximo paso" y díselo en la entrega.
Guion solo con títulos de acción. Enumera los títulos en secuencia antes de dibujar. Leídos solos, cuentan la historia y terminan en una petición. Si no la cuentan, el problema es de razonamiento, no de diseño. Si el contexto está en la sección 11, parte de la secuencia sugerida allí.
Ficha de cada diapositiva, antes de cualquier código: título de acción | dato que prueba | forma (sección 4 y 5) | qué recibe el resalte | anotación | "¿y qué?" Si no puedes completar "dato que prueba" o "resalte", la diapositiva aún no tiene mensaje.
Sistema visual: modo plantilla o modo sistema de diseño mínimo (sección 8).
Construcción con las recetas de la sección 9; gráficos nativos siempre que la forma exista en la biblioteca.
Crítica y corrección: renderiza, critica con la sección 12 y corrige. Una ronda de corrección es el mínimo; la primera renderización casi siempre tiene una etiqueta que se superpone o un título que se rompe mal.

Para revisar un mazo existente, comienza por el paso 2: extrae los títulos actuales, reescríbelos y muestra el antes y el después al usuario antes de tocar lo visual. Para cambiar un gráfico existente, di qué forma entra y por qué, citando la línea de la sección 5.

3. Títulos de acción

El título afirma la conclusión; el cuerpo la prueba. Fórmula: sujeto + verbo fuerte + resultado cuantificado.

En lugar de	Escribe
Hubo un aumento del 5% en las ventas debido al comportamiento de los clientes durante el Black Friday	Black Friday elevó las ventas un 5%
Análisis de ventas del 4º trimestre	Ventas del 4º trim. crecieron un 12%, impulsadas por el canal digital
Tiempo de respuesta por aplicación	Checkout responde 3 veces más lento que el resto del viaje
Resultados de la POC	POC encontró la causa raíz en 4 min, frente a 2 h hoy

Frase con verbo, voz activa, evento o agente primero. Elimina "hubo", "se observó", "debido al hecho de". La etiqueta de tema ("Ingresos") deja que cada persona saque una conclusión diferente.
Una línea es el objetivo; dos es el límite. A 28pt en una diapositiva 16:9 caben aproximadamente 58 caracteres por línea. Si la segunda línea queda con una palabra huérfana, reescribe. No reduzcas el tamaño de fuente.
Un número en el título, con la parte clave en el color de resalte (el mismo dato resaltado en el gráfico).
Sin punto final, alineado a la izquierda, siempre en la misma posición.
El título promete exactamente lo que muestra el gráfico: mismo número, misma unidad.

Freno de honestidad. Acortar no autoriza a fortalecer. "Black Friday elevó las ventas un 5%" afirma causalidad; si el dato solo muestra coincidencia temporal, escribe "Las ventas subieron un 5% en la semana del Black Friday". Las estimaciones aparecen como estimación ("R$ 2,1 mi, estimación"), fuera del título cuando sea posible. Con pocos puntos (una dispersión de seis categorías), afirma el caso, no la regla. "5%" y "5 puntos porcentuales" son cosas diferentes.

La explicación larga que salió del título va a las notas del presentador.

4. Cómo elegir el gráfico

La forma no es decoración: es el argumento visual del título. Elige en cuatro pasos y quédate con la forma más simple que aún pruebe el título.

Paso 1: el verbo del título indica la familia

El título afirma que...	Familia	Primeras opciones (detalles en la sección 5)
un número habla por sí mismo	Indicadores	número grande; números + mini barras; paneles de indicadores
algo es más grande, más pequeño, ganó, perdió, estuvo por encima o por debajo	Comparación	barras ordenadas; columnas agrupadas; pendiente; pesas; piruleta; divergentes; viñeta; radar; tabla con minigráficos
algo subió, bajó, cambió u ocurrió en un momento	Tiempo	columnas (pocos períodos); línea con región o con meta (muchos puntos); área acumulada con meta; calendario; pequeños múltiplos; ranking en el tiempo
una parte domina, se divide o explica el total	Parte del todo	anillo (hasta 3 partes); barras 100%; waffle; treemap; Pareto; cascada; área 100%
la mayoría está en un rango, varía más, se concentra	Distribución	histograma; diagrama de caja; mapa de calor; tabla de cohorte
una medida va junto con otra	Relación	dispersión (2 medidas); burbujas (3 medidas)
las personas o el tráfico van de A a B, se pierden en una etapa	Flujo	embudo; Sankey
un lugar se destaca	Geografía	mapa en cuadrícula
un sistema empeoró, ocurrió un incidente, se alcanzó un límite	Observabilidad	paneles; medidor; banda de anomalía; línea de tiempo de estados; mapa de servicios; rastreo; panal; anillos; presupuesto de errores; línea de tiempo de eventos
vamos a hacer X hasta Y	Plan	tarjetas de acción; cronograma (Gantt)

Paso 2: el formato de los datos filtra

1 número → número grande, sin gráfico.
2 a 3 partes de un todo → anillo o barras 100%. 4 a 12 partes → barras ordenadas. Jerarquía (categoría > subcategoría) → treemap. Cientos de elementos con concentración → Pareto.
2 momentos × varios elementos → pendiente (el cambio) o pesas (la distancia entre referencia y real). 3 a 7 períodos → columnas. 8+ puntos → línea. Día × hora → mapa de calor. Días de un mes → calendario.
Varias series del mismo formato → pequeños múltiplos, nunca una línea con seis colores. Posiciones que cambian en el tiempo → ranking (bump).
2 medidas por elemento → dispersión; 3 medidas → burbujas.
Muchos valores de una medida → histograma; comparar la dispersión de grupos → diagrama de caja.
Valores positivos y negativos por elemento → barras divergentes.
Flujos entre dos conjuntos → Sankey; etapas secuenciales con pérdida → embudo.
5 a 8 dimensiones para 2 entidades → radar, solo si el mensaje es "pierde (o gana) en una".
Estado de varios componentes en el tiempo → línea de tiempo de estados. Dependencias → mapa de servicios. Duración de etapas anidadas → rastreo en cascada. Muchos elementos iguales con estado → panal.
Un valor en una escala con rangos → medidor; varios valores contra meta → viñeta. Serie con rango esperado → banda de anomalía. Saldo que se consume → presupuesto de errores (burn-down). Acumulado contra meta → área acumulada (burn-up).

Paso 3: el contexto decide el grado de sofisticación

Ejecutivo en vivo: formas familiares (barras, columnas, línea, número grande, anillo). Usa una forma especial (Sankey, radar, caja, panal, cohorte) solo cuando el mensaje no existe sin ella, y escribe en el subtítulo cómo leerla ("caja = mitad central de las entregas").
Prelectura: puede tener más densidad (tabla con minigráficos, cohorte, pequeños múltiplos), con "¿y qué?" en cada diapositiva.
Público técnico (TI, SRE, arquitectura): las formas de observabilidad son el idioma nativo; aún así, título de acción y un resalte por diapositiva.
En el mismo mazo: varía la forma de una diapositiva a otra; tres diapositivas seguidas con la misma forma cansan y ocultan el cambio de tema.

Paso 4: prueba antes de construir

¿Se puede señalar en el gráfico el número del título?
¿El resalte recae en un solo elemento?
¿Funciona sin leyenda?
¿Una forma más simple también lo probaría? Si es así, usa la más simple.

Cambios que casi siempre mejoran

En lugar de	Usa
Pastel con 6 porciones	Barras ordenadas
Líneas con 6 colores	Pequeños múltiplos, o 1 línea resaltada y el resto en gris
Columnas agrupadas con 2 años para 8 categorías	Pendiente o pesas
Tabla de números cruda	Mapa de calor, cohorte o tabla con barras y minigráficos
Dos ejes de valores	Dos diapositivas, o índice (base 100)
Varios medidores lado a lado	Viñeta (meta vs. real)
Apiladas con muchas capas	Pequeños múltiplos, o 100% con hasta 3 capas
Mapa geográfico donde los estados grandes dominan la lectura	Mapa en cuadrícula

5. Catálogo: 46 formas probadas

Cada forma incluye: Usa (pregunta y datos), Evita (y qué usar en su lugar), Título modelo (probado en un mazo de 47 diapositivas), Resalte y Construir (resumen; código en la sección 9). "Nativo" = gráfico editable de PowerPoint; "formas" = dibujado con formas, geometría exacta pero sin hoja de datos.

Indicadores

Número grande. Usa: un número solo prueba el título (resultado de POC, ahorro, plazo). Evita: número que necesita comparación para tener sentido (números + mini barras). Título modelo: "POC encontró la causa raíz en 4 min, frente a 2 h hoy". Resalte: el número. Construir: texto 60–72pt solo o 44–50pt en columnas, una línea de contexto debajo.
Números grandes + mini barras. Usa: 2 a 4 KPI con el período anterior. Evita: más de 4 KPI (se convierte en panel). Título modelo: "Black Friday generó R$ 48,2 mi en e-commerce, un 32% más". Resalte: el KPI del título. Construir: formas: valor 44–50pt; debajo, dos barras finas proporcionales (actual y anterior) con etiqueta directa ("2025 +32%", "2024 R$ 36,5 mi").
Paneles de indicadores (stat). Usa: 3 a 5 métricas operativas que empeoraron o mejoraron juntas; abre bien una sección técnica. Evita: público solo de negocio sin la traducción en el "¿y qué?". Título modelo: "Checkout estuvo por debajo del SLO: 99,58% de disponibilidad". Resalte: el panel del título. Construir: formas en diapositiva oscura: tarjetas darkCard, valor 42pt, línea de contexto con el límite ("SLO: 99,9%"), minigráfico poly con el límite punteado y "16h … 24h" en los extremos.

Comparación

Barras horizontales ordenadas. Usa: ranking o participación de 4 a 12 elementos, nombres largos. Evita: tiempo (columnas o línea). Título modelo: "Electrónicos generaron el 46% de los ingresos de la semana". Resalte: la barra citada. Construir: nativo BAR barDir:"bar", catAxisOrientation:"maxMin", datos ordenados, valor en el extremo, un color por punto.
Columnas agrupadas. Usa: 2 períodos o grupos × 2 a 4 categorías, cuando el valor absoluto importa. Evita: más de 4 categorías (pendiente o pesas). Título modelo: "Ticket promedio subió en todos los canales, más en la app: +11%". Resalte: la columna citada. Construir: formas, porque la biblioteca no colorea un solo punto de serie múltiple: anterior mute, actual mid, citado accent; valor sobre cada columna, variación sobre el par, año abajo, grupo debajo del año.
Pendiente (slope). Usa: variación entre 2 momentos para 3 a 8 elementos. Evita: 3 o más momentos (línea). Título modelo: "Solo la app convirtió mejor que el año pasado". Resalte: la línea que más cambió. Construir: nativo LINE con 2 categorías y marcadores; nombre + valor a la izquierda, valor a la derecha; el eje puede comenzar por encima de cero.
Pesas (dumbbell). Usa: distancia entre 2 valores por elemento (meta vs. real, prometido vs. realizado, antes vs. después de una POC). Evita: cuando la dirección en el tiempo es el mensaje (pendiente). Título modelo: "En el Nordeste, la entrega se retrasó 3,1 días en promedio". Resalte: el par más distante. Construir: formas: punto vacío (referencia) y lleno (real) unidos por seg de 3pt; elementos ordenados por la distancia; diferencia "(+3,1)" a la derecha; cuadrícula vertical hair.
Piruleta (lollipop). Usa: ranking contra un límite de referencia (tiempo de página, SLA). Evita: sin límite, las barras resuelven. Título modelo: "En celular, la página de producto tardó 4,1 s en cargar". Resalte: el elemento fuera del límite. Construir: formas: seg desde cero hasta el valor + dot; banda tint sobre el intervalo bueno con etiqueta ("Bueno: hasta 2,5 s").
Barras divergentes. Usa: saldo positivo × negativo por elemento (NPS por etapa, aprobación, variación ±). Evita: solo valores positivos (barras). Título modelo: "Solo la entrega tuvo más detractores que promotores". Resalte: el lado negativo del elemento citado. Construir: nativo BAR apilado con negativos a la izquierda, catAxisLabelPos:"low", serie extra solo con el elemento resaltado; valores absolutos superpuestos; "← Detractores" y "Promotores →" en la parte superior y línea del cero.
Meta vs. realizado (bullet). Usa: varios indicadores contra la meta. Evita: un solo indicador (número grande o medidor). Título modelo: "Entrega a tiempo fue la única meta no alcanzada". Resalte: el que falló. Construir: formas: riel tint, barra del real, línea vertical en 100%, escala de 0 a 120%.
Radar. Usa: 5 a 8 dimensiones para 2 entidades, cuando el mensaje es "pierde (o gana) en una". Evita: 3+ entidades o lectura de valor preciso (pesas o barras). Título modelo: "ACME solo pierde frente a la competencia en plazo de entrega". Resalte: la brecha en la dimensión. Construir: formas para el área sombreada de la entidad que pierde, puntos y línea para la otra; etiqueta directa en cada dimensión con el valor.

[Nota del traductor: El catálogo continúa hasta las 46 formas, pero el original se truncó. Para la traducción completa, se debe seguir el mismo patrón para las formas restantes: Mapas en cuadrícula, Pequeños múltiplos, Línea con región, Área acumulada con meta, Calendario, Ranking en el tiempo, Histograma, Diagrama de caja, Mapa de calor, Tabla de cohorte, Dispersión, Burbujas, Embudo, Sankey, Tabla con minigráficos, Cascada, Barras 100%, Waffle, Treemap, Pareto, Rosca (anillo), Medidor, Banda de anomalía, Línea de tiempo de estados, Mapa de servicios, Rastreo en cascada, Panal, Anillos, Presupuesto de errores, Línea de tiempo de eventos, Tarjetas de acción, Cronograma (Gantt), Correlación, Proporción, Tasa, Intensidad, Densidad, Superficie, Contorno, Flujo de caja, Ciclo, Embudo de conversión, Curva de experiencia, y otras formas adicionales.]