Room Designer

Room Designer te permite preparar la vista que ven las personas al abrir el enlace de tu sala. Organiza el vídeo, los botones de navegación, las notas y el temporizador, y aplica después los colores y el logotipo de tu organización.

Abre Panel > Room Designer. Usa Diseño para la vista de los participantes y Marca para el aspecto del anfitrión y de los participantes.

Horizontal y vertical son diseños independientes. La sala elige el que coincide con la orientación de la pantalla de cada participante.

Inicio rápido: vídeo, botones abajo, sin notas ni sonido

1. Abre Diseño y selecciona Horizontal.
2. Elige el preajuste Presentación. Activa el diseño personalizado, coloca el vídeo encima de los botones y oculta las notas de las diapositivas.
3. En Valores predeterminados de participantes, comprueba que Abrir las notas del orador al entrar está desactivado y activa Iniciar con el audio compartido silenciado.
4. Selecciona Vertical y aplica el mismo preajuste. Ajusta las proporciones para un teléfono en vertical.
5. En la app anfitriona, usa Compartir pantalla global para seleccionar la pantalla, la fuente NDI o el Program de Studio que quieras compartir.
6. Espera a que aparezca Guardado y comparte el enlace habitual de tu sala.
7. Abre el enlace en un segundo dispositivo para comprobar ambas orientaciones y la fuente seleccionada antes de tu evento.

Los nuevos participantes reciben la fuente que les asigna el anfitrión. Designer organiza la vista en torno a esa fuente; no inicia la captura ni anula las asignaciones de fuentes.

El audio compartido y los sonidos de clic son independientes. El valor predeterminado de silencio de Designer controla el audio compartido entrante. Si además quieres silencio cuando alguien hace clic, desactiva los sonidos de clic en los ajustes de sonido de la app anfitriona. Los participantes pueden reactivar el audio compartido después; la reproducción de audio en el navegador puede seguir requiriendo una interacción del usuario. Quien está en directo en Program no oye el audio compartido (le devolvería su propia voz con retraso); el audio vuelve cuando sale de Program.

Planes y dónde se aplican los cambios

La sala usa el diseño guardado por la cuenta propietaria. El plan o la clave de licencia con que se inicia la sala determina qué funciones guardadas aparecen. Por ejemplo, un diseño guardado por una cuenta Studio 8K no activa la marca blanca en una sala iniciada con una clave de un nivel inferior.

El panel Dónde se aplica la marca de la pestaña Marca muestra cuáles de tus planes y claves admiten colores o la marca completa.

Elige un diseño de partida

Un preajuste solo sustituye la disposición de la orientación seleccionada. Presentación también define los valores predeterminados compartidos de participantes, que se aplican a ambas orientaciones. Usa Deshacer si quieres revertir un preajuste.

El selector Escritorio, Tableta y Teléfono cambia las proporciones de la vista previa. Te ayuda a comprobar cómo encaja el mismo diseño basado en porcentajes en distintas pantallas; no crea tres diseños guardados adicionales.

Organiza los elementos

Activa Diseño personalizado, elige Horizontal o Vertical y selecciona un elemento de la lista o del lienzo.

Usa el control del ojo para mostrar u ocultar un elemento. La visibilidad se guarda por separado para horizontal y vertical. Si ocultas ambos botones de navegación, desaparecen los controles de clic grandes, por lo que el editor muestra un aviso.

El logotipo se puede mover y redimensionar de forma independiente en cada orientación. Los usuarios de Studio 4K colocan el logotipo de Cliqer. Los usuarios de Studio 8K pueden sustituirlo en Marca u ocultarlo con el control del ojo.

Mueve con precisión

• Arrastra un cuadro seleccionado para moverlo, o arrastra sus tiradores para cambiar su tamaño.
• Los cuadros se ajustan a los bordes y centros del lienzo y a otros elementos visibles.
• Selecciona un elemento con el teclado usando Tab y después Enter o Space.
• Pulsa una tecla de flecha para mover la selección un 1 % de la ventana.
• Mantén pulsado Shift con una tecla de flecha para moverla un 5 %.
• Pulsa Esc para borrar la selección.

Los cuadros permanecen dentro del lienzo. Cada cuadro móvil tiene un ancho y un alto mínimos del 6 % de la ventana. Las posiciones y los tamaños son porcentajes, de modo que el diseño se adapta al espacio disponible.

Horizontal y vertical

El diseño horizontal se usa cuando la pantalla del espectador es más ancha que alta. El vertical se usa cuando es más alta que ancha. Al girar un teléfono, se cambia entre tus diseños guardados.

Editar una orientación no mueve los elementos de la otra. Revisa ambas antes de compartir una sala, sobre todo cuando un vídeo ancho, unas notas largas o un temporizador puedan competir por el espacio.

Define los valores predeterminados de participantes

Activa Definir valores predeterminados de participantes para elegir las preferencias iniciales de tu sala:

Son preferencias iniciales, no controles bloqueados. Se aplican a una sala con derecho a ellas aunque Diseño personalizado esté desactivado. Editar la geometría o los colores no restablece continuamente las elecciones de un participante. Actualizar los propios valores predeterminados aplica las nuevas preferencias a los participantes conectados.

Los diseños guardados existentes mantienen su comportamiento de preferencias anterior hasta que actives explícitamente los valores predeterminados o elijas el preajuste Presentación.

Coloca y personaliza el temporizador

1. Selecciona Temporizador en la lista de elementos.
2. Activa su control del ojo si está oculto.
3. Arrastra y redimensiona el cuadro del temporizador en el lienzo.
4. Define los colores de Texto normal, Texto de aviso, Texto de tiempo excedido y Fondo.
5. Ajusta la Opacidad del fondo y el Tamaño del texto.
6. Usa Estado de vista previa para revisar los colores normal, de aviso y de tiempo excedido.
7. Cambia de orientación y coloca el temporizador para la otra forma de pantalla.

La vista previa usa tiempos de ejemplo. La sala real muestra la cuenta atrás en directo que ya tiene el anfitrión, incluidos los estados de aviso, tiempo excedido y parpadeo. No crea otro temporizador ni cambia su duración ni sus umbrales de aviso.

El temporizador colocado usa la misma tipografía del navegador que el temporizador estándar de los participantes, con dígitos de ancho fijo. El texto se ajusta a su cuadro; amplía el cuadro si un tamaño de texto grande parece limitado. Restablecer apariencia del temporizador restaura sus colores, su opacidad y su tamaño de texto sin moverlo.

El anfitrión debe tener una cuenta atrás en directo activa y compartida para que el temporizador aparezca en la sala. En un diseño personalizado, ocultar el elemento Temporizador oculta ahí la cuenta atrás; no detiene el temporizador del anfitrión. En la vista integrada o multianfitrión se usa la ubicación estándar del temporizador.

Hazlo con tu marca

Vistas previas ilustrativas con marcas ficticias. Muestran cómo una misma identidad guardada puede trasladarse de la app anfitriona a la vista de los participantes.

Abre Marca en Room Designer, o Ajustes > Marca. Ambas ubicaciones editan los mismos ajustes guardados.

Colores del anfitrión y de los participantes

Colores de la app anfitriona controla la paleta principal y secundaria que usan la app anfitriona de escritorio y el panel. Colores del presentador controla la sala de los participantes remotos.

Mantén los colores del presentador sincronizados con los del anfitrión para lograr una identidad coherente. Desactiva la sincronización para usar una paleta independiente para los participantes, por ejemplo, un puesto de producción oscuro para el operador y controles más luminosos para los ponentes remotos. Cambiar la paleta de los participantes no obliga a cambiar la del anfitrión.

También puedes configurar:

• Degradado del anfitrión y Degradado del presentador de forma independiente.
• Tema del anfitrión: claro, oscuro o el ajuste del dispositivo.
• Tema del presentador: seguir al anfitrión o usar su propio ajuste claro, oscuro o del dispositivo.
• Estilo de insignia: predeterminado, redondeado o cuadrado.

Para que los controles se vean con claridad, elige una pareja de colores principal y secundario con un contraste marcado. Previsualiza tanto los colores sólidos como los degradados, y comprueba tu logotipo sobre fondos claros y oscuros.

Tu icono y tu logotipo

La marca blanca de Studio admite dos recursos de imagen independientes:

Sube archivos JPG, JPEG, PNG o GIF de hasta 2 MB cada uno. Un PNG transparente suele funcionar bien cuando la imagen tiene que colocarse sobre fondos distintos. Subir un icono no sustituye automáticamente el logotipo de los participantes; configura ambos recursos para tener una identidad completa.

Usa Mostrar para ocultar temporalmente un recurso sin perder la imagen subida. En Diseño, mueve y redimensiona el logotipo de la sala por separado para Horizontal y Vertical. Studio 4K puede colocar y dimensionar el logotipo de Cliqer; Studio 8K puede sustituirlo u ocultarlo en cualquiera de las dos orientaciones. Para que aparezca un logotipo de Studio, deben permitirlo tanto el ajuste de visibilidad de Marca como la visibilidad del Logotipo en el diseño activo.

Ejemplos que puedes crear con los mismos controles:

• Una sala corporativa con una paleta azul, el logotipo de la empresa, diapositivas y navegación inferior.
• Una sala de evento con una pareja de colores llamativos, el logotipo del evento, botones grandes y una cuenta atrás visible.
• Una producción para un cliente con una paleta sobria para el anfitrión y una vista de participantes independiente con la marca del cliente.
• Una sala minimalista centrada en el vídeo, con los controles ocultos y, en Studio 8K, también el logotipo oculto.

Los dominios personalizados pueden completar la experiencia de Studio con tu propia dirección de sala. Configúralos por separado en los ajustes de dominio personalizado del panel. Subir un logotipo no los modifica.

Guardar, deshacer y restablecer

Los cambios de diseño se guardan automáticamente tras una breve pausa. La cabecera muestra Guardando y, después, Guardado cuando se ha almacenado el último cambio. No guardado significa que una solicitud ha fallado: tus cambios actuales se mantienen en el editor y Reintentar los vuelve a enviar. Espera a que aparezca Guardado antes de cerrar la página.

Las páginas de sala conectadas reciben los cambios guardados en directo. Cualquier otra pestaña de Designer abierta sigue los cambios guardados. Trata las ediciones durante un evento como cambios en directo en la vista de los participantes.

Deshacer y Rehacer funcionan dentro del historial reciente de cada editor. El historial de Diseño incluye preajustes, posiciones, visibilidad, valores predeterminados de participantes y apariencia del temporizador. Marca tiene su propio historial.

Para restablecer una orientación se pide confirmación. Activar un diseño guardado no restaura los colores de marca antiguos; el diseño y la marca se guardan de forma independiente.

Comparte la sala diseñada

Introduce el código de sala de seis caracteres en Inserta tu sala. Copia el iframe, abre la sala o comparte el enlace que se muestra. El enlace habitual de la sala lleva automáticamente tu diseño guardado y la marca que corresponda.

<iframe
  src="https://cliqer.io/ABC123"
  allow="camera; microphone; fullscreen; autoplay"
  style="border:0;width:100%;aspect-ratio:16/9"
  title="Cliqer room"
></iframe>

Sustituye ABC123 por el código de tu sala activa. Si cambias las proporciones del iframe, comprueba también el diseño vertical en tamaños estrechos.

Selección de fuente y límites de la vista

Elige la fuente de captura, la pantalla, la cámara, la señal NDI, el Program de Studio y la entrada de audio en la app anfitriona. Designer no selecciona ni bloquea una fuente mediante una URL. Consulta Compartir pantalla y codificación de vídeo y Audio al compartir pantalla.

Los cuadros personalizados se aplican a la vista de sala de una sola señal. Una cuadrícula multianfitrión usa su disposición integrada; al seleccionar una señal, vuelve a aplicarse la disposición personalizada. Un enlace con screenonly=true usa la vista dedicada solo de vídeo.

La barra de la sala (conexión, temporizador, Chat, Dibujar, controles de diapositivas y Ajustes del presentador) permanece fija en la esquina superior derecha de un diseño personalizado, tal como la muestra la vista previa, así que mantén el temporizador, los botones y los demás cuadros alejados de esa esquina. Los preajustes ya lo hacen. El chat, los mensajes de conexión y los avisos del sistema conservan sus posiciones integradas. Ocultar un cuadro cambia la vista; no revoca los permisos de un participante ni detiene la fuente del anfitrión.

Solución de problemas

La pestaña Diseño o el control del logotipo están bloqueados

Los diseños personalizados necesitan el complemento Designer en Presenter, Studio HD o Studio 4K, y están incluidos en Studio 8K y Enterprise. Studio 4K puede mover y redimensionar el logotipo de Cliqer. Para sustituir u ocultar las marcas de Cliqer se necesita Studio 8K o superior. Si el editor está disponible pero la sala usa el aspecto predeterminado, comprueba el plan o la clave con que se inició la sala.

Un cambio guardado no aparece

Comprueba Guardado, la propiedad de la sala, el plan o la clave de la sala y la orientación actual del espectador. La geometría personalizada también necesita Diseño personalizado activado. Comprueba si hay una cuadrícula multianfitrión, un enlace con screenonly=true o parámetros de URL que anulen los colores, el tema o el comportamiento del logotipo.

El temporizador se ve en la vista previa pero no en la sala

La vista previa siempre tiene tiempos de ejemplo. La sala real necesita una cuenta atrás en directo del anfitrión. Comprueba el control del ojo del Temporizador en la orientación actual y confirma que el anfitrión está compartiendo una cuenta atrás.

Falta el logotipo

Comprueba que el plan de la sala incluye la marca blanca y, después, el Logotipo subido, su ajuste Mostrar y el control del ojo del Logotipo en la orientación activa. El icono del anfitrión y el logotipo de los participantes son recursos independientes.

El vídeo o las notas están vacíos

El cuadro de vídeo necesita una fuente compartida por el anfitrión. Las notas necesitan contenido para la diapositiva actual, un control de notas del participante abierto y un elemento Notas visible en un diseño personalizado.

Un cuadro queda debajo de la barra de la sala

La barra de la sala flota sobre la esquina superior derecha de todos los diseños personalizados. En la vista previa, mueve o reduce el cuadro hasta que la barra deje de taparlo, en ambas orientaciones. El vídeo puede quedar debajo de la barra; un temporizador, un logotipo o un botón no deberían.

Los participantes no pueden hacer clic

Muestra al menos un botón de navegación en la orientación activa. Usa su control del ojo o restablece esa orientación.

Guías relacionadas

• Personalización de la URL del presentador
• Configuración multianfitrión
• Compartir pantalla y codificación de vídeo
• Audio al compartir pantalla