PLAYDECK ya te ofrece dos cómodos mandos a distancia: Bitfocus Companion Si tienes un Deck Stream o un ATEM, y el Control remoto web si solo quieres un navegador conectado a la misma red Wi-Fi.
«Custom Remote» es la tercera opción. Pegas un archivo HTML, PLAYDECK lo reproduce en este ordenador y tu teléfono lo abre mediante un código QR. ChatGPT, Gemini o Claude solo reescriben ese archivo. PLAYDECK nunca se comunica con la IA y nunca se instala un chatbot en el reproductor.
Esto sirve para aquellas tareas para las que Web Remote no está diseñado: un director de plató que solo necesita tres botones enormes, un productor que quiere que el tiempo restante se muestre en una pantalla del tamaño de un camión, un programa que necesita un comando adicional que la interfaz de usuario predeterminada no muestra. Describes la tarea en lenguaje sencillo. La IA devuelve código HTML. Lo pegas de nuevo.
No modifiques los archivos que hay dentro de la carpeta del programa PLAYDECK. Las actualizaciones los sobrescriben. «Custom Remote» es la versión derivada que sobrevive a las actualizaciones.
En este artículo:
→ Lo que obtienes
→ Utiliza el ejemplo (empieza aquí)
→ Dejemos que la IA lo cambie
→ Comandos y estado en tiempo real
→ Utilizando Web Remote como base
→ Si algo no funciona
Lo que obtienes
Ajustes → Mando a distancia → Mando a distancia personalizado.
PLAYDECK almacena tu código HTML y lo muestra en una dirección fija:
http://YOUR-PC:11411/custom
La URL no cambia al pegar un nuevo diseño. El código QR que hay junto al recuadro contiene esa misma dirección. El teléfono y el ordenador con PLAYDECK deben estar conectados a la misma red Wi-Fi. Si la página sigue vacía, permite el puerto TCP 11411 en el cortafuegos (el mismo puerto que ya utilizan Companion y Web Remote).
Siempre hay solo uno Mando a distancia personalizado. Una caja, un archivo, un código QR. Es a propósito. No estás creando un servicio de alojamiento web. Estás creando el mando a distancia para este programa.
El mando a distancia web integrado permanece en / (la raíz del puerto 11411). «Companion» sigue siendo «Companion». «Overlays» y «Director View» siguen siendo sus propias plantillas. «Custom Remote» no las sustituye.
Utiliza el ejemplo (empieza aquí)
Si nunca has hecho esto, no empieces desde una página en blanco ni desde Web Remote. Empieza por la «Sample». Se trata de un panel de botones diseñado principalmente para el móvil: dos canales, teclas de transporte grandes, «siguiente clip» y «siguiente bloque» en los mismos modos que utiliza Companion (Cue, Play, Cue+Play, Fade). Muestra el nombre del clip, transcurrido, restante, y bloque restante. Los clips y bloques infinitos se muestran como ∞ (a veces ∞ más la duración del bucle). Ese es el mismo texto que PLAYDECK muestra en la barra de progreso. No inventamos una cuenta atrás falsa.
- Ajustes → Mando a distancia → Mando a distancia personalizado.
- Haz clic Cargar muestra.
- Haz clic Guardar y abrir un mando a distancia personalizado.
- Escanea el código QR con la cámara de tu móvil o abre la dirección en el navegador del móvil.
Deberías poder avanzar rápidamente, reproducir, pausar, detener, volver al principio de la lista de reproducción y avanzar clip a clip o bloque a bloque, sin tener que leer primero una lista de comandos.
Ese «Sample» es también el archivo que se le entrega a la IA. Ya contiene el único contrato técnico que importa: una etiqueta de script y los comandos de PLAYDECK escritos en los botones.
Dejemos que la IA lo cambie
Copia todo lo que hay en el cuadro de HTML. Pégalo en ChatGPT (o en Gemini o Claude). Explica para qué sirve el control remoto, no qué biblioteca de JavaScript hay que utilizar.
Ten esto en cuenta en cada indicación:
No te salgas de la fila <script src="/playdeck-remote.js"></script>. No abras tu propio WebSocket. No modifiques el archivo playdeck-remote.js. data-cmd Es un comando PLAYDECK de la lista de comandos. data-bind muestra el estado en tiempo real.
A continuación, añade el trabajo, por ejemplo:
Jefe de planta, solo Canal 1
Que este sea el iPad del jefe de pista. Solo el canal 1. Tiempo restante: mucho. Tres botones: REPRODUCIR, PAUSA, REPRODUCIR EL SIGUIENTE CLIP. Fondo oscuro, sin bordes dorados, botones grandes.
Rediseña la página, pero mantén los botones
Mantén todos los botones y comandos actuales. Cambia únicamente los colores, el espaciado y el tipo de letra para que tenga el aspecto de un panel de emisión. El canal que se está reproduciendo debe seguir siendo evidente.
Añade una acción más
Deja la muestra tal y como está. Añade un botón debajo del Canal 1 que envíe startoverlay|1|1. Ponle como nombre «OVERLAY 1».
Pega el código HTML que te devuelve la IA en el cuadro → Guardar y abrir → Vuelve a cargar el teléfono. Si la IA ha eliminado la etiqueta «script», PLAYDECK la vuelve a insertar al guardar. Si la IA ha inventado nombres de botones como desde arriba o siguiente En lugar de ejecutar órdenes reales, esas teclas no harán nada: vuelve a activar la orden «Lista de órdenes» data-cmd.
Puedes pegar en el cuadro con Ctrl+V. No hay ningún botón específico de «Pegar». Selecciona «Cargar ejemplo» o «Cargar desde web remota», sustituye el contenido del cuadro y guarda. Si escribes en el cuadro sin guardar ni abrir, el teléfono no se actualizará.
Comandos y estado en tiempo real
El script auxiliar /playdeck-remote.js solo utiliza WebSocket. No hay que copiar ese archivo en la IA. Tampoco hay que reescribirlo. El HTML es el único archivo de la conversación.
Un botón es un comando de PLAYDECK, de la misma familia que la que utiliza el comando personalizado de Companion:
El texto en directo es data-bind además canal de datos:
<div data-bind="channelName" data-channel="1"></div>
<div data-bind="clipName" data-channel="1"></div>
<div data-bind="elapsed" data-channel="1"></div>
<div data-bind="remain" data-channel="1"></div>
<div data-bind="blockRemain" data-channel="1"></div>
<div data-bind="blockName" data-channel="1"></div>
«Transcurrido» y «restante» se refieren a la duración del clip. «Bloque restante» se refiere al bloque. «Infinito» se muestra como ∞.
La lista completa de comandos se encuentra en PLAYDECK: Menú principal → Documentación. Si puedes enviarlo desde Companion como un comando personalizado, puedes añadirlo a data-cmd.
Si una página necesita una lógica que los atributos no pueden proporcionar (un contador de visitas, una tabla de resumen), ese código JavaScript adicional debe ir en el mismo archivo HTML. Utiliza PlaydeckRemote.send('play|1') y PlaydeckRemote.onStatus(...). Sigue siendo un solo archivo, sigue sin haber un segundo WebSocket.
Utilizando Web Remote como base
El «Sample» es la vía que mejor funciona con la IA: pocos botones y poco código.
A veces te apetece de verdad El mando a distancia web de Nick — la lista de clips, las barras de progreso, las pestañas de canales — pero en naranja en lugar de gris, o un reloj más grande, o pestañas ocultas. A continuación:
- Mando a distancia personalizado → Cargar Web Remote → Guardar y abrir.
- Ahora tienes una copia del Web Remote integrado en
/personalizado. El Web Remote original en/no ha cambiado. - Copia ese código HTML en la IA siguiendo una regla estricta:
Esta página es PLAYDECK Web Remote. Modifica únicamente el CSS y las etiquetas. No reescribas el código JavaScript que genera la lista de reproducción, las barras de progreso ni las pestañas de canales. Mantén <script src="/playdeck-remote.js"></script>.
Si la IA “simplifica” ese código JavaScript, la lista de clips suele dejar de funcionar. Vuelve a cargar Web Remote y vuelve a intentarlo con una solicitud más sencilla (solo colores).
Nunca le digas a la gente que edite webremote.html en el disco y guardar una copia de seguridad para la próxima reinstalación. Para eso sirve Custom Remote.
Si algo no funciona
Página en blanco del teléfono. ¿Es la misma red Wi-Fi que la del ordenador PLAYDECK? ¿Está permitido el puerto TCP 11411? Prueba primero a guardar y abrir el archivo en el ordenador. La dirección es http://IP:11411/custom — ni https, ni otro puerto.
Los botones no hacen nada. La etiqueta «script» debe mantenerse. data-cmd debe ser un comando válido (reproducir|1, no reproducir). Actualiza la página después de guardar y abrir.
Tiempos bloqueados o lista desactualizada. Actualiza la página del teléfono. Si se trata de una copia de Web Remote, espera unos segundos: esa página actualiza los datos de la lista de reproducción a intervalos cortos.
∞ en lugar de un reloj. El clip o bloque tiene una duración infinita (en directo, en bucle, por reloj). PLAYDECK muestra lo mismo.
Quería cambiar el Web Remote habitual. Lo has hecho: «Cargar Web Remote» es esa página, que funciona como «Custom Remote». Deja / para todos aquellos que sigan prefiriendo la interfaz de usuario predeterminada.
Companion / Plataforma Stream. Sigue utilizando Companion para el hardware. Custom Remote es una aplicación HTML para el móvil o la tableta, no un sustituto del módulo.
