Fondos

Fondos para stream, paneles y pantallas offline

Un canal parece profesional cuando su pantalla offline, sus paneles, su banner y sus fondos de escena son claramente de la misma familia. Así se construye ese conjunto, en los tamaños correctos y sin pelearte con el codificador.

GradientlyCuenta verificada de Gradiently··6 min de lectura
Portada: Near Noon · GR·9D1W·HH

La versión corta

  • Un conjunto de fondos para stream es el grupo de gráficos que usa un canal alrededor de su vídeo: la pantalla offline, el banner del perfil, los paneles y los fondos de escenas como empezamos pronto y ahora vuelvo.
  • La pantalla offline de Twitch mide 1920×1080, su banner de perfil 1200×480 y sus paneles de información 640×320.
  • Todas las piezas gráficas de un canal deberían compartir un fondo, un estilo tipográfico y un color de acento, para que los espectadores reconozcan el canal en cualquier parte.
  • El movimiento lento y suave va bien con los fondos para stream, porque el movimiento rápido y el grano intenso gastan más bitrate y pueden pixelarse en directo.
  • Los fondos de escena deben dejar un espacio tranquilo donde van la webcam, el chat y las alertas, para que sigan siendo legibles.
En esta página

Un buen fondo para stream no es una imagen, sino un conjunto: la pantalla offline que la gente ve cuando no estás en directo, el banner del perfil, los paneles bajo tu vídeo y los fondos de escenas como empezamos pronto, ahora vuelvo y charlando. Cuando todos comparten un fondo, un estilo tipográfico y un color de acento, el canal se ve intencionado y reconocible. Cuando cada uno se hizo un día distinto con una plantilla distinta, parece un canal que todavía se está buscando.

En directo a las 20:00
Empezamos pronto
Coge algo de beber, el chat está abierto
Gradiently · @gradiently

Una escena de empezamos pronto…

Volvemos mañana
De martes a sábado, 20:00

…y la pantalla offline, con el mismo fondo.

Esta guía cubre los tamaños, para qué sirve cada pieza, cómo mantenerlas coherentes y los detalles propios del streaming: movimiento, bitrate y dejar espacio para tu cámara y tu chat. Para el branding del canal más allá de los gráficos, branding para creadores de contenido va más lejos.

Tamaños de los fondos para stream en Twitch

Pantalla offline 1920×1080

1920 × 1080

Banner de perfil 1200×480

1200 × 480

Panel 640×320

640 × 320

Los tres gráficos de canal de Twitch, dibujados a escala.
PiezaTamañoDónde aparece
Pantalla offline1920×1080El reproductor de vídeo cuando no estás en directo
Banner de perfil1200×480En la parte superior de la página de tu canal
Paneles640×320Bajo el reproductor: información, horario, normas, enlaces
Fondos de escena1920×1080Detrás de tu cámara y tus overlays en un lienzo de 1080p
Tamaños según el tamaño de subida recomendado por cada plataforma. Las escenas usan el tamaño de tu lienzo de emisión, normalmente 1920×1080.

Si también emites en YouTube o tienes un servidor de Discord, el mismo conjunto se amplía a una imagen del canal de YouTube de 2560×1440, miniaturas de 1280×720 y un banner de servidor de Discord de 960×540. Tamaños de imagen para redes sociales recoge el resto.

Las escenas que necesita todo canal

  • Empezamos pronto. Una cuenta atrás o una frase sencilla mientras llegan los espectadores. Música, el título del directo y nada que haya que leer con atención.
  • Charlando o escena principal. El fondo detrás de tu cámara y tu chat. La pieza más tranquila del conjunto, porque es la que más tiempo está en pantalla.
  • Ahora vuelvo. Pausas cortas. El mismo fondo que en empezamos pronto con otras palabras la mantiene familiar.
  • Final. Un agradecimiento, la hora del próximo directo y quizá a quién vas a hacer raid.
  • Pantalla offline. Lo que la gente ve entre directos: tu horario y dónde más encontrarte.

Constrúyelas en ese orden de importancia: el fondo de la escena principal sostiene el canal, así que diséñalo primero y saca los demás de él.

Cómo mantener coherente un conjunto de fondos para stream

  1. 1

    Elige un solo fondo

    Elige un degradado o un material y úsalo en todas las piezas. La variedad viene de las palabras y la composición, no de fondos nuevos. La coherencia de marca explica por qué la repetición crea reconocimiento.

  2. 2

    Elige un solo estilo tipográfico

    Una fuente display para los títulos y otra legible para los detalles, como los horarios. Usa tamaños grandes: buena parte de tu público mira desde el móvil y la tele.

  3. 3

    Elige un solo color de acento

    Úsalo para las alertas, los destacados y el indicador de directo. Sácalo de la paleta del fondo para que todo encaje.

  4. 4

    Renderiza cada tamaño, no recortes

    Un banner de 1200×480 no es un recorte de una pantalla de 1920×1080. Vuelve a maquetar cada formato para que la parte más luminosa del fondo quede donde debe.

  5. 5

    Déjalo por escrito

    Guarda los colores, las fuentes y los archivos en una carpeta para que moderadores y editores usen las mismas piezas. Un kit de marca hace exactamente eso.

Horario
De martes a sábado, 20:00
Gradiently · @gradiently

Un panel de horario de 640×320, sobre el mismo fondo que las escenas de arriba.

Movimiento, bitrate y fondos para stream

Los fondos en movimiento hacen que una escena parezca viva, y en la mayoría de los programas de streaming se puede añadir un vídeo en bucle como fuente multimedia con la repetición activada. Pero todo lo que hay en pantalla compite por el bitrate de tu emisión. Los codificadores de vídeo gastan más datos en el detalle que cambia en cada fotograma, así que el movimiento rápido, el parpadeo y el grano intenso salen caros, y cuando se acaba el presupuesto la imagen se pixela. El movimiento de color lento y amplio es barato de codificar y se ve fluido.

Gasta bitrate

  • Efectos de partículas rápidos y recargados
  • Grano de película intenso y animado
  • Patrones nítidos que cambian en cada fotograma
  • Bucles con un salto visible al reiniciarse

Se codifica limpiamente

  • Deriva lenta de color en áreas grandes
  • Grano ligero y estático, o ninguno
  • Degradados suaves con un movimiento tranquilo
  • Un bucle perfecto de 10 segundos o más

El bucle ideal no tiene un principio ni un final visibles; bucles perfectos explica cómo funciona. Gradiently exporta diseños como vídeos en bucle perfecto de 5 a 30 segundos con el movimiento, el ritmo y el color que elijas, lo que va muy bien para los fondos de escena.

Deja espacio para la cámara, el chat y las alertas

Un fondo de escena queda casi todo tapado. Dibuja dónde van la webcam, la caja del chat, las alertas y la captura del juego, y mantén la zona más luminosa y recargada del fondo lejos de ellos. El texto de los overlays necesita un color tranquilo y uniforme detrás; las técnicas de texto sobre un fondo degradado se aplican directamente. Un fondo que deja espacio tranquilo para estos elementos parece diseñado en torno a tu contenido y no solo detrás de él.

Preguntas frecuentes

¿Qué tamaño tiene una pantalla offline de Twitch?

1920×1080 píxeles, la misma forma 16:9 que el reproductor de vídeo.

¿Qué tamaño tienen los paneles de Twitch?

Diseña los paneles a 640×320 píxeles. Van bajo el reproductor de vídeo y contienen tu información, tu horario, tus normas y tus enlaces.

¿Qué tamaño tiene un banner de perfil de Twitch?

1200×480 píxeles. Ocupa la parte superior de la página de tu canal.

¿Debe estar animado el fondo de mi stream?

Un movimiento suave ayuda a que una escena parezca viva, pero mantenlo lento y amplio. El movimiento rápido y el grano intenso gastan más bitrate y pueden hacer que la emisión se pixele.

¿Cómo consigo que los gráficos de mi stream se vean coherentes?

Usa un fondo, un estilo tipográfico y un color de acento en todas las piezas, y vuelve a maquetar cada tamaño en lugar de recortar una sola imagen.

Compartir esta guía

Escrito por GradientlyCuenta verificada de Gradiently

El equipo detrás de Gradiently, una herramienta de diseño creada en torno a los Marks: degradados vivos que hacen que todo lo que diseñas parezca tuyo.

Ver nuestro perfil