Primeros pasos con la interactividad

En este tema, aprenderá cómo comenzar con Brightcove Interactividad.

El complemento HapYak para Brightcove Player le permite al jugador aprovechar las funciones proporcionadas por Brightcove Interactividad. Cuando se agregan interacciones a un proyecto de interactividad de Brightcove, aparecerán automáticamente en el video correspondiente. Esto elimina la necesidad de copiar y publicar el código incrustado en Brightcove Interactivity Studio.

Antes de empezar

Antes de que pueda comenzar con la interactividad, debe tener un Brightcove Player configurado con el complemento HapYak. Agregar el complemento HapYak a un Brightcove Player permitirá que se muestre la interactividad dentro del reproductor durante la reproducción de video. El complemento HapYak puede coexistir con otros complementos de jugador. Para conocer los pasos completos para crear un reproductor habilitado para HapYak, consulte Configuración de un Brightcove Player con el complemento HapYak.

Creación de un proyecto de interactividad de Brightcove

Cuando se reproduce un video dentro de un Brightcove Player habilitado para HapYak, sucede lo siguiente:

  • El ID de video de Brightcove, el título, las etiquetas y los campos personalizados se pasan a Brightcove Interactividad
  • Brightcove Interactividad intenta buscar la ID de video dentro de su grupo
  • Si no se encuentra ningún registro coincidente , luego Brightcove Interactividad crea un proyecto con los datos que se enviaron
  • Brightcove Interactividad también configurará las propiedades del proyecto para indicar que se "creó automáticamente":
    • El valor is_published se establecerá en TRUE
    • Se agregará una etiqueta con el valor en vivo

Los siguientes pasos crearán automáticamente un proyecto de interactividad de Brightcove:

  1. Inicie sesión en Video Cloud Studio.
  2. Abre el Medios de comunicación módulo.
  3. Seleccione un video para publicar marcando la casilla junto a la miniatura del video.
  4. Haz clic en Publicar e insertar... ˇ > Publicar en la web.
  5. Seleccione el reproductor con el complemento HapYak.
  6. Haga clic en el enlace de vista previa para abrir una vista previa en una nueva pestaña del navegador.
  7. Reproduzca el video de vista previa (el video solo necesita reproducirse durante unos segundos). Esto creará automáticamente un proyecto en Brightcove Interactividad.
  8. Inicie sesión en Brightcove Interaction Studio (https://www.hapyak.com/login).
  9. En la barra de navegación izquierda, haga clic en Administrar.
  10. Aparecerá una lista de proyectos. Confirma que el video que acabas de publicar aparece en la lista de proyectos.

Adición de una superposición de texto

En este tema, se agregará una superposición de texto simple solo para validar que la interactividad se pueda ver dentro de un Brightcove Player.

  1. En la IU de interactividad de Brightcove, haga clic en el proyecto para abrirlo.
  2. En la barra de herramientas inferior, haga clic en el botón de superposición de texto.
  3. Haga clic en el enlace Editor en el menú.
  4. Ingrese un texto de muestra para la superposición y haga clic en ENTREGAR.
  5. Hacer clic Hecho.

Para obtener información detallada sobre cómo agregar superposiciones de texto e imágenes a los videos, consulte:

Vista previa y generación de código de inserción para un video

Una vez que se ha agregado una interacción a un proyecto de interactividad de Brightcove, obtenga una vista previa del video para asegurarse de que la interactividad funcione como se espera. Cuando se carga un video en un Brightcove Player habilitado para HapYak, sucede lo siguiente:

  1. El ID de video de Brightcove, el título, las etiquetas y los campos personalizados se envían a Brightcove Interactividad.
  2. Brightcove Interaction intenta buscar la ID de video dentro de su grupo de Brightcove Interaction.
  3. Si se encuentra un registro coincidente , luego Brightcove Interactividad filtra al registro que tiene el Esta publicado valor establecido en VERDADERO. El proyecto con el ID de video coincidente y el Esta publicado valor establecido en VERDADERO será mostrado.
  4. Si se encuentra más de un registro coincidente , luego Brightcove Interactividad filtra al registro modificado más recientemente que tiene el Esta publicado valor establecido en VERDADERO. El proyecto modificado más recientemente con el ID de video coincidente y is_published

Siga estos pasos para obtener una vista previa y generar el código de inserción para el video:

  1. Abre el Medios de comunicación módulo.
  2. Seleccione el vídeo que utilizó para crear el proyecto de interactividad de Brightcove y publíquelo.
  3. En el Seleccionar jugador lista desplegable, seleccione el reproductor habilitado para HapYak.
  4. Haga clic en el URL debajo del reproductor de vista previa para abrirlo en una nueva pestaña del navegador. Confirme que aparece la interacción.
  5. Copie el código de inserción y péguelo en su página web.

Además, en el código de inserción, DEBE agregar juegos en línea dentro del <video-js> etiqueta. Por favor, consulte los ejemplos a continuación:

Estándar


<div>
estilo="posición: relativo; pantalla: bloque; ancho máximo: 960px;">
<div
estilo = "relleno superior: 56,25%;">
<iframe
src="//jugadores.brightcove.net/1486906377/dunFq3vI6_default/index.html"
juega en línea
permitir pantalla completa=""
allow="medios-cifrados"
estilo="posición: absoluta; arriba: 0px; derecha: 0px; abajo: 0px; izquierda: 0px; ancho: 100%; alto: 100%;"></iframe>
</div>
</div>

Avanzado


<div style="max-width: 960px;">
<video-js juega en línea
cuenta-datos="1486906377"
reproductor de datos="dunFq3vI6"
data-embed="predeterminado"
controles=""
data-application-id=""
clase = "vjs-fluido"
estilo = "relleno superior: 56,25%;">
</video-js>
</div>
<guion
src="//jugadores.brightcove.net/1486906377/dunFq3vI6_default/index.min.js">
</script>

Notas

  1. Las anotaciones agregadas a un proyecto a nivel de proyecto (es decir, no a través de plantillas) deberían aparecer en aproximadamente 90 segundos. Las anotaciones añadidas a través de plantillas pueden tardar hasta dos horas en aparecer.
  2. No cree proyectos de Brightcove manualmente en Brightcove Interactivity Studio. El complemento hará esto automáticamente.
  3. La carga de nuevos archivos fuente de video en Video Cloud conservará la identificación del video y la conexión a Brightcove Interactividad.
  4. No utilice el código EMBED generado a partir de las herramientas de interactividad de Brightcove cuando utilice el complemento. En su lugar, publique sus videos según el flujo de trabajo normal de Brightcove.
  5. Los proyectos generados por el flujo de trabajo se pueden eliminar con Brightcove Interactivity Studio. Tenga en cuenta que las cargas posteriores del video correspondiente a través de Brightcove Player generarán automáticamente un proyecto separado basado en la misma fuente de video en el portal.