El avatar de un canal en YouTube se muestra a 98 por 98 píxeles. Eso es más pequeño de lo que la mayoría supone cuando exporta un maestro de 4000 píxeles y da por terminado. A su lado, la bandera del canal se extiende 2560 píxeles de ancho y solo muestra una fracción de sí misma en una televisión. Y al final de cada vídeo, la misma marca tiene que sentarse junto a dos miniaturas de la competencia sin volverse ilegible.
Así que un logotipo animado de YouTube no es un recurso. Es una marca, dibujada una vez y adaptada a tres cajas que casi no comparten geometría, y luego animada una vez para las tres. Si te equivocas de orden, redibujarás la marca tres veces. Si lo haces bien, todo es una sola tarde. Si no has animado una marca antes, empieza con los fundamentos para animar un logotipo primero.
Las tres cajas que debe llenar un logotipo animado de YouTube
Ayuda tratar cada emplazamiento como una restricción de diseño y no como un redimensionado. Las tres no tienen nada en común salvo la propia marca.
El avatar es cuadrado, se muestra dentro de un recorte circular y es minúsculo. Todo lo que queda fuera del círculo inscrito en ese cuadrado se recorta, así que la marca tiene que estar dentro de un círculo por diseño, no ser un rectángulo que casualmente tiene espacio alrededor.
La bandera es ancha y casi invisible. YouTube muestra una zona segura de 1235 por 338 píxeles dentro de una subida de 2048 por 1152 píxeles, y una televisión que recorta aún más. Lo que queda fuera de esa banda central es decoración para espectadores de un tamaño de pantalla concreto, que es un buen extra y nunca una premisa de diseño.
La pantalla final es la que involucra a otras personas. Tu marca aparece como un elemento circular pequeño junto a tarjetas de vídeo y el botón de suscripción, sobre metraje que no controlas. Tiene que leerse contra una cabeza parlante brillante y una escena de pelea oscura en la misma sesión.
Diseña primero el avatar de 98px
Empieza en el tamaño más pequeño y sube. No al revés, y no como una comprobación al final.
El razonamiento es simple. Ir de grande a pequeño pierde detalle: dibujas un nombre que se lee bellamente a escala de bandera, y luego descubres a tamaño de avatar que las letras se han colapsado en una mancha gris, y ahora tienes que redibujar. Ir de pequeño a grande no pierde nada, porque una marca que se lee a 98 píxeles se lee a cualquier tamaño mayor. La versión pequeña es la restricción; todo lo mayor es espacio que no necesitabas.
En la práctica, esto significa diseñar el avatar como un símbolo independiente mientras trabajas en él, y luego añadir el nombre para la bandera y la pantalla final. Esa separación es el mismo razonamiento detrás de construir un GIF de logotipo o cualquier recurso de formato pequeño en torno a un monograma: la versión que sobrevive al recorte más difícil es la versión que vale la pena animar.
Apóstate por una marca que funcione en un círculo
Dos formas fallan el recorte circular sistemáticamente. Cualquier cosa con contenido importante en las esquinas de su caja contenedora, un nombre alineado de lado a lado, un bloque con un símbolo junto a un nombre, pierde los extremos del nombre. Y cualquier cosa construida como un rectángulo ancho con espaciado interno basado en esa anchura se verá descentrada una vez que el círculo muerda en ella.
La solución es diseñar como si la caja ya fuera un círculo. Mantén la marca dentro de un círculo inscrito en el cuadrado, deja un margen de respirar de aproximadamente ocho a diez por ciento del diámetro en cada lado, y si la marca tiene un nombre, trátalo como un recurso separado para los emplazamientos anchos en vez de algo que deba aparecer a tamaño de avatar. Un monograma más un nombre opcional es la estructura que sobrevive a las tres cajas.
Prueba la marca a tamaño real, no ampliada
Diseña a 4000 píxeles, juzga a 98. Exporta la marca a su tamaño real de visualización, ponla en un móvil a la distancia del brazo y mírala en menos de un segundo. Los trazos finos desaparecen, el espacio negativo se cierra y cualquier degradado se vuelve un tono medio plano. Lo que sobrevive a esa prueba es el dibujo que animas.
Lo incómodo es que la prueba suele matar la versión más interesante de la marca. Eso no es razón para saltársela. Cada canal que usa una ilustración detallada como avatar termina reemplazándola, y la reemplaza por algo cercano a lo que esta prueba habría producido desde el principio.
El movimiento también tiene que leerse a tamaño de avatar
La misma lógica aplica a la animación, y es aquí donde fallan la mayoría de los logotipos de canal. Una entrada construida con un deslizamiento, una escala y una rotación se lee bien a 1080 píxeles y se vuelve lodo ilegible a 98, porque todos son movimientos de posición y tamaño, y a pequeña escala el ojo no puede seguirlos.
Lo que sobrevive pequeño es el cambio de forma y opacidad: un barrido, un dibujado, un fundido entre dos estados de la misma silueta. Esos se leen como un cambio de estado y no como un movimiento, y se registran al instante incluso en un elemento del tamaño de una miniatura.
La mecánica detrás de eso está documentada en el modelo de animación CSS, que separa las propiedades animables en las que se pueden interpolar suavemente y las que no: w3.org — especificación de animaciones CSS. Opacity y transform se interpolan de forma limpia y barata; cualquier cosa que fuerce un recálculo completo de diseño a mitad de la animación es más pesada de renderizar y más difícil de leer a tamaños pequeños. El mismo principio se mantiene tanto si la animación corre en un navegador como si se renderiza a vídeo.
Otras dos restricciones vienen de la plataforma. Primero, la animación tiene que aterrizar y mantenerse: un avatar se mira de reojo, así que la marca debería estar en su estado final la mayor parte del tiempo de reproducción. Segundo, el punto de bucle debería volver al primer fotograma si el recurso se usará como miniatura en movimiento o en una intro, porque una marca en movimiento que se reinicia con un salto visible parece rota.
Pantallas finales y intros animadas
Dos sitios donde una marca de canal animada justifica su lugar más allá del avatar.
El primero es una intro de canal corta, de uno a tres segundos: la marca llega, se mantiene, se despeja. Mantenla por debajo de tres segundos, porque cada segundo de intro es un segundo de retención de espectadores gastado antes de que empiece el contenido. La versión más ajustada de ese formato es la animación de introducción de logotipo, donde el primer fotograma se diseña para sostenerse solo.
El segundo es la pantalla final. La propia documentación de YouTube sobre marca de canal pide a los creadores que no añadan sombras proyectadas, bordes ni marcos a los elementos que aparecen junto a otras tarjetas de canal, porque la plataforma ya aplica su propio tratamiento y los efectos apilados hacen ruidoso el diseño. Una marca animada en una pantalla final debería, por tanto, tener bordes limpios y ser autónoma, sin resplandor ni contorno añadido para enfatizar.
Ambos emplazamientos comparten una regla con el avatar: empieza con el logotipo en su estado final. La propia guía de YouTube es subir un avatar de al menos 98 por 98 píxeles que se mostrará en un círculo, y mantener el mensaje de la bandera dentro de la zona segura de 1235 por 338; el resto de la subida de 2048 por 1152 a menudo se recorta por completo: support.google.com/youtube/answer/10456525. Como señala esa documentación, una bandera diseñada a lo ancho de toda la subida se verá centrada en un escritorio y perderá ambas mitades en una televisión.
Una animación, tres exportaciones
Construye la animación una vez contra el recorte del avatar, y luego expórtala en cada relación de aspecto que el canal necesita. El tempo, el easing y la espera se mantienen idénticos; solo cambia el encuadre alrededor de la marca.
La lista corta: una exportación cuadrada a tamaños de avatar y miniatura para el recurso de perfil fijo y animado, una exportación horizontal para el área de bandera del canal y cualquier uso web o de prensa, y una exportación 16:9 para la intro y la pantalla final. Si el canal también publica Shorts verticales, añade un recorte 9:16, mismo archivo fuente, misma alineación de compás.
El bitrate de exportación importa más aquí que en metraje ordinario, porque una marca de alto contraste sobre fondo plano es donde los artefactos de compresión aparecen primero. H.264 con perfil High, un intervalo de fotograma clave de unos dos segundos y una tasa de datos por encima de lo que la plataforma recomienda para vídeo general evitarán que los trazos finos tengan ringing.
Hay una segunda decisión de exportación escondida en el mismo cuadro. Una marca sobre fondo plano es inusualmente sensible a errores de espacio de color, y vale la pena confirmar que el contenedor lleva los valores que esperas en vez de asumir que el valor por defecto es correcto: la diferencia aparece como un color de marca que cambia sutilmente en la pantalla de otra persona. Comprobar cómo un formato maneja los metadatos es parte del trabajo, no un detalle secundario: developer.mozilla.org — referencia de manejo de formatos.
Dónde más aparece la marca
Una marca de canal no vive solo en las tres cajas oficiales. Aparece en sitios para los que YouTube no te da una ficha técnica, y esos suelen ser donde una versión animada hace el mayor trabajo.
Las miniaturas son la obvia. Una marca pequeña en una esquina de una miniatura es una pista de reconocimiento, y funciona mejor cuando es idéntica en cada vídeo: misma posición, mismo tamaño, mismo tratamiento. En el momento en que la marca de la esquina se mueve entre subidas, el valor de reconocimiento colapsa y se vuelve decoración.
Los Shorts son el segundo. Un recorte vertical de la misma marca funciona como tarjeta final para un Short, y el encuadre 9:16 es donde un vídeo de logotipo construido desde un archivo fuente gana su lugar: el tempo se traslada sin cambios, solo cambia el encuadre alrededor de la marca.
El tercero está totalmente fuera de la plataforma. La misma marca animada acaba en una firma de correo, un kit de prensa, un servidor de Discord y una presentación de patrocinador. Todos esos son motivos para mantener el archivo fuente en un solo lugar en vez de reconstruir el movimiento cada vez que alguien pide una versión.
Una comparación que conviene tener en mente
Las tres ubicaciones difieren en más que dimensiones, y conviene tener las diferencias listadas en un solo sitio antes de empezar a exportar.
Avatar: cuadrado, mostrado en un círculo, aproximadamente 98 píxeles en pantalla, juzgado en menos de un segundo, mejor construido como un símbolo independiente con un fondo sólido o simplemente contrastante.
Bandera: ancha, efectivamente 1235 por 338 para lo que deba seguir visible, subida a 2048 por 1152, leída en escritorio y televisión con recortes distintos, mejor construida con la marca a un lado y el mensaje dentro de la banda segura.
Pantalla final: pequeña, circular, colocada sobre metraje no controlado, compitiendo con tarjetas de vídeo y un botón de suscripción, mejor construida como una marca de bordes limpios sin contorno ni sombra añadidos y una espera corta en vez de una animación larga.
Una marca, un lenguaje de movimiento, tres conjuntos de números. Anota los números junto a los archivos de exportación para que la próxima persona que toque el canal no reconstruya la marca de memoria y se desvíe dos fotogramas del compás.
Preguntas frecuentes
¿Qué tamaño debe tener el logotipo de un canal de YouTube?
Sube al menos 98 por 98 píxeles, y más si puedes; la propia guía de la plataforma es un mínimo de 98 píxeles para el avatar, que se muestra dentro de un recorte circular. Diseña a 4000 píxeles pero juzga a 98, y mantén todo lo importante dentro del círculo inscrito en el cuadrado.
¿Puede animarse el logotipo de un canal de YouTube?
El avatar en sí es una imagen fija, pero la misma marca puede animarse para intros, pantallas finales, miniaturas en movimiento y cada emplazamiento fuera de la plataforma. Construye una animación contra el recorte del avatar y expórtala en las relaciones que necesites, para que el tempo se mantenga idéntico dondequiera que aparezca la marca.
¿Por qué se ve borroso mi logotipo como avatar de canal?
Casi siempre por trazos finos y detalle excesivo. A 98 píxeles un trazo de un píxel o desaparece o tiembla, y normalmente tiembla. Simplifica el dibujo hasta que se sostenga en el tamaño más pequeño, aumenta el contraste entre la marca y su fondo, y anima la versión simplificada en vez de la detallada.
¿Debo poner el nombre de mi canal en el logotipo?
Trata el nombre como un recurso separado. Un nombre no se leerá a tamaño de avatar, las letras colapsan en una mancha gris, así que usa un monograma como marca principal y añade el nombre solo en la bandera, la intro y la pantalla final, donde hay anchura para dedicarle.
¿Cuánto debe durar la animación de intro de un canal?
De uno a tres segundos, y más cerca de uno para canales que publican semanalmente. La marca llega rápido, se mantiene un compás y se despeja antes de tener que ganar de nuevo la atención del espectador. Cualquier cosa más larga intercambia retención por un logotipo, lo cual es un mal intercambio en cada vídeo que publiques.
En resumen
Diseña a 4000 píxeles y decide a 98. Ese único hábito, construir la marca para el recorte del avatar antes que la bandera y animar cambios de forma en vez de grandes movimientos de posición, es lo que produce un logotipo animado de YouTube que funciona en las tres ubicaciones sin un segundo redibujo. El avatar del canal es la única versión que la mayoría de los espectadores verá a tamaño completo; todo lo demás es contexto a su alrededor. Puedes probar el recorte de tamaño pequeño en tu propia marca en el editor del navegador antes de comprometerte con una animación.