Jugar Tener un video en su sitio web puede mejorar enormemente su tasa de conversión. Ya sea que el objetivo sea que los usuarios se registren para su aplicación web o simplemente para que los usuarios se comuniquen con usted a través de un formulario web, un video mejora la probabilidad de que esto suceda.

Solo necesita ir a la página de inicio de cualquier nuevo inicio basado en Internet, y verá un video incrustado con un llamado a la acción muy grande que le invita a reproducir su introducción de video de dos o tres minutos.

Los videos que muestran aplicaciones web o servicios basados ​​en la web a menudo se llaman screencasts porque generalmente capturan eventos en el sitio web de la compañía. Estas capturas de pantalla pueden resumir en solo dos minutos lo que de lo contrario ocuparía muchas páginas para explicar, por lo que constituyen poderosas incorporaciones a los sitios web.

¿Es fácil hacer un screencast? ¿Cuánto cuesta y qué herramientas se requieren? Respondamos estas preguntas.

Hacer su propio Screencast

Supongamos que tiene una aplicación web o servicio web para promocionar. Desea crear un screencast para demostrar lo que hace. A continuación hay algunos consejos para comenzar.

Planificación

Como con cualquier cosa, la planificación es esencial. Entonces, antes de hacer cualquier otra cosa, planifique su screencast con mucho cuidado . Considera las siguientes preguntas:

  • ¿Qué mensaje general quieres que transmita el video?
  • ¿Cuánto tiempo debería ser el video?
  • ¿El video debería ser una visión general rápida y "contundente" de su producto o un screencast informativo más largo, detallado?
  • ¿Quieres que el video sea personal, con una voz en off amigable, o prefieres quedarte con la música y los títulos?

Los tutoriales a menudo toman la forma de un screencast informal. Los screencasts generalmente no tienen guiones, pero siguen un guión gráfico básico. Las ventajas de esto son que su producto será presentado de manera amigable y estos screencasts pueden ser rápidos de producir. También son más informativos e instructivos para mostrar cómo funciona un producto.

Las desventajas son que pueden parecer poco profesionales y pueden ser bastante largas y menos atractivas para los visitantes. Por lo tanto, una vez más, la planificación de la ubicación de su video (por ejemplo, la sección de ayuda o la página principal) y el mensaje que desea transmitir lo ayudarán a decidir qué enfoque tomar.

Supongamos que desea realizar un screencast corto, con guiones y bien editado.

El guión gráfico

Bloc

Después de que hayas reflexionado sobre la sensación general del video, saca tu libreta y bolígrafo de confianza y haz un boceto de un guión gráfico. Un guión gráfico es una representación aproximada del screencast y se puede utilizar como una línea de tiempo general de escenas. Cada escena abordaría un aspecto diferente de su producto. Por ejemplo:

    • Introducción y resumen de su servicio;
    • Las características clave o puntos de venta únicos;
    • Testimonios de clientes;
    • Comparación de planes de precios o incluso una comparación con productos competidores;
    • Resumen final , con logo y lema.

      Si tiene mucho que cubrir en su screencast, puede valer la pena dividir cada escena en sub-escenas, para permitir más detalles. Cuantos más detalles tenga en sus guiones gráficos, más fácil será la etapa de edición.

      Planifica cada escena y subescena del video, y debajo escribe las viñetas de lo que vas a cubrir. Los puntos de viñetas podrían incluir ejemplos de partes de la aplicación web en las que desea que los usuarios hagan clic, frases específicas que puede usar en la voz en off y cualquier efecto de video o transición que requiera.

      Su guión gráfico lo ayudará a mantenerse organizado durante todo el proceso, y si alguna vez se pierde mientras produce el video, el guión gráfico le ayudará a volver al buen camino.


      The Voiceover Script

      Si no planeas tener una voz en off (aunque ciertamente te ayudaría), puedes omitir este paso.

      Una vez que haya esbozado su guión gráfico, puede comenzar a escribir su guión. En otra hoja de papel, escriba los encabezados de cada escena y luego guíe cada escena según los puntos que escribió anteriormente.

      Asegúrese de dejar espacio para los cambios, ya que probablemente quiera ajustar el script cuando llegue a grabar la voz en off.


      El software correcto

      El siguiente paso es grabar y producir el video. Necesitarás las siguientes herramientas.


      Software de captura de pantalla

      Existen muchas aplicaciones de captura de pantalla, algunas de las cuales son gratuitas y de código abierto, otras tiene que pagarlas.

      Screenium , disponible en Synium, es una aplicación basada en Mac OS X que es fácil de usar y contiene muchas funciones. El software cuesta $ 29.00 y se puede descargar en línea.

      Screenium


      Jing es una herramienta gratuita basada en web que le permite capturar eventos de pantalla y compartirlos en la web. Una versión totalmente equipada de PC o Mac está disponible por $ 14.95 por año.

      JingProject


      Otras aplicaciones incluyen open-source CamStudio , Yo te enseño para Mac y Adobe Cautivar .


      Software de edición de películas

      No necesita una gran cantidad de características para editar screencasts. Los paquetes de edición simples que vienen incluidos en su sistema operativo por lo general son suficientes.

      Si tienes una Mac, entonces no busques más que iMovie. De lo contrario, podría usar cualquier aplicación de edición de video digital como Premier Pro, Final Cut o incluso Windows Movie Maker.

      Algunas funciones de edición útiles son:

      • Transiciones (o "toallitas") entre escenas;
      • Exportar a formatos web;
      • Cambiando la velocidad de los clips;
      • Grabación de voces en off en la aplicación.

      Las versiones recientes de iMovie (versión 8+) tienen las características anteriores.


      Música de fondo

      Su screencast necesita un alto nivel de participación del usuario . La música puede ayudar a cumplir eso, especialmente si es relevante para el screencast. Sabrá el estilo de música para usar en función de su público.

      Asegúrate de tener el derecho legal de usar la música que elijas. Algunos recursos en línea útiles ofrecen música de fondo sin derechos (generalmente clásica), y algunos venden discos compactos de música de fondo que podrían ser apropiados; revisa Pistas únicas y Música libre de derechos .

      La música es, por supuesto, completamente opcional, ya que puedes involucrar a los usuarios de otras maneras.

      Armado con su plan general, guión gráfico, secuencia de comandos de voz en off y software, ahora puede comenzar a grabar el video.


      Grabando el video

      A los efectos de este artículo, asumiremos que está utilizando una aplicación de captura de escritorio como Screenium e iMovie para editarla.

      Comience por capturar las escenas en el orden de su guión gráfico. Debido a que editarás el video más tarde, puedes continuar grabando hasta que obtengas la toma perfecta.

      Capturar
      • Captura parte de tu pantalla , no toda la pantalla. Esto evitará que el video se sature (por ejemplo, en el Dock o en la barra de tareas) y no tendrá que recortar el video más adelante.
      • Desea acciones suaves, claras y precisas durante la grabación. Mantenga el movimiento del mouse al mínimo y asegúrese de que los clics de su mouse sean obvios. Su aplicación de grabación podría tener una función en la que los clics del mouse activen una ayuda visual, que puede ser útil.
      • Mantenga la secuencia de comandos de voz en off delante de usted e imagine la secuencia de comandos que se está pronunciando mientras graba las acciones del mouse. Esto ayudará con el tiempo cuando termine de editar más tarde.
      • Haga coincidir el nombre del archivo para cada clip con el nombre de la escena correspondiente, para que sepa a dónde va el clip cuando está editando (por ejemplo, 1. Introducción ).
      • Permita un espacio al principio y al final de sus acciones registradas. Esto ayudará cuando recortes los clips y con las transiciones (por ejemplo, desvaneciendo un clip en el siguiente).


      Editando el video

      Edición Una vez que tenga todos los clips grabados para cada escena, puede pasar al bit de diversión, que es la edición.

      Con la aplicación de edición de películas, importe todos los clips en su biblioteca y colóquelos en el orden correcto (si guardó los clips con nombres de archivo secuenciales, entonces ya deberían estar en el orden correcto).

      El siguiente paso es recortar sus videos para que el momento sea el correcto para la voz en off, y luego colocarlos en la línea de tiempo.

      La mejor manera de obtener el tiempo correcto es comenzar la reproducción y leer el guión de esa escena; entonces sabrá si agregar uno o dos segundos al principio o al final del clip. No deje demasiado espacio vacío porque el video se ejecutará mucho y perderá el compromiso del usuario.

      Mantenga el video fluyendo y asegúrese de que siempre haya algo para mirar o escuchar. Para escenas más complicadas, es posible que desee dejar un espacio un poco más largo al final antes de continuar, para permitir a los usuarios absorber lo que acaban de ver.

      Otro truco es agregar transiciones entre escenas, que logran dos cosas. En primer lugar, simplemente se ven geniales. En segundo lugar, combinan escenas que no habías planeado unirte. Por ejemplo, puede tener dos escenas contiguas que muestren la misma página de su sitio web, pero la ubicación del mouse salta abruptamente de un clip al otro.

      Una transición podría difuminar el movimiento y hacer que el corte se vea sin problemas.

      Finalmente, muestre la marca de su empresa al comienzo y al final del screencast. Simplemente importe un JPG de alta resolución de su logotipo en la película. Algunos editores de películas (como iMovie) tienen un efecto de imagen automática llamado "Ken Burns", que amplía o aleja sutilmente una imagen. Hace que tu película se vea más profesional de lo que sería con un logotipo estático simplemente sentado allí en el medio del encuadre. "Sutil" es la palabra clave, sin embargo: asegúrese de que todos sus efectos sean sutiles; exagere y corre el riesgo de parecer poco profesional.


      La voz en off

      Una voz en off no es esencial. Algunos videos se salgan con la suya usando solo superposiciones de títulos para resaltar las características principales. Pero una voz humana involucra mejor a los usuarios y les hace sentir que están tratando con un producto real hecho por una compañía real. Además, una voz en off le permite comunicar mucha más información sobre su producto o servicio, ya que los usuarios utilizarán tanto sus oídos como sus ojos.

      Para hacer una voz en off, simplemente conecte un micrófono de buena calidad y grabe a alguien que tenga una buena voz leyendo su secuencia de comandos en cada escena. Grabar cada escena individualmente es mejor porque luego puedes mover el clip de audio al lugar correcto después de cada toma y obtener el tiempo perfecto. Asegúrese de que su voz en off se lea clara, lentamente y con una sonrisa para que suene amistoso.


      Exportación y carga del video

      Una vez que haya terminado, exporte el video y tome una taza de café. Muchas aplicaciones de edición de video, incluyendo iMovie, tienen una función de "Exportar a la Web"; por lo que simplemente puede elegir el formato para exportar (por ejemplo, iPhone o YouTube). Elija de calidad media a alta, con un ancho no inferior a 600 píxeles.

      Cuando sube su video al host web, se someterá a una mayor compresión: y lo que ingresa es lo que obtiene . Si inserta un archivo de gran tamaño y alta calidad, el video resultante en el sitio web se verá mucho mejor que si hubiera subido un video muy comprimido a un tamaño inferior.

      Una vez que haya subido el video, la empresa de alojamiento debe enviarle una notificación por correo electrónico cuando haya terminado de codificarse. En este punto, ya está casi listo para poner el código de incrustación en su sitio web. Es posible que desee personalizar el reproductor primero; por ejemplo, al hacer coincidir el color del botón "Reproducir" con su marca y ajustar el tamaño del reproductor.

      Guarde el HTML actualizado del código de inserción y listo.

      Seguimiento de conversiones de objetivos

      Asegúrese de que un paquete de análisis (como Google Analytics) esté configurado en su sitio web para que pueda ver de dónde provienen los visitantes y realizar un seguimiento de las conversiones de objetivos .

      Si su sitio web ya ejecuta el software de análisis y usted tiene conversiones de objetivos existentes, entonces esta es una oportunidad ideal para ver cómo su nuevo video afecta esas conversiones. Si su sitio web es nuevo, entonces ver qué diferencia hace el video será difícil, pero aún puede hacer un seguimiento de las conversiones de objetivos y utilizar los datos más adelante.

      Establezca un objetivo que siga al usuario desde la página de inicio hasta la página de video (si está en una página separada), todo el camino hasta la página de registro. Después de algunas semanas, revise las estadísticas y analice la conversión de sus objetivos o la tasa de suscripción.

      Y si alguna vez realiza cambios en el video o la página, por ejemplo, moviendo el video a otro lugar en la arquitectura de la información, entonces puede ver si la conversión de su objetivo se ve afectada por estos cambios.

      Ejemplos de buenos usos de Screencasts

      Thounds

      Thounds

      Thounds lo llama a hacer clic en su enlace de "video promocional", que lo lleva a una ventana emergente que contiene el video.

      Thounds

      El video describe claramente el servicio de Thounds en un video guionado, editado y bien producido de dos minutos.


      Bidsketch

      Bidsketch inserta su video de YouTube en la mitad de la página después de una breve explicación de su producto.


      Wistia

      Wistia tiene una llamada grande y obvia para ver su video de 30 segundos. El video está arriba del pliegue y es prominente.


      Comentarios del concepto

      Comentarios del concepto tiene un video en el lado derecho que demuestra claramente su producto. El llamado a la acción, sin embargo, no es terriblemente claro.


      FileShareHQ

      FileShareHQ demuestra claramente su producto en cuatro minutos. El video reside en su página "Tour".


      MakeSomeTime

      MakeSomeTime tiene un video que demuestra su producto en tres minutos. El llamado a la acción está debajo del doblez.


      Proyecto Bubble

      Proyecto Bubble

      Debajo de sus características de producto, Proyecto Bubble tiene un llamado a la acción que se abre como un video emergente. Su video de tres minutos está alojado en Vzaar , entonces el jugador no tiene marca.


      CushyCMS

      CushyCMS

      CushyCMS es un gran ejemplo porque su video está en la mitad superior de la página , tiene un claro llamado a la acción y se abre en una gran ventana emergente que muestra el producto en tres minutos .


      Incapaz

      Incapaz proporciona una clara llamada a la acción a la derecha de la descripción de la aplicación. El video es alojado por Vimeo.


      Consejos para usar video en su sitio web

      • Los videos anteriores mantienen a los visitantes involucrados rara vez por más de cuatro minutos. Una buena duración para un video de demostración es de dos a tres minutos , e idealmente no más de cinco. Algunos sitios web mantienen sus videos tan cortos como 30 segundos, como viste con Wistia.
      • Tenga cuidado donde aloja su video. Algunos proveedores afirman explícitamente que cualquier video cargado en su servicio debe ser para uso no comercial; por lo tanto, si su video muestra un producto comercial, estaría violando sus términos de servicio. Además, algunos proveedores de hosting tardan mucho tiempo en codificar clips, y algunos muestran videos de muy baja calidad. Por lo tanto, si desea un servicio rápido y de alta calidad, es posible que desee considerar el pago de un host premium.
      • Asegúrese de que el video se abra en un tamaño decente , especialmente si tiene una demostración detallada de un producto. Una buena solución es una aplicación Lightbox como Facebox : el usuario hace clic en un botón que activa una ventana emergente en la que se presenta el video grande. Un buen tamaño para el video es de 600 píxeles o más.
      • Un llamado a la acción claro en el doblez aumenta las posibilidades de que los visitantes hagan clic en él. Algunos diseñadores prefieren explicar primero el producto y luego mostrar el video a continuación. Una buena arquitectura de la información es fundamental, especialmente en la página de inicio, así que piense detenidamente en su ubicación.
      • Asegúrese de que el botón "Reproducir" se muestre claramente en el video incrustado en su estado de no reproducción, para que los visitantes lo reconozcan como un video. Si el video está en una ventana emergente, reprodúzcalo automáticamente una vez que se active la ventana emergente.

      Proveedores de alojamiento de video

      A continuación se encuentran solo algunos de los muchos proveedores de alojamiento de videos:

      • Youtube - La elección obvia. Los pros son que es gratis y bien conocido. Las desventajas son que la calidad no es excepcional, y los videos a veces tardan un tiempo en codificarse. Otro inconveniente es su ubicuidad: si está intentando proyectar una imagen profesional y pulida, mostrar un video de YouTube podría no reflejar bien esa estética.
      • Vimeo - Vimeo se hizo muy popular el año pasado. Los pros son que tiene una gran comunidad y un jugador muy agradable. Las desventajas son que sus términos de servicio son bastante estrictos, así que léelos antes de subir cualquier video.
      • Vzaar - Una nueva compañía que ofrece alojamiento de video premium. Los pros son que los videos se codifican rápidamente, el reproductor es bueno y se le permite subir videos comerciales. Otro profesional es que Vzaar no pone su marca en los videos. Las desventajas son que es un servicio pago; y debido a que la compañía es bastante nueva, su proceso de carga tiene errores.
      • Wistia - Como se muestra arriba. Los profesionales son jugadores sin marca, herramientas de codificación rápida y de marketing, como estadísticas y mapas de calor. El inconveniente es la prima más alta para usar el servicio.

      Siempre puede alojar el video en su propio servidor y usar un reproductor como el JW Player de Long Tail Video. Si hace esto, puede que necesite codificar el video en formato FLV.


      Escrito exclusivamente para WDD por Stu Green. Es diseñador web del Reino Unido y gestiona Haloweb , una empresa de diseño de aplicaciones web.

      ¿Tiene un screencast en su sitio web que haya aumentado las conversiones de objetivos? Si es así, infórmenos y explique el proceso detrás de la construcción. Además, si tiene algún consejo sobre cómo producir o incrustar videos, compártalo con la comunidad.