PAC1 – Conceptos básicos de vídeo y audio. Formatos de vídeo.

  1. Diferencias entre formato y códec:

    Un formato de archivo es como un tipo de contenedor, y dentro de este contenedor hay datos que se han comprimido con un códec específico. Un contenedor puede tener diferentes códecs de audio y vídeo.Un códec podríamos decir que es un dispositivo o software que se usa para comprimir o descomprimir un archivo digital. El códec puede hacer la función de codificar y decodificar un archivo.Por ejemplo, podemos tener un archivo de vídeo en diferentes formatos, como pueden ser MPEG, AVI, MOV, DV,…; y estos formatos pueden estar codificados con diferentes códecs, como pueden ser H.323, H.264, H.265, VP8,…

    En función del uso que vayamos a dar al archivo final, emplearemos un formato y unos códecs concretos.

    Alguna vez nos hemos encontrado con que hemos podido reproducir un vídeo de un formato concreto y hemos tenido problemas para reproducir otro del mismo formato debido a que en nuestro ordenador no teníamos instalados los códecs necesarios para poder descodificar el contenido.

  2. MPEG:

    Los archivos MPEG utiliza una compresión con pérdida de información pero suele ser algo impercetible para nuestros ojos. Es uno de los formatos más utilizados en los últimos años que han ofrecido muy buena calidad con un volumen de compresión bastante alto.
    El funcionamiento de los algoritmos que se usan para comprimir estos archivos se hace en pequeños paquetes que pueden ser fácilmente transmitidos y posteriormente ser descomprimidos.

    Los principales códecs más utilizados son:

    · MPEG-1: Es un estándar de compresión de audio y vídeo. Ofrece un vídeo de resolución de 352×240 a 30fps. Tiene una calidad algo inferior a la que nos da los videos tipo VCR.

    · MPEG-2: Es un estándar para audio y video con calidad de televisión, ofreciendo resoluciones desde 720×480 y 1280×720 a 60fps con calidad CD de audio. Se usa para señales de TV por satélite, TV digital.

    · MPEG-4: Estándar de compresión de gráficos y video basados en sus antecesores MPEG1 y 2. Son archivos más pequeños y se emplean para transmitir video, imágenes, texto, capas de animación,… a través de anchos de banda no muy grandes.

    · MPEG-7 y MPEG-21: son menos conocidos que los mencionados anteriormente; el primero proporciona un sistema de herramientas para contenido multimedia aunque no tiene un uso específico; el segundo tiene como objetivo el fomento del envío y consumo de contenido multimedia para los usuarios pero respetando los derechos de autor.

  3. H.264:

    Este códec de vídeo fue creado especialmente para proporcionar unos vídeos de alta calidad manteniendo unas tasas de bits reducidas y tiene la capacidad de grabar, gestionar la compresión y distribución del vídeo. Se ha usado en grabadoras de vídeo AVCHD, en reproductores de HD DVD y Blu-ray.

    El componente H.264 es un códec de compresión de vídeo y necesita un contenedor para almacenar el archivo de vídeo. Debido a su alta calidad de codificación y descodificación, se usa para transmisión de vídeo en tiempo real con unos tamaños de archivo hasta 3 veces más pequeños que los que se consiguen con códecs tipo MPEG-2. Como punto negativo podemos decir que este tipo de códec necesita más tiempo para codificar los archivos y que no es un códec libre.

    Ver video códec H.264

  4. H.265:

    El códec H.265 es  un estándar de compresión de vídeo más eficiente que el H.264 que soporta hasta vídeos 8K y 300fps y es compatible con reproductores como VLC, Media Player Classic, y el navegador Chrome que ya permite su codificación y descodificación.

    Si comparamos el códec H.264 con el H.265 podemos decir como ejemplo que un vídeo de casi 1h en Full HD con H.264 puede pesar unos 2,5GB y el mismo vídeo codificado con H.265 puede pesar 1GB sin apreciar una gran pérdida de calidad.

    Basándome en los resultados obtenidos en ambos archivos, utilizando los mismos parámetros de compresión, la diferencia más notable es el peso del archivo codificado con H.265, de 37MB del archivo H.264 a 23,4MB con el H.265. Sorprendentemente, la calidad visual es prácticamente idéntica en ambos casos, algo que resulta una mejora muy importante a la hora de la emisión de contenidos online.

    Captura de pantalla 2018-03-13 a las 23.35.57

    Captura de pantalla 2018-03-13 a las 23.36.12

    Ver video códec H.265


  5. VP8:

    El códec VP8 es muy parecido al H.264, ofreciendo prácticamente la misma calidad excepto que cuando trabaja con vídeos de más resolución (tipo HD), su rendimiento es inferior que el del códec H.264.
    Aunque si lo miramos desde otro punto de vista, este rendimiento algo inferior puede quedar compensado si tenemos en cuenta que el códec VP8 es libre.
    Este tipo de códecs se utiliza para la retransmisión de vídeo online aunque este en concreto no ha tenido muy buena aceptación del público debido a que tenían muchas cosas por pulir para que fuese más eficiente.

    Ver video códec VP8

  6. VP9:

    El códec VP9 viene a ser muy parecido al H.265, ha sido desarrollado por Google como sustituto al VP8 y soporta contenido de hasta 8K. Este códec consigue reducir a la mitad el tamaño del vídeo y hace que la carga de estos en plataformas como Youtube, sea mucho más rápida aunque la conexión del usuario no sea muy buena, ya que cuenta con el modo de bitrate adaptable que hace que independientemente de la conexión del usuario, hace que se adapte ofreciendo la mejor calidad posible durante la reproducción del archivo.
    Aunque el códec H.265 ofrece una calidad algo superior, la descodificación del VP9 es más estricta permitiendo más estabilidad en los vídeos en streaming.

    Ver video códec VP9

  7. Conclusión:

    En estos últimos años, el mundo digital y los modos de retransmisión de contenido han evolucionado de manera exponencial. Cada vez son más los usuarios que hacen uso de dispositivos móviles, tabletas, ordenadores, televisión digital,… para consumir contenido. Esto ha hecho que la importancia de ofrecer una calidad óptima en un tiempo razonable sea un punto muy importante.
    Los códecs más utilizados para la emisión de vídeos online y que están a la cabeza son el H.265 y el VP9 aunque por motivos de licencias y del tipo de codificación empleada, el que va ganando terreno es el VP9. Tanto Netflix, Youtube, Vimeo, Amazon Prime,… hacen uso de él mientras que el VP10 se presenta como actualización al VP9.
    Lo mejor que tienen este tipo de códecs, además de la gran compresión y la calidad que ofrecen, es el bitrate se adapta a la conexión que tiene cada usuario dando una calidad de vídeo acorde a ésta.

PAC3 – Bibliografía

· Comerma Paré, Toni. Módulo 3. Conceptos generales y visión de los elementos.

· Comerma Paré, Toni. Módulo 4. Comercialización

· Herramientas de diseño. [web] [Fecha de acceso 15 Abril].

· Roams. Amazon Prime Video: ¿Qué dispositivos son compatibles?. [web] [Fecha de acceso 15 Abril].

· Prime Video. Funcionalidades y dispositivos compatibles. [web] [Fecha de acceso 17 – 27 Abril].

· Prime Video. Calidad y formatos de Prime Video. [web] [Fecha de acceso17 – 27 Abril].

· Bloggin Zenith. Los otros Netflix: estos son y así funcionan. [web] [Fecha de acceso17 – 27 Abril].

· Adslzone. Amazon Prime Video ahora usa HEVC y su calidad es peor que antes. [web] [Fecha de acceso 17 – 27 Abril].

· Adslzone. El códec H.266 o FVC ya está en desarrollo… [web] [Fecha de acceso17 – 27 Abril].

· Cyberclick. ¿Qué es el video marketing? Tendencias y beneficios en redes sociales. [web] [Fecha de acceso 17 – 27 Abril].

· PCMag. 9 Amazon Prime Video Features You May Not Know. [web] [Fecha de acceso17 – 27 Abril].

· PCMag. Amazon Video. [web] [Fecha de acceso17 – 27 Abril].

· Solocerteza. Comparativa: Netflix, HBO y Amazon Prime Vídeo. [web] [Fecha de acceso 17 – 27 Abril].

· Fortuna. Amazon has doubled its share of streaming… [web] [Fecha de acceso 17 – 27 Abril].

· Similarweb. Primevideo.com Analytics. [web] [Fecha de acceso 25 – 27 Abril].

· SMEJoinUp. Video Marketing Benefits. [web] [Fecha de acceso 25 – 27 Abril].

· The Travel Vertical. Video Leads the 2018 Influencer Marketing Trends. [web] [Fecha de acceso 25 – 27 Abril].

· Imágenes Amazon. [web] [Fecha de acceso 17 – 27 Abril].

· Imagen fondo. [img] [Fecha de acceso 18 Abril].

· Imágenes dispositivos compatibles. [img] [Fecha de acceso 18 Abril].

· Imagen Ravenue model. [img] [Fecha de acceso 25 Abril].

· Infografía en datos. [img] [Fecha de acceso 25 Abril].

 

PAC2 – Bibliografía

· Ribelles García, Alex. Módulo 1. Conceptos básicos de vídeo y audio. Introducción

· Ribelles García, Alex. Módulo 2. Plataformas de publicación y distribución de audio y video.

· Valdez Montero, Felipe David. Vídeo streaming de alta calidad sobre plataformas de distribución de contenidos. [pdf] [Fecha de acceso 15 – 30 Marzo].

 Wiki. Aplicacions online de disseny gràfic. [web] [Fecha de acceso 20 – 22 Marzo].

· ITE – Educación. ¿Qué es el streaming?. [web] [Fecha de acceso 22 Marzo].

· American Dominios. Protocolos de streaming de medios de comunicación. [web] [Fecha de acceso 22 Marzo].

· UPM. Videostreaming. [pdf] [Fecha de acceso 23 Marzo]

· DataCast. Which Video Streaming Protocol Should You Use?. [web] [Fecha de acceso 23 Marzo].

· Gary McGath. Basics of streaming protocols. [web] [Fecha de acceso 23 Marzo].

· Webopedia. Chunk. [web] [Fecha de acceso 23 Marzo].

· Techopedia. Video Buffer. [web] [Fecha de acceso 23 Marzo].

· Techopedia. Internet Streaming Media Alliance (ISMA). [web] [Fecha de acceso 23 Marzo].

· Wikipedia. ISO base media file format. [web] [Fecha de acceso 23 Marzo].

· MPEG. ISO base media file format. [web] [Fecha de acceso 23 Marzo].

· Techterms. Bitrate. [web] [Fecha de acceso 23 Marzo].

· Techopedia. BitRate. [web] [Fecha de acceso 23 Marzo].

· Encoding. Understanding bitrates in video files. [web] [Fecha de acceso 23 Marzo].

· Vision-systems. Understanding Video Latency. [pdf] [Fecha de acceso 24 Marzo].

· WhatIs. Latency. [web] [Fecha de acceso 24 Marzo].

· Adobe. Understanding the MPEG-4 movie atom. [web] [Fecha de acceso 24 – 25 Marzo].

· Slant. What are the best software tools for live streaming?. [web] [Fecha de acceso 25 – 28 Marzo].

· Videocontent. Programas para hacer streaming. [web] [Fecha de acceso 25 – 28 Marzo].

· Capterra. Top 5 free tools to LiveStream your event online. [web] [Fecha de acceso 25 – 28 Marzo].

· LinkedIn. 10 Best Live Video Streaming Solutions to Stream your Videos. [web] [Fecha de acceso 25 -28 Marzo].

· How2shout. 8 free & best open source video streaming servers software. [web] [Fecha de acceso 25 – 28 Marzo].

· Business Insider. There are 6 major services that let you stream live TV over the internet. [web] [Fecha de acceso 25 – 28 Marzo].

· CDN Overview. Your #1 CDN resource website. [web] [Fecha de acceso 25 -28 Marzo].

· G2Crowd. Best content delivery network (CDN) software. [web] [Fecha de acceso 25 – 28 Marzo].

· Imagen slides 50 – 51. [img] [Fecha de acceso 28 Marzo].

* Las imágenes empleadas en la aplicación web forman parte de la base de datos de Apester.

** Las tablas y gráficos de las slides: 3, 6, 14 – 16, 18 – 21, 34 – 35 y 48 han sido extraídas del documento Vídeo streaming de alta calidad sobre plataformas de distribución de contenidos

 

PAC1 – Conceptos básicos de vídeo y audio. Formatos de imagen.

  1. Archivos BMP :

    Los archivos BMP fueron desarrollados por Microsoft para Windows basados en mapas de bits o píxeles. Este tipo de archivos son muy pesados y requieren mucho espacio de almacenamiento pero no hay pérdida de calidad (sin compresión).

    Estos archivos contienen un encabezado de archivo (identificador de mapa de bits, tamaño de archivo, ancho, alto, opciones de color y punto de inicio de datos de mapa de bits) y píxeles de mapa de bits, cada uno con un color diferente. Los archivos BMP pueden contener diferentes niveles de profundidad de color por píxel, según la cantidad de bits por píxel especificada en el encabezado del archivo. También pueden almacenarse utilizando un esquema de color en escala de grises.

    Los casos más habituales en los que podemos hacer uso de archivos BMP son para copias de archivo,  escaneados de alta calidad o como fondos de pantalla para escritorios en Windows.

  2. Archivos GIF:

    GIF es un formato de imagen de mapa de bits que permite una compresión sin pérdida de calidad, ya que lo que hace es reducir la paleta de colores a 256 colores distintos. Es cierto que PNG está empezando a ganar terreno ante este tipo de archivos pero todavía se usa para la animación, ya que es totalmente compatible con los navegadores actuales.

    Los archivos GIF se suelen usar para gráficos web, ya que están limitados a solo 256 colores, pueden permitir la transparencia y se pueden animar; además, suelen ser de pequeño tamaño y es algo que se tiene en cuenta para hacer los sitios webs menos pesados y más rápidos a la hora de cargarlos.

    Ejemplos de archivos GIF animados con fondo opaco y fondo transparente.
    Como se puede apreciar en la capturas de pantalla de Photoshop, el peso de los archivos es bastante bajo. En el primer caso, se ha utilizado la paleta de 256 colores para intentar tener una transición entre colores lo más suavizado posible; en el segundo caso, la paleta se ha reducido a 2 colores para reducir el tamaño del archivo, ya que únicamente hacemos uso del negro y la transparencia.

  3. Archivos JPEG:

    JPEG es un formato con pérdida de calidad, esto significa que la imagen está comprimida para hacer un archivo más pequeño; en función de la cantidad de compresión que le apliquemos, se apreciará más o menos en el resultado final, pero esta pérdida generalmente no se nota (siempre y cuando no pongamos una compresión muy elevada).
    Este tipo de archivos son muy comunes en Internet y es uno de los formatos más utilizados, lo que lo hace ideal para uso en la web, para impresiones no profesionales, para envíos vía email,…
    Al reducir el tamaño de estos archivos, hace que la carga en los sitios web sea mucho más rápida

    A la hora de exportar los archivos JPG, tenemos diferentes maneras de hacerlo:

    · Estándar – Este modo lo usaremos cuando queramos que el archivo sea reconocible en la mayoría de los navegadores web. Es una compresión básica y de buena calidad, haciendo la menor cantidad de cambios en la imagen.

    · Optimizada – Como su propio nombre indica, lo que hace este tipo de ajuste es optimizar la calidad del color de la imagen generando un tamaño de archivo algo más pequeño (2 a 8%, un poco más de compresión o carga ligeramente más rápida). Todos los navegadores web modernos lo admiten sin ningún tipo de problema.

    · Progresiva – Este tipo de ajuste crea una imagen que se mostrará gradualmente a medida que se va descargando. Esto significa que la imagen se muestra como líneas de escaneo, de modo que un navegador mostrará rápidamente una imagen de calidad reducida de la mitad de las líneas de escaneo mientras se resuelve la imagen completa.

    Como se puede apreciar en las siguientes imágenes y después de las explicaciones de cada uno de los modos/ajustes mencionados anteriormente, podemos llegar a la conclusión de que: a nivel visual, el hecho de usar un modo estándar, optimizado o progresivo, afecta únicamente cuando estamos trabajando con los archivos en una web o en la red porque es ahí donde identifica el modo en el que se ha procesado el archivo; es decir, si se ha empleado un ajuste progresivo, el archivo se cargará de un modo, si se ha usado un ajuste optimizado, se cargará de otro modo y si el navegador es muy antiguo se corre el riesgo de que no lo cargue correctamente y, si se ha generado en modo estándar, lo cargará correctamente en todos los navegadores. Por este motivo, cuando trabajamos con estos archivos en local no apreciamos ninguna diferencia.

    Sin embargo, el uso de las compresiones sí que es evidente, a mayor compresión del archivo, mayor pixelado, independientemente del modo empleado para exportar el archivo. Si nos fijamos en el siguiente gif, se puede apreciar la evidencia del pixelado cuanto mayor es la compresión.

    3_JPG_COMPRESION

    Después de estudiar las diferentes maneras que podemos utilizar a la hora de exportar un archivo JPG, podemos deducir que el uso estándar está enfocado al correcto funcionamiento en cualquier tipo de navegador web, así que si la imagen que queremos utilizar es de vital importancia para la comprensión de lo que queremos enseñar, deberíamos usar este método para asegurarnos de que se mostrará correctamente; aunque, hoy en día, el método optimizado es válido para la mayoría de navegadores y tiene una calidad algo superior al método estándar.
    En el caso del método progresivo lo emplearía, por ejemplo, en galerías fotográficas en las que la compresión del archivo ha de ser mínima para apreciar bien los detalles y el peso será superior; aplicando el modo progresivo, la carga del archivo será secuencial, tardará un poco más pero el usuario que está navegando no tendrá la percepción de que la página que está visitando es lenta o no funciona correctamente.

    Como se puede apreciar en los histogramas, después de realizar el proceso de diferencia aplicado a las imágenes con diferentes compresiones, resulta evidente la pérdida de información a medida que la compresión es mayor.

  4. Archivos PNG:

    Los archivos PNG son un formato de imagen sin pérdida de calidad diseñado originalmente para mejorar y reemplazar el formato GIF. Los archivos PNG pueden trabajar hasta 16 millones de colores, a diferencia de los 256 colores admitidos por GIF.

    Con este tipo de archivos, podemos incluir canales de transparencia de 8 bits que nos permiten hacer transiciones de opaco a transparente (en los GIF o era transparente u opaco pero no había ningún tipo de transición posible)

    Actualmente, las imágenes PNG son compatibles con la mayoría de los navegadores web.

    Este formato suele ser utilizado para iconos, gráficos web simples como logos, ilustraciones, textos rasterizados,… (ver imágenes a continuación).

    A nivel de comparación entre archivos PNG y GIF, aquí se muestran unas imágenes que evidencian las mejoras cuando hablamos de PNG.
    En la primera imagen se aprecia como la limitación de colores en la paleta de los archivos GIF hace que cuando trabajamos con imágenes con degradados, se vean mucho los halos entre colores y con los archivos PNG-24 no pasa, debido a que trabaja con hasta 16 millones de colores.
    En la segunda se aprecia como trabajando con archivos PNG podemos trabajar con transiciones de transparente a opaco, cosa que no podemos hacer con archivos GIF.

    Comparación 1
    Imagen – PNG      Imagen – GIF

    Comparación 2
    Imagen – PNG     Imagen – GIF

  5. Archivos TIFF :

    El formato TIFF es un tipo de archivo de imagen sin pérdida de calidad ni de información (aunque hay opciones para poder comprimir estos archivos), permite imágenes de muy alta calidad pero también tamaños de archivo más grandes; además también puede guardar transparencias.

    Su uso está enfocado para impresiones de alta calidad, publicaciones profesionales, copias de archivo…; también se usa para almacenar imágenes con muchos colores, como fotos digitales e incluye soporte para capas y varias páginas.

    Los archivos TIFF se pueden guardar en un formato sin comprimir (sin pérdida) o pueden incorporar compresión .JPEG (con pérdida). También pueden usar compresión sin pérdida LZW, que reduce el tamaño del archivo TIFF, pero no reduce la calidad de la imagen.

    Imágenes TGA vs PNG

    Visualmente no se aprecian muchas diferencias entre el archivo resultante TGA y el PNG, aunque sí se puede apreciar en el tamaño del archivo. Para verificar que no había apenas diferencia entre ambos, he hecho la prueba de diferencia de niveles con Photoshop y apenas se apreciaban cambios.

    Imagen – PNG                         Imagen – TGA

    El uso de los archivos TGA está enfocado al trabajo con vídeo y animación, ya que nos permite trabajar con un rango de bits de entre 8 y 32, incluyendo transparencias y con una relación entre calidad y tamaño de archivo razonables. Es cierto que el PNG nos permite trabajar con un rango de hasta 24 bits, permite transparencias pero su uso está más enfocado a plataformas web.

  6. Archivos SVG :

    SVG es un formato de archivo basado en XML de tipo vectorial, es escalable, pesa poco y permite una mejor definición cuando trabajamos con archivos de dimensiones más pequeñas.
    Se utiliza en muchas áreas, incluidos gráficos web, animación, interfaces de usuario, intercambio de gráficos, impresiones, aplicaciones móviles y diseño de alta calidad.

 

PAC1 – Bibliografía

· Ribelles García, Alex. Módulo 1. Conceptos básicos de vídeo y audio. Introducción

· Wiki. Formats d’arxiu. [web] [Fecha de acceso 3 – 11 Marzo].

Entrada 1. Conceptos básicos de vídeo y audio. Formatos de imagen.

· Prepressure . The PNG file format. [web] [Fecha de acceso 3 – 11 Marzo].

· Vix . Características y diferencias de los diferentes formatos de imágenes. [web] [Fecha de acceso 3 – 11 Marzo].

· Ite – Educacion . Formatos de imagen. [web] [Fecha de acceso 3 – 11 Marzo].

· Guides Lib . Native file formats. [web] [Fecha de acceso 3 – 11 Marzo].

· Fileinfo – TIF . TIF File Extension.[web] [Fecha de acceso 3 – 11 Marzo].

· Fileinfo – PNG . PNG File Extension. [web] [Fecha de acceso 3 – 11 Marzo].

· Fileinfo – JPG . JPG File Extension. [web] [Fecha de acceso 3 – 11 Marzo].

· Fileinfo – GIF . GIF File Extension. [web] [Fecha de acceso 3 – 11 Marzo].

· Fileinfo – BMP . BMP File Extension. [web] [Fecha de acceso 3 – 11 Marzo].

· BBC . Selecting and capturing images.[web] [Fecha de acceso 3 – 11 Marzo].

· Thoughtco . Graphics File Format Types and When To Use Each One. [web] [Fecha de acceso 3 – 11 Marzo].

· Quora . What are bitmap graphic used for?. [web] [Fecha de acceso 3 – 11 Marzo].

· Socialcompare . Common image file formats. [web] [Fecha de acceso 3 – 11 Marzo].

· Libpng . A basic introduction to PNG features. [web] [Fecha de acceso 3 – 11 Marzo].

· Zamzar . TGA a PNG. [web] [Fecha de acceso 3 – 11 Marzo].
Entrada 2. Conceptos básicos de vídeo y audio. Formatos de vídeo.

· Encoding . Understanding bitrates in video files. [web] [Fecha de acceso 7 – 13 Marzo].

· Norender . Códecs: diferencia entre formato, códec y resolución. [web] [Fecha de acceso 7 – 13 Marzo].

· Any video converter . Video Codec. [web] [Fecha de acceso 7 – 13 Marzo].

· Xatakahome . Códec VP9. [web] [Fecha de acceso 7 – 13 Marzo].

· Networkworld . Las ventajas de MPEG. [web] [Fecha de acceso 7 – 13 Marzo].

· Javier Ortiz . Códec de vídeo VP9 – Compresión y Decompresión. [web] [Fecha de acceso 7 – 13 Marzo].

· Youtube-eng . VP9: Faster, better, buffer-free YouTube videos.[web] [Fecha de acceso 7 – 13 Marzo].

· Trustedreviews . H.265 vs VP9: 4K video codecs explained. [web] [Fecha de acceso 7 – 13 Marzo].

· Bloggeek . VP8 vs VP9 – Is this about Quality or Bitrate?. [web] [Fecha de acceso 7 – 13 Marzo].

· Webopedia . MPEG – Moving Picture Experts Group. [web] [Fecha de acceso 7 – 13 Marzo].

· Medium . H.264 vs H.265 – A technical comparison. [web] [Fecha de acceso 7 – 13 Marzo].