Diseño de escenas, fuentes y transiciones en OBS

En esta clase vamos a empezar a diseñar nuestras escenas en OBS viendo todos los tipos de fuentes multimedia que podemos usar y cómo utilizar transiciones para realizar nuestros directos.

Escenas

OBS funciona mediante escenas que se forman de varias fuentes (webcam, sonidos, imágenes, textos…). Cuando seleccionamos una escena, esta se mostrará en nuestro lienzo con todos sus elementos visibles en el apartado “Fuentes”

Las escenas se encuentran listadas en el recuadro inferior izquierdo llamado “Escenas”.

Por defecto, OBS nos crea una escena vacía. Para añadir una nueva escena, pulsaremos el símbolo + de la esquina inferior de la ventana, y si queremos eliminar una escena, pulsaremos el símbolo – .

A su vez, podemos ordenar las escenas con los iconos de las flechas. Este orden no afecta al modo en que se ejecutan las escenas en la realización.

De hecho, si clicamos en una escena distinta a la actual, por defecto pasaremos a ella mediante la transición predeterminada. Veremos las transiciones más adelante en la clase.

Si hacemos clic derecho encima de una escena se desplegará un menú de opciones, entre ellas, renombrar o duplicar.

También aquí podemos activar el “Modo Cuadrícula” si nos resulta más cómodo ese tipo de visualización de la lista de escenas.

Otro elemento a tener en cuenta de las escenas es la posibilidad de crear colecciones de escenas separadas por proyecto mediante “Barra de Menús > Colección de Escenas”.

Así podemos crear distintas colecciones de escenas que podremos recuperar cuando las necesitemos.

Fuentes

Las fuentes que se incorporan en una escena se añaden en el panel de “Fuentes”.

Para añadir una nueva fuente usaremos el icono + de la esquina inferior de la ventana y se desplegará el menú de elección de fuente nueva.

Ya vemos que hay muchos tipos de fuentes, tanto de sonido, como de vídeo o imagen, a parte de elementos como colores sólidos o texto. Algunas son aparentemente muy parecidas entre sí, pero tienen diferencias muy determinantes.

Cuando elijamos el tipo de fuente, lo primero que nos pedirá es darle un nombre (o seleccionar una fuente preexistente si así fuera) pero a partir de aquí mejor que veamos cómo funcionan una por una, porque cada tipo de fuente tiene su configurador propio que merece ser explicado.

Captura de entrada de audio

Con esta fuente podemos seleccionar una entrada de audio de nuestro sistema, es decir, cosas como micrófonos (tanto por analógico o USB) o entradas de línea.

Con el desplegable de “Dispositivo” elegiremos el deseado y al darle a “Aceptar” nos aparecerá tanto en la ventana de “Fuentes” como se añadirá un medidor propio en “Mezclador de Audio”.

Captura de juego

Esta opción es la ideal para capturar videojuegos o ejecutables a pantalla completa.

En el primer desplegable podemos seleccionar el “Modo”, optando entre “cualquier app a pantalla completa”, “ventana específica” (en la que deberemos seleccionarla en un nuevo desplegable) y “ventana en primer plano con acceso rápido”.

De las casillas marcables, vemos la de “Modo captura SLI” que sirve para esos casos de disponer de multi GPU.

“Permitir transparencia” habilitará esa opción en juegos compatibles.

“Limitar tasa de fotogramas” para igualar los fotogramas entre el juego y captura.

Podemos seleccionar si queremos o no “Captura de Cursor”. 

Recomendamos dejar marcado “Compatibilidad anti-trampas” para evitar el bloqueo de captura que incorporan ciertos juegos, y por último, “Capturar capas externas” si usamos apps como Steam o Xbox y deseamos que se capturen sus gráficos superpuestos al juego.

Captura de pantalla

Este método de captura de pantalla es el más utilizado, nos capturará absolutamente todo lo que aparezca en la pantalla que escojamos.

Podemos elegir el “Método de Captura” con el primer desplegable, y en el segundo desplegable “Pantalla” podemos elegir la pantalla que deseemos de entre todas las que tengamos .

Y una vez más, podemos elegir si capturar el cursor o no marcando o desmarcando la casilla inferior.

Captura de salida de audio

Muy parecido al ya mencionado “Entrada de Audio”, con la diferencia que aquí podemos elegir una fuente de salida de sonido (altavoces u otras) que tengamos en el sistema.

Captura de ventana

Con este método podemos seleccionar una “Ventana” cualquiera que tengamos abierta en ese momento de forma específica.

Si alguna vez la cerramos, podemos usar el “Prioridad de Captura” para que detecte con coincidencias de título o ejecutable la ventana deseada.

Podemos decidir “Captura de cursor” como siempre. ¡Ojo! Con este método de captura NO serán visibles elementos emergentes como menús desplegables o notificaciones flotantes de las aplicaciones de la ventana.

Dispositivo de captura de vídeo

Aquí es dónde elegimos nuestra cámara.

En “Dispositivo” nos aparecerán todas las cámaras conectadas en ese momento.

Podemos “Desactivar/Activar” dicho dispositivo para resetearlo si fallara.

Algunos dispositivos permiten “Configurar vídeo” para modificar su exposición, contraste, saturación… entre otros.

Y depende del dispositivo (especialmente tarjetas de captura de vídeo) nos permitirá usar “Configurar la barra fija”.

La casilla de “Desactivar cuando no se muestre” hace que, si no se está ejecutando la escena con dicho dispositivo, éste se desconecte para ahorrar recursos. 

Luego en “Tipo de Resolución/FPS” en que nos mostrará sus opciones predefinidas o podemos elegir “Personalizado”.

En dicho caso, podremos elegir la “Resolución” deseada en el siguiente desplegable (nos mostrará las compatibles del dispositivo), y también los “FPS” en base a los que el dispositivo permita.

En cuanto a “Formato de vídeo”, “Espacio de color”, “Rango de colores” y “Almacenar búfer” recomendamos dejarlo en predeterminado, ya que requiere de más recursos del sistema.

Las casillas de “Voltear verticalmente” y “Aplicar datos de rotación” puede que nos interesen. ¡OJO! La imagen en OBS no es espejo, sino natural, cuidado con aplicar rotaciones.

Por último, se asignará un “Modo de salida de audio de la cámara” si esta dispone de micrófono, a no ser que usemos la casilla “Utilizar dispositivo de audio personalizado” que entonces podremos asociar el dispositivo de video con el de audio deseado.

Escenas

Este parámetro es muy sencillo, nos mostrará una lista de todas las escenas que ya tengamos creadas y podremos elegirlas para incluirlas como un todo.

Va muy bien para anidar escenas complejas dentro de una nueva y aplicar efectos y filtros en su totalidad.

Fuente multimedia

Este tipo de fuente permite importar archivos como videos o músicas a nuestro proyecto.

Con “Archivo local” marcado podremos elegir un archivo de nuestro ordenador con “Examinar”, mientras que si lo desmarcamos, podemos usar un URL para buscar un archivo online.

Los formatos soportados son:

• Video: .mp4, .ts, .mov, .flv, .mkv, .avi,
    .gif, .webm

• Audio: .mp3, .aac, .ogg, .wav

Luego tenemos la casilla de “Bucle” si deseamos que dicho archivo se repita constantemente.

“Reiniciar la reproducción” es importante ya que forzará el inicio del archivo cada vez que entremos en la escena que lo contenga.

Se recomienda activar “Utilizar decodificación por hardware” si tenéis una GPU decente, ya que repartirá mejor los recursos del sistema para reproducir el archivo.

“No mostrar nada al terminar la reproducción” hace desaparecer la fuente una vez haya terminado, ahorrando recursos y evitando un “fotograma congelado” en el caso de un vídeo.

Y la casilla de “Cerrar archivo inactivo” evita cargar el archivo si su escena no está activa, ahorrando recursos pero generando más tiempo de carga al activarla.

Podemos también modificar la “Velocidad” de reproducción, elegir la “Gama de Color” y “Aplicar alfa en espacio lineal” si es que nuestro archivo tiene transparencia definida.

Galeria de imágenes

Aquí podremos crear pases de fotografías.

Definiremos el “Comportamiento” entre reproducción constante, reinicio al activar o pausa al salir.

El “Modo” si deseamos que se pasen automáticamente o sea manual.

El tipo de “Transición” entre las disponibles.

La duración de “Tiempo entre diapositivas” determina lo que durará cada una en pantalla.

La “Velocidad de transición” para definir lo rápido o lento que deseamos transicionar.

Y marcar si deseamos que sea una presentación en “Bucle”, si la queremos “Ocultar al acabar” o si deseamos una “Reproducción aleatoria” del contenido.

Podemos definir la “Relación de aspecto” de la presentación, que no va a deformar las imágenes, pero lo más importante es el importar “Archivos de imagen”.

Lo conseguiremos apretando el símbolo + del recuadro inferior, que nos permite añadir archivo a archivo o directamente una carpeta con varias. Podemos eliminar una imagen apretando el símbolo – y ordenar la lista con los iconos de las flechas.

Imagen

Este importador sirve para imágenes individuales.

Los formatos principales compatibles son: .bmp, .tga, .png, .jpeg, .jpg, .gif, aunque hay muchos más.

Podemos marcar “Descargar de memoria cuando no se muestre” para ahorrar recursos y “Aplicar alfa lineal” para rellenar transparencias.

Navegador

La fuente “Navegador” es de las fuentes más complejas, pero de las más interesantes y con más posibilidades de OBS.

Nos permite utilizar fuentes web (e incluso archivos html locales) que se ejecutarán interactivamente en nuestro proyecto.

Se utiliza para activar alertas animadas, chats, reacciones de vídeo o sonido, e incluso importar fuentes web como feed de vídeo directo.

En realidad el funcionamiento es muy sencillo.

En “URL” escribiremos la dirección web deseada.

En “Ancho” y “Alto” definiremos el tamaño que queremos que tenga la fuente web.

Podemos marcar “Usar FPS personalizada” para definir la velocidad de fotogramas, y también marcar “Controlar audio vía OBS” si queremos añadir un medidor de volumen en el Mezclador de Audio.

Luego hay el apartado “CSS personalizado” en el que, si tenemos dominio de código CSS, podemos escribir modificadores a dicha fuente web, tales como transparencias, márgenes, duración de eventos…

Podemos “Apagar la fuente” cuando no sea visible para ahorrar recursos, y activar “Actualizar el navegador” al activar si nos interesa.

Y por último, el tipo de permiso que le damos a dicha web para interactuar con OBS.

Ya lo veremos más adelante, pero decir que este tipo de fuentes pueden ser interactivas si lo deseamos, con lo que en realidad es como abrir un navegador web dentro de OBS, ¡muy pero que muy útil!

Origen de color

Un tipo de fuente muy sencillo que nos permite añadir un color plano a nuestra escena.

Podemos definirlo mediante “Seleccionar Color” y allí nos saldrán colores predefinidos, ruedas de color e incluso podremos usar códigos hexadecimales de color para seleccionarlo.

También podremos definir el tamaño de “Ancho” y “Alto” que tendrá nuestra fuente de color.

En realidad lo del tamaño da igual porque a posteriori podremos agrandar o deformar dicha fuente en el diseño de lienzo.

Texto

Con esta fuente se pueden añadir textos de forma sencilla.

La verdad es que es una herramienta muy rudimentaria y poco práctica para hacer diseños, pero se agradece su simplicidad.

Podremos elegir “Fuente” y allí su estilo y tamaño.

En el recuadro “Texto” escribiremos lo que deseemos, o podemos marcar la casilla “Leer desde Archivo” para importar ya un texto desde un archivo TXT.

“Habilitar Antialiasing” procesa el render para que no muestre dientes de sierra.

Podemos aplicar “Transformaciones del texto”, si lo queremos “Vertical”, el “Color” y “Opacidad” del texto y del fondo, el “Alineamiento” horizontal y vertical, “Contorno” y límites de extensión.

Grupo

Por último tenemos la fuente “Grupo”, que creará una carpeta dentro de nuestro panel de “Fuentes” y allí podremos arrastrar todas las fuentes que deseemos.

La razón para hacerlo es poder escalar, mover, deformar, aplicar filtros… a un conjunto de fuentes que siempre deseamos tratar juntas.

Es parecido a crear una “Escena” e importarla como fuente, aunque permite hacer cosas distintas, sobre todo en materia de filtros y transiciones.

Opciones del panel de fuentes

Al añadir una fuente, aparecerá en el panel de fuentes con el nombre que le hayamos dado.

Se pueden añadir tantas fuentes como queramos a una escena, incluso repetir del mismo tipo.

Eso sí, las fuentes sí que siguen un orden jerárquico, las que se encuentren por encima de la lista se sobreponen a las situadas por debajo.

Para cambiar ese orden de las fuentes, podemos usar los botones con forma de flecha de la parte inferior del panel, o simplemente arrastrar la fuente a la posición deseada.

Al lado de cada fuente vemos unos iconos; el icono “Ojo” las oculta o muestra en el lienzo y el icono “Candado” las bloquea para evitar modificaciones.

Si marcamos una fuente con clic, aparecerá una barra en la parte baja del lienzo con accesos rápidos a ciertas propiedades de dicha fuente y a la aplicación de filtros.

Pero a su vez, si hacemos clic secundario encima de una fuente, se desplegarán las opciones adicionales, como “Transformar”, “Filtrado de Escala” o “Modos de Fusión”.

Una opción muy interesante es la de “Establecer Color” que asigna un color destacado a la fuente en la lista para diferenciarlas fácilmente.

Estas opciones ya nos llevan directos al siguiente paso, el diseño de nuestro lienzo.

Diseño del Lienzo

Recordemos que nuestro lienzo es la zona que se emitirá o grabará de nuestra sesión.

En la clase anterior ya vimos cómo configurarlo en Ajustes.

Recomendamos que en “Ajustes > Generales” se activen todas las casillas de “Alineación de la Fuente”, así el diseño y posicionamiento de los elementos será más cómodo.
Las fuentes añadidas a nuestro lienzo se pueden arrastrar, mover, escalar, deformar y recortar. Al seleccionar una fuente veremos un recuadro rojo marcando sus límites.

Si nos situamos en alguno de los puntos del marco y arrastramos manteniendo pulsado el clic simple, escalaremos proporcionalmente el tamaño. 

Pulsando clic + Mayús podremos deformar la proporción. Y pulsando clic + Alt se va a recortar la fuente por sus laterales o verticales.

Si hacemos clic derecho sobre la fuente en el lienzo, se desplegarán las opciones adicionales. 

Entre ellas están las de “Trasformar”, donde encontramos opciones como “Editar transformación” para manipular al detalle, “Restablecer” para hacer que se recuperen los cambios o los distintos tipos de centrado en pantalla.

Las fuentes se pueden copiar (Ctrl+C) y se pueden pegar (Ctrl + V) manteniendo las modificaciones, incluso entre escenas distintas, aunque hay que diferenciar el “Pegado de Referencia” del “Pegado de Duplicado”. Se consiguen haciendo botón derecho.

Si pegamos una referencia, al modificar esa fuente duplicada en un lugar, se modificará en todos los lugares donde aparezca, mientras que un duplicado se convierte en independiente y sus cambios sólo le afectarán a él.

Se pueden aplicar Filtros a nuestras “Fuentes” o “Grupos” (e incluso a las “Escenas”) si hacemos clic derecho en uno de ellos y seleccionamos “Filtros”.

Se abrirá la ventana de efectos y nos ofrecerá listas para añadir “Filtros de audio/video” y “Filtros de Efecto” dependiendo del tipo de fuente. Con el símbolo + podremos añadir uno de entre los disponibles y configurarlo.

Se pueden añadir varios filtros a una misma fuente, y su orden también se ejecuta de forma jerárquica. Mediante los iconos de flechas podemos moverlos, y activar o desactivar efectos con el icono del ojo.

De base vienen filtros muy sencillos pero versátiles, como “Corrección de Color” o el famoso “Fondo Croma” para eliminar un fondo verde. En el caso de Fuentes de sonido, tenemos filtros como “Compresor” o “Eliminación de ruido”.

Cada filtro tiene sus parámetros, y mejor que dediquemos una clase más adelante sólo a explorarlos en profundidad. ¡No olvidéis suscribiros y darle a la campanita para enteraros!

Eso sí, decir que se pueden conseguir más efectos mediante plugins en la web de OBS.

En cualquier caso, diseñaremos nuestras distintas escenas con sus distintas fuentes tanto de imagen como de sonido, con sus filtros, y sólo nos queda ver cómo transicionar de unas a otras.

Transiciones

Cuando cliqueamos en una escena distinta a la que tengamos en vista, se ejecutará una transición de forma automática.

Para elegir la transición que deseamos usar, iremos al panel “Transiciones de Escena”.

En el desplegable escogemos el tipo de transición, y podemos definir una duración (menos la de Corte). 

Todas las transiciones marcadas con “Agregar” pueden guardarse y personalizarse clicando en el Engranaje. Estas se añadirán a la lista de transiciones disponibles.

La transición de este panel será la transición por defecto al cambiar de escena.
Pero si deseamos transiciones personalizadas por escena, podemos conseguirlo haciendo clic derecho en “Escena > Anulación Transición > (elegir la deseada)”.

De este modo cuando pasemos a esa escena, se usará la transición asignada y no la transición por defecto.

También se pueden asignar transiciones a las fuentes para cuando se ocultan o muestran (con el icono Ojo), haciendo así dinámicas las escenas por sí solas. Podemos conseguir más transiciones mediante plugins en la web de OBS.