Skip to content

Lanzar y controlar el Player

Abre la vista Player de tu sala, pilótala desde la barra de transporte del Studio, ajusta el timer en curso al vuelo y lánzala en pantalla completa o como fuente de OBS.

Última actualización

Lanzar y controlar el Player

El Player es la salida en pantalla de Timers Studio. Es lo que ven tu público, tu ponente o tu pantalla de escena. Esta página muestra cómo abrirlo, controlarlo desde el Studio y adaptarlo al hardware en el que corre.

Requisitos previos

  • Al menos un timer en tu rundown (ver Crea tu primer timer)
  • Una pestaña abierta en timers.studio/id/<your-room> para el Studio
  • Una segunda pestaña, ventana o dispositivo para el propio Player

Pasos

1. Abrir la vista Player

En una nueva pestaña, ve a timers.studio/player/<your-room>. Usa el mismo ID de sala que aparece en la URL del Studio. El Player carga, lee el estado actual desde Supabase y luego se suscribe a las actualizaciones a través del canal Gateway.

La URL del Player no tiene autenticación. Está pensada para compartirse con ponentes, pantallas de escena o con OBS — cualquier persona con el enlace ve el reloj. Si necesitas una vista protegida, usa la URL de Moderator.

2. Iniciar un timer desde el Studio

De vuelta en el Studio, mira el ControlPanel (columna central). El botón principal muestra Play cuando el timer está detenido y Pause cuando está corriendo. Haz clic en Play o pulsa Espacio. El TimerState pasa a RUNNING y el Player empieza a contar en menos de 100 ms.

Para detener, haz clic en el botón rojo Stop. Para pausar sin reiniciar, vuelve a pulsar Espacio.

3. Ajustar el timer en curso

El ControlPanel ofrece cuatro botones de ajuste rápido:

  • +1m — añade 60 segundos al timer actual
  • +30s — añade 30 segundos
  • -30s — resta 30 segundos
  • -1m — resta 60 segundos

Cada clic dispara una acción TWEAK mediante onAction('TWEAK', <seconds>). El Player recibe el nuevo valor de elapsed y se vuelve a renderizar al instante. Útil cuando tu ponente necesita un minuto más o para cerrar un hueco en el rundown.

4. Saltar entre timers

Dos botones de flecha — Previous y Next — saltan al timer anterior o siguiente. Pulsar una fila del rundown tiene el mismo efecto. Los atajos de teclado son ← (anterior) y → (siguiente).

El Player siempre renderiza la entrada activa. Cambiar el índice equivale a cambiar lo que hay en pantalla.

5. Poner el Player en pantalla completa

En la pestaña Player, pulsa F o mueve el ratón y haz clic en el icono de pantalla completa que aparece en los controles de esquina. El Player oculta entonces el BrandLogo (en planes Pro), el cursor y toda la interfaz interna — queda solo el reloj desnudo.

Para las salidas de escena normalmente querrás suprimir la UI extra:

  • ?hideTitle=true — oculta la superposición de título
  • ?hideMessage=true — oculta cualquier mensaje activo
  • ?theme=light — fuerza tema claro, sin importar el ajuste del Studio
  • ?theme=transparent — fuerza tema oscuro con fondo transparente (útil para componer en OBS)

Combínalos con &, por ejemplo timers.studio/player/<your-room>?hideTitle=true&hideMessage=true.

6. Incrustar el Player en OBS

En OBS, añade una Fuente de Navegador y pega la URL del Player. Ajusta la resolución (1920×1080 o 1280×720 son los valores seguros) y marca Actualizar navegador al activar la escena si tu show reinicia el stream entre segmentos. El Player detecta automáticamente los user agent de Smart TV y Consola y reduce al 90% de área segura para evitar el overscan — esa detección no se dispara dentro de OBS, por lo que se aplica el layout al 100%.

Controles de viewport locales

El Player expone un pequeño panel de controles que vive solo en la pestaña Player (sin efecto en el Studio):

  • Flip horizontal (flipH)
  • Flip vertical (flipV)
  • Rotación 0° / 90° / 180° / 270°
  • Área segura — default, 90%, 80%, off

Úsalos cuando la pantalla física esté montada de lado o al revés, o cuando alimentes un TV que recorta los bordes.

Resultado esperado

Una pestaña Player, un cronómetro en marcha sincronizado con el Studio. Cada acción de transporte (Play, Pause, Stop, Next, Previous, tweak) se refleja en el Player en menos de 100 ms. Cada pestaña Player abierta sobre el mismo ID de sala muestra la misma hora con precisión de décima de segundo, independientemente de cuándo se haya abierto.

Resolución de problemas

¿Por qué el Player se queda congelado en 00:00? El Player deja de contar cuando timerState no es RUNNING. Comprueba que has pulsado Play en el Studio, no Pause ni Stop. El botón del ControlPanel se vuelve verde cuando el timer está en marcha.

¿El Player necesita el mismo login que el Studio? No. La URL del Player es pública por diseño — cualquier persona con el enlace ve el reloj. La contraseña de sala solo protege la vista Moderator.

¿Cómo oculto el título o el mensaje? Añade parámetros a la URL del Player: ?hideTitle=true elimina el título, ?hideMessage=true oculta cualquier mensaje activo. Puedes combinar ambos.

¿Puedo rotar o invertir el Player en una pantalla vertical? Sí. El Player expone controles locales (flipH, flipV, rotate, safeArea). Pasa el ratón sobre el Player para mostrar el panel de controles y elige la orientación. Estos ajustes se quedan en la pestaña.

Para continuar