Tema 4.4 SISTEMAS GRÁFICOS Y ROTULACIÓN PDF

SISTEMAS GRÁFICOS Y ROTULACIÓN Daniel Amores Zambrana RTVE e Instituto RTVE ÍNDICE 1. Sistemas Gráficos en Televisión. 2. Software 3. Casos de Uso. SISTEMAS GRÁFICOS EN TELEVISIÓN Los sistemas gráficos en televisión son las téc...

SISTEMAS GRÁFICOS Y ROTULACIÓN Daniel Amores Zambrana RTVE e Instituto RTVE ÍNDICE 1. Sistemas Gráficos en Televisión. 2. Software 3. Casos de Uso. SISTEMAS GRÁFICOS EN TELEVISIÓN Los sistemas gráficos en televisión son las técnicas y tecnologías utilizadas para generar y manipular imágenes y gráficos que se integran en la transmisión de contenidos televisivos. Estos sistemas, permiten la superposición de elementos gráficos sobre la imagen en movimiento, como logotipos, gráficos, animaciones y efectos visuales. Sus componentes son: Software de gráficos: Programas de gráficos en tiempo real nos permiten crear y editar elementos visuales. Hardware: Incluye servidores de video y sistemas de producción que permiten la emisión y el control de gráficos en vivo. Sistemas de transmisión: Integran gráficos en las señales de video para su envío a la emisión. Software de datos: Algunas aplicaciones permiten interacciones en tiempo real, como encuestas y comentarios de redes sociales. SISTEMAS GRÁFICOS EN TELEVISIÓN Casos de Uso: Programas Informativos: Gráficos que muestran estadísticas, mapas y datos en tiempo real. Programas de Deportes: Análisis en pantalla, puntuaciones y gráficos de rendimiento de jugadores. Programas de Entretenimiento: Recursos visuales para programas, concursos y reality shows. SISTEMAS GRÁFICOS EN TELEVISIÓN En uno de los ámbitos en los que más se ha avanzado en los últimos años es en la representación de información en televisión. En la actualidad, los elementos gráficos y la información se encuentran totalmente unidos. Algunos ejemplos de elementos gráficos son: Imágenes estáticas y en movimiento Entre ellas figuran vídeos realizados con drones, fotos e imágenes en directo. Rótulos estáticos y en movimiento En cuanto a los rótulos, encontramos los tradicionales (que se utilizan para presentadores y entrevistados, poner titulares, recalcar textos, etc.), los tickers que destacan las noticias de última hora, y los rótulos dinámicos que presentan datos en directo. SISTEMAS GRÁFICOS EN TELEVISIÓN Infografías y periodismo de datos Implica infografías para presentar los gran cantidad de datos o estadísticas. Realidad aumentada Se utiliza normalmente para representar elementos que de manera natural no se encuentran en un plató. Por ejemplo, vehículos deportivos, nevadas, etc. Identidad gráfica La mayoría de cadenas y programas han desarrollado una identidad propia (que incluye logotipo, grafismos, uso de ciertos colores y diseños). SOFTWARE Tipos de Software: 1. Software de Composición: Adobe After Effects: Utilizado para crear animaciones y efectos visuales complejos. Nuke: Ideal para composición avanzada y efectos visuales en producciones cinematográficas y televisivas. 2. Edición de Video: Adobe Premiere Pro: Utilizado para editar contenido audiovisual, donde también se pueden integrar gráficos. 3. Modelado 3D y Animación: Cinema 4D: Utilizado para crear gráficos tridimensionales que pueden ser incorporados en producciones televisivas.  SOFTWARE 4. Gráficos en Tiempo Real (son en los que nos vamos a centrar ya que podemos enviarles información en tiempo real y podremos utilizar los que mejor se adapten a nuestras necesidades y habilidades técnicas): OBS (Open Broadcaster Software): Herramienta gratuita y de Streamlabs OBS: Software gratuito basado en OBS que código abierto que permite la transmisión y grabación de incluye herramientas adicionales para la producción de video video en vivo. Se utiliza mucho en las plataformas de en vivo, como rótulos y transiciones. streaming. XSplit: Es un software de producción de video en vivo que vMix: Es un software de producción de video en vivo que permite la creación de rótulos, transiciones y efectos permite la creación de rótulos personalizados, transiciones y especiales. efectos especiales. VIZRT: Permite la creación de gráficos dinámicos y Wirecast: Es un software de producción de video en vivo que animaciones en tiempo real, muy utilizado en informativos y permite la creación de rótulos, transiciones y efectos deportes. especiales. BRAINSTORM: Muy utilizado en RTVE. Chyron: Proporciona soluciones para gráficos interactivos y en vivo. CasparCG: Es un software gratuito y de código abierto. SOFTWARE https://chyron.com/ SOFTWARE https://www.vizrt.com/ SOFTWARE https://www.brainstorm3d.com/es/ CasparCG Es un software de gráficos en tiempo real y reproducción de video utilizado en televisión. Características Principales: Open Source: CasparCG es un software de código abierto, lo que permite a los usuarios personalizar y adaptar el sistema a sus necesidades específicas. Gráficos en Tiempo Real: Permite la creación y reproducción de gráficos dinámicos, incluyendo textos, animaciones y visualizaciones 3D, integrados en transmisiones en vivo. Plantillas Flexibles: Permite a los usuarios diseñar plantillas personalizables para gráficos, lo que ahorra tiempo en la producción de contenido repetitivo. Multicanal: Capacidad para manejar múltiples canales y flujos de trabajo simultáneamente, ideal para producciones complejas. Comunidad y Soporte: Cuenta con una activa comunidad de desarrolladores y usuarios que contribuyen con tutoriales, plantillas y soporte, lo que facilita su aprendizaje y uso (https://casparcgforum.org/) CasparCG Para hacer funcionar CasparCG, sigue estos pasos : 1. Comprueba los Requisitos del Sistema Sistema Operativo: CasparCG es compatible con Windows, macOS y Linux. Hardware: Asegúrate de tener un PC con suficiente RAM y una tarjeta gráfica adecuada para manejar gráficos en tiempo real (Al menos OpenGL 4.5). 2. Descarga e Instala Descarga CasparCG: Ve al sitio oficial de CasparCG y descarga la última versión ( https://casparcg.com/ ). Instalación: Extrae los archivos y sigue las instrucciones de instalación proporcionadas. 3. Configuración Inicial Archivos de Configuración: CasparCG utiliza archivos de configuración. Asegúrate de configurar el archivo config.xml para establecer las conexiones de entrada y salida (NDI, SDI, etc.). Plantillas de Gráficos: Crea o descarga plantillas de gráficos (HTML5 o Flash) y colócalas en la carpeta adecuada dentro del directorio de CasparCG. CasparCG 4. Ejecutar CasparCG Abrir CasparCG: Ejecuta el archivo CasparCG.exe (en Windows) o el script correspondiente en otros sistemas. Interfaz de Usuario: Familiarízate con la interfaz, que incluye la sección de reproducción, la lista de canales y los controles para gestionar gráficos. 5. Carga de Contenido Cargar Plantillas: Utiliza la interfaz para cargar las plantillas gráficas que has creado o descargado. Configuración de Gráficos: Configura los gráficos con la información necesaria, como textos, imágenes y animaciones. 6. Prueba y Ajustes Realiza Pruebas: Ejecuta pruebas para asegurarte de que los gráficos se muestran correctamente y se actualizan en tiempo real. Ajusta Configuraciones: Si es necesario, ajusta los parámetros en los archivos de configuración o dentro de la interfaz ( https://github.com/casparcg/help/wiki ). CasparCG 7. Integración con Otros Sistemas Protocolos de Control: Si usas otros sistemas de producción, configura protocolos como TCP/IP o UDP para integrar CasparCG con ellos. Control Remoto: Puedes usar controladores como CasparCG Client para manejar la reproducción y la gestión de gráficos de forma remota. Documentación: Se puede consultar la documentación oficial para obtener información más detallada sobre configuración y uso https://github.com/CasparCG/help. Comunidad: Podemos participar en foros y grupos de usuarios para compartir experiencias y obtener ayuda (https://casparcgforum.org/). CasparCG SOFTWARE ENTORNOS DE DESARROLLO INTEGRADO (IDE) 1. ¿Qué es un IDE? Definición: Un Entorno de Desarrollo Integrado (IDE) es un software que proporciona herramientas completas para facilitar el desarrollo de aplicaciones. Componentes Clave: Editor de código Ciclo de desarrollo del software completo en un único lugar Compilador o intérprete Herramientas de depuración Gestor de proyectos 2. Beneficios de Usar un IDE Productividad: Herramientas integradas mejoran la eficiencia en el desarrollo. Facilidad de uso: Interfaces gráficas intuitivas que ayudan a los desarrolladores. Depuración eficiente: Permite identificar y solucionar errores de manera más rápida. Integración de herramientas: Facilita el uso de sistemas de control de versiones, bases de datos, y más. SOFTWARE 3. Introducción a Visual Studio Descripción: Visual Studio es un IDE desarrollado por Microsoft, popular entre desarrolladores de aplicaciones.NET y C#/C++ para crear aplicaciones multiplataforma. Versiones: Visual Studio Community: Gratuito para individuos y proyectos pequeños. Visual Studio Professional: Para equipos pequeños y medianos. Visual Studio Enterprise: Para grandes organizaciones con características avanzadas. 4. Características Destacadas de Visual Studio Editor de Código Inteligente: Autocompletado y sugerencias inteligentes (IntelliSense). Soporte para múltiples lenguajes (C#, VB.NET, C++, JavaScript, Python, etc.). Depuración Avanzada: Herramientas de depuración integradas que permiten el análisis de errores en tiempo real. Funciones de "Breakpoint", inspección de variables, y ejecución paso a paso. Gestión de Proyectos: Herramientas para gestionar y organizar proyectos de manera eficiente. Soporte para soluciones y proyectos múltiples. SOFTWARE Extensiones y Personalización: Existe amplia variedad de extensiones disponibles para añadir nuevas funcionalidades. Personalización del entorno de trabajo según las preferencias del usuario. https://visualstudio.microsoft.com/es/downloads 5. Ejemplo de Uso: Crear una Aplicación Web Crear un Nuevo Proyecto: Selecciona "Aplicación Web ASP.NET Core". Diseñar la Interfaz: Usa el editor de diseño para crear la interfaz de usuario. Escribir Código: Usa IntelliSense para autocompletar el código en C#. Depurar: Configura breakpoints y usa el depurador para solucionar problemas. Desplegar: Publica la aplicación en un servidor local. SOFTWARE 6.Desarrollo de Aplicaciones para Windows, iOS, MacOS y Android con Visual Studio. Herramientas y Tecnologías Xamarin (En la actualidad sin soporte): Herramienta integrada en Visual Studio para el desarrollo de aplicaciones móviles multiplataforma. Permite compartir código C# entre aplicaciones de Android y iOS. MAUI (Multi-platform App UI): Evolución de Xamarin.Forms, permite desarrollar aplicaciones nativas para Android, iOS, macOS y Windows con una sola base de código. SOFTWARE 7. Proceso de Desarrollo Instalar Visual Studio: Selecciona la carga de trabajo de "Desarrollo móvil con.NET" para incluir MAUI. Crear un Nuevo Proyecto: Selecciona "Aplicación MAUI" para empezar un proyecto multiplataforma. Diseño de Interfaz: Utiliza XAML o el diseñador visual para crear la interfaz de usuario. Lógica de Negocio: Escribe la lógica de negocio en C#. Usa bibliotecas de.NET para acceder a funcionalidades nativas. Uso de APIs Nativas: Accede a características específicas de cada plataforma, como GPS, cámara, etc. SOFTWARE Pruebas en Emuladores y Dispositivos: Permite probar la aplicación en emuladores de Android y simuladores de iOS/macOS. Depuración: Permite utilizar las herramientas de depuración de Visual Studio para identificar y resolver problemas. Despliegue para Android: Genera un archivo APK y publica en Google Play Store. Despliegue para macOS: Crea una aplicación para macOS y publícala en la Mac App Store. SOFTWARE 8.Lenguajes de Programación Multiplataforma Los lenguajes de programación multiplataforma permiten desarrollar aplicaciones que pueden ejecutarse en diferentes sistemas operativos sin necesidad de modificaciones significativas. Facilitan el desarrollo ágil y la reutilización del código. JavaScript Lenguaje de programación para el desarrollo web. Frontend: Interactividad en navegadores (con frameworks como React, Angular). Backend: Node.js permite ejecutar JavaScript en el servidor. Python  Lenguaje muy versátil y con muchas bibliotecas disponibles. Web: Frameworks como Django para desarrollo web. Escritorio: Tkinter y PyQt para aplicaciones de escritorio. SOFTWARE Java  Lenguaje orientado a objetos conocido por su portabilidad. Web: Servlets y JSP para aplicaciones web. Escritorio: JavaFX y Swing para interfaces gráficas. C# Lenguaje de programación de Microsoft, utilizado principalmente en el entorno.NET. Web: ASP.NET para desarrollo de aplicaciones web. Escritorio:.NET MAUI permite crear aplicaciones multiplataforma. Dart Lenguaje desarrollado por Google, utilizado principalmente con el framework Flutter. Web: Puede compilar a JavaScript. Escritorio: Flutter permite crear aplicaciones nativas para Windows, macOS y Linux. SOFTWARE Los lenguajes de programación multiplataforma son esenciales para el desarrollo eficiente de aplicaciones. La elección del lenguaje depende de las necesidades del proyecto, la experiencia del equipo y la naturaleza de las aplicaciones. El uso de frameworks y herramientas adecuadas puede facilitar significativamente el desarrollo. SOFTWARE Ejemplo de conexión y envío de datos a un sistema gráfico Para hacer un ejemplo de conexión y envío de datos a un sistema gráfico, necesitamos desarrollar una aplicación cliente que se conecte mediante un socket o con una conexión Telnet a la dirección IP y el puerto abierto por parte del servidor (sistema gráfico), para a continuación el cliente enviar datos al servidor, de manera que este los represente gráficamente usando sus librerías. Public conexion As CConector = New CConector() //En CConector, gestionamos el socket con todas sus propiedades. conexion.Servidor = "192.168.10.1" conexion.Puerto = 5123 conexion.AutoConexion = True conexion.Conectar() Dim mensaje As String= "itemset('TiempoCrono', 'TEXT_COLOR_ENABLED', FALSE);" mensaje += "itemset('TiempoCronoAcumulado" + contador.ToString() + "', 'MAP_STRING_PAR', '" + CType(Child, TextBlock).Text.ToString() + "');" conexion.enviar(mensaje) conexion.Desconectar() CASOS DE USO - AEMET Uso de APIs para Obtener Información de Terceros 1. ¿Qué es una API? Definición: Una Interfaz de Programación de Aplicaciones (API) permite que diferentes sistemas se comuniquen entre sí. Función: Actúa como un intermediario que facilita el intercambio de datos y funcionalidades. CASOS DE USO - AEMET 2. ¿Por qué usar APIs? Acceso a datos externos: Obtención de información de plataformas como redes sociales, servicios meteorológicos, etc. Integración de servicios: Combina funcionalidades de diferentes aplicaciones para crear soluciones más completas. Eficiencia: Reduce la necesidad de construir desde cero, aprovechando recursos existentes. 3. Utilidad Aplicaciones de redes sociales: Obtener publicaciones, comentarios o perfiles de usuarios. Servicios de pagos: Integración con plataformas como PayPal o Stripe para procesar transacciones. Datos meteorológicos: Acceso a información climática en tiempo real mediante APIs de servicios meteorológicos. CASO DE USO - AEMET 4. Consideraciones de Seguridad Autenticación: Uso de claves API, OAuth y otros métodos para asegurar el acceso. Limitaciones de uso: Muchos proveedores implementan límites para evitar abusos. Manejo de errores: Implementar un manejo adecuado para respuestas no exitosas. 5. Herramientas y Recursos Postman: Para probar y documentar APIs (https://www.postman.com/ ). Existe una versión web y otra de escritorio para distintas plataformas. Documentación: Siempre revisar la documentación oficial de cada API. CASOS DE USO - AEMET 6. Datos Abiertos (https://datos.gob.es/es/ ) datos.gob.es es la iniciativa de carácter nacional que organiza y gestiona el Catálogo de Información Pública del sector público. Desde este sitio web se proporciona información general, materiales formativos y noticias de actualidad sobre la reutilización de la información del sector público. El catálogo del conjunto de datos abiertos permite acceder, desde un único punto, a las páginas web que ofrecen información abierta y reutilizable. Junto con los conjuntos de datos disponibles para su reutilización se encuentran los metadatos que caracterizan de forma efectiva la información contenida: descripción, fecha de actualización, formatos disponibles, etc.  CASOS DE USO - AEMET Ejemplo Práctico  Obtener información de clima: Usar una API como AEMET para obtener el clima actual de una ciudad (https://opendata.aemet.es/ ): Paso 1: Registrarse y obtener una clave API. Paso 2: Realizar una solicitud GET a la API. Paso 3: Procesar la respuesta y mostrar la información deseada. Para utilizar la API de AEMET (Agencia Estatal de Meteorología de España) con Postman: 1. Obtén la API Key Antes de hacer cualquier llamada a la API, necesitas registrarte en el portal de AEMET, nos enviarán un email y obtenemos una clave de API (API Key). Alta en el servicio AEMET OpenData. Su API Key es: eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJkYW1vcmVzejJAZ21haWwuY29tIiwianRpIjoiMjc3MGYyYjItZmM3Yi00MDE0LTk2Nz YtZjc3ZDg1NTI0Zjc0IiwiaXNzIjoiQUVNRVQiLCJpYXQiOjE3MjgyOTQ0MTksInVzZXJJZCI6IjI3NzBmMmIyLWZjN2ItNDAxN C05Njc2LWY3N2Q4NTUyNGY3NCIsInJvbGUiOiIifQ.0OvXYm3ZeclTJ8jwyaa_NRbhX_R1njm6nrVJ_Rb6yJY CASOS DE USO - AEMET 2. Configura Postman Abre Postman. Crea una nueva colección o simplemente selecciona "New Request". 3. Realiza una Solicitud GET Ejemplo: Obtener la Predicción del Tiempo URL de la API: https://opendata.aemet.es/opendata/api/prediccion/especifica/municipio/diaria/{municipio} Reemplaza {municipio} con el código del municipio que deseas consultar. Por ejemplo, para Madrid: https://opendata.aemet.es/opendata/api/prediccion/especifica/municipio/diaria/28079 Headers En la pestaña "Headers" de Postman, agrega la siguiente clave y valor: Nombre: api_key Valor: TU_API_KEY (reemplaza con tu clave real) CASOS DE USO - AEMET Ejemplo Completo Método: GET URL: https://opendata.aemet.es/opendata/api/prediccion/especifica/municipio/diaria/28079 Headers: Key Value api_key TU_API_KEY 4. Ejecuta la Solicitud Haz clic en el botón "Send". Si la solicitud es correcta, recibirás una respuesta que contendrá la URL donde se puede acceder a los datos de la predicción. CASOS DE USO 5. Obtener los Datos de la Predicción La respuesta inicial incluirá una URL de acceso a los datos de la predicción. Por ejemplo, algo como: { "estado": "OK", "contenido": "https://opendata.aemet.es/opendata/api/prediccion/especifica/municipio/diaria/28079?apikey=TU_API_KEY" } 6. Hacer una Nueva Solicitud a la URL Proporcionada Copia la URL de contenido y pégala en una nueva pestaña de Postman. Asegúrate de incluir tu api_key en los parámetros de la URL si es necesario. Ejemplo: https://opendata.aemet.es/opendata/api/prediccion/especifica/municipio/diaria/28079?apikey=TU_API_KEY 7. Ejecuta la Solicitud para Obtener Datos Haz clic en "Send" nuevamente para obtener los datos de la predicción en formato JSON.  CASOS DE USO - AEMET 8. Interpretar la Respuesta La respuesta contendrá la predicción del tiempo en formato JSON, que podrás analizar y utilizar según tus necesidades. Además aparecen los metadatos para interpretar ese JSON. Ejemplo de Respuesta [ { "fecha": "2024-10-15", "prediccion": { "estado_cielo": "Despejado", "temperatura_max": 25, "temperatura_min": 15 } }, // Más días... ] Con estos pasos, puedes usar Postman para interactuar con la API de AEMET y obtener datos meteorológicos. CASOS DE USO - AEMET Podemos comprobar en la web de AEMET que los datos son correctos: https://www.aemet.es/es/eltiempo/prediccion/municipios/madrid-id28079 Además en esa web podemos descargar esos mismos datos en formato XML: https://www.aemet.es/xml/municipios/localidad_28079.xml CASOS DE USO - ROTULACIÓN CASOS DE USO - ROTULACIÓN CASOS DE USO – BOLSA (Informativos) CASOS DE USO – Carrusel de Fotos (Premios Goya) CASOS DE USO – ESCALETA Y SELECCIÓN DE CÁMARA (Especial Nochebuena y Premios Goya) TEXTO CASOS DE USO – SCRIPT/Capturas (Stamos Okupa2) CASOS DE USO – ELECCIONES USA (INFORMATIVOS) CASOS DE USO – TICKER (Canal 24H, La Hora de la 1) CASOS DE USO – TICKER (Canal 24H, La Hora de la 1) CASOS DE USO – Ticker con Redes Sociales (La Noche 24H) CASOS DE USO - SUBTITULADO TEXTO CASOS DE USO – REPRODUCTOR DE VÍDEO - PlayOut TEXTO CASOS DE USO – DAKAR – Web Scraping (TeleDeporte) CASOS DE USO – DAKAR – Web Scraping (TeleDeporte) CASOS DE USO – DAKAR – Web Scraping (TeleDeporte) 1. ¿Qué es el Web Scraping? Definición: El web scraping es un proceso automatizado de extraer información de sitios web. Objetivo: Recopilar datos que no están disponibles en bases de datos o en API’s. 2. ¿Por Qué Utilizar Web Scraping? Acceso a Datos: Obtener información de sitios donde los datos no están disponibles en API o necesitamos tener “Plan B”. Automatización: Ahorrar tiempo en la recopilación de datos manual. 3. Métodos de Web Scraping A. Scraping Manual  Recopilación de datos de forma manual, copiando y pegando información. Limitaciones: Poco eficiente y propenso a errores. B. Scraping Automatizado Herramientas y Lenguajes: Python: Usando bibliotecas como Beautiful Soup, Scrapy y Selenium. R: Usando paquetes como rvest. Herramientas de terceros: Octoparse, ParseHub, etc. CASOS DE USO – DAKAR – Web Scraping (TeleDeporte) C. Técnicas Comunes HTML Parsing: Analizar la estructura HTML de la página para extraer datos. APIs: Algunas páginas ofrecen APIs que facilitan la recolección de datos. Navegación Automática: Usar herramientas como Selenium para interactuar con sitios que requieren inicio de sesión o navegación. 4. Ejemplo de Web Scraping con Python # Realiza una solicitud a la página web url = 'https://example.com' response = requests.get(url) # Analiza el contenido HTML soup = BeautifulSoup(response.content, 'html.parser') # Extrae datos específicos for item in soup.find_all('h2'): print(item.get_text()) CASOS DE USO – DAKAR – Web Scraping (TeleDeporte) 5. Consideraciones Éticas y Legales Respeto a las Condiciones de Uso: Revisa los términos de servicio del sitio web antes de realizar Web Scraping. Carga en el Servidor: Evitar hacer solicitudes excesivas que puedan sobrecargar el servidor. Uso de Datos: Ser transparente sobre cómo se utilizarán los datos extraídos. El web scraping es una técnica muy útil para la recopilación de datos. Es esencial hacerlo de manera ética y responsable. CASOS DE USO – FFMPEG – CONVERSIÓN Y CONTATENADO DE VÍDEOS (Uso Interno Edición de Vídeo) TEXTO CASOS DE USO – FFMPEG – CONVERSIÓN Y CONTATENADO DE VÍDEOS (Uso Interno Edición de Vídeo) 1. FFmpeg (https://ffmpeg.org/ ) Es una herramienta de software libre que permite grabar, convertir, editar, y transmitir archivos multimedia en una amplia variedad de formatos. Se utiliza tanto en proyectos profesionales como amateurs debido a su flexibilidad y soporte multiplataforma. Nombre: FFmpeg (Fast Forward Moving Picture Experts Group) Tipo: Software de código abierto Licencia: LGPL o GPL (dependiendo de la configuración) Plataformas: Windows, macOS, Linux, BSD, etc. 2. Características Principales a) Conversión de formatos FFmpeg soporta prácticamente todos los formatos multimedia conocidos, permitiendo la conversión entre ellos. Por ejemplo, convertir un video en formato MP4 a MKV o AVI. Comandos básicos  ffmpeg -i input.mp4 output.mkv CASOS DE USO – FFMPEG – CONVERSIÓN Y CONTATENADO DE VÍDEOS (Uso Interno Edición de Vídeo) b) Extracción y combinación de pistas de vídeo y audio en un archivo único: Extraer audio  ffmpeg -i video.mp4 -vn -acodec copy audio.aac Combinar audio y video  ffmpeg -i video.mp4 -i audio.aac -c:v copy -c:a aac output.mp4 c) Compresión de archivos (reducir el tamaño de un archivo multimedia sin perder calidad significativa, mediante la compresión y recodificación): Ejemplo de compresión  ffmpeg -i input.mp4 -vcodec libx265 -crf 28 output.mp4 d) Edición de video (realizar ediciones básicas como cortar, unir, o agregar filtros a los archivos multimedia): Cortar un video (desde el segundo 30 hasta el 1:30)  ffmpeg -i input.mp4 -ss 00:00:30 -to 00:01:30 -c copy output.mp4 CASOS DE USO – FFMPEG – CONVERSIÓN Y CONTATENADO DE VÍDEOS (Uso Interno Edición de Vídeo) 3. Componentes principales de FFmpeg a) ffmpeg Este es el comando principal que se utiliza para la mayoría de las funciones, como la codificación, conversión y manipulación de archivos multimedia. b) ffplay Un reproductor de medios simple basado en FFmpeg. Sirve para reproducir archivos multimedia directamente desde la línea de comandos. c) ffprobe Herramienta que permite analizar y obtener información detallada sobre un archivo multimedia (códecs, duración, bitrates, etc.). CASOS DE USO – TABLETS (ANDROID y APPLE) (La Hora de la 1, Mañaneros, La Noche 24H, Estudio Estadio) Además de utilizar aplicaciones de control y software especializado en sistemas, gráficos, podemos emitir contenido a pantalla completa enviado desde una Tablet Android o iPad. Chromecast: Screen Mirroring: Cable HDMI: Apple TV: CASOS DE USO – TABLETS (ANDROID y APPLE) (La Hora de la 1, Mañaneros, La Noche 24H, Estudio Estadio) Utilizando un conversor, por ejemplo decimator, podemos convertir la señal para ser emitida: CASOS DE USO – TABLETS (ANDROID y APPLE) (La Hora de la 1, Mañaneros, La Noche 24H, Estudio Estadio) Servidores Web Un servidor web es un software y hardware que facilita la entrega de contenido a través de la web, respondiendo a las solicitudes de los clientes (navegadores o aplicaciones) y entregando páginas web, imágenes, videos, y otros archivos a través de Internet/Intranet. Definición: Software que sirve contenido web a los usuarios mediante el protocolo HTTP/HTTPS. Ejemplo: Cuando un usuario escribe una URL en su navegador, el servidor web procesa esa solicitud y devuelve la página/imagen o vídeos solicitados. CASOS DE USO – TABLETS (ANDROID y APPLE) (La Hora de la 1, Mañaneros, La Noche 24H, Estudio Estadio) Ejemplo de Servidor Web Microsoft IIS (Internet Information Services) Integración: Es el servidor web nativo para el sistema operativo Windows Server. Características: Soporte nativo para tecnologías de Microsoft (.NET, ASP). Fácil administración a través de la interfaz gráfica de Windows. CASOS DE USO – TABLETS (ANDROID y APPLE) (La Hora de la 1, Mañaneros, La Noche 24H, Estudio Estadio) Instalar IIS en Windows 11 1. Abre el Panel de Control. 2. Selecciona la opción “Programas y características”. Haz clic en “Activar o desactivar las características de Windows”, activa “Internet Information Services (IIS)” y haz clic en Aceptar. CASOS DE USO – TABLETS (ANDROID y APPLE) (La Hora de la 1, Mañaneros, La Noche 24H, Estudio Estadio) 3. Verifica la instalación de IIS Una vez completada la instalación, abre tu navegador web e ingresa la siguiente dirección en la barra de direcciones: http://localhost o http://127.0.0.1 Si IIS se ha instalado correctamente, deberías ver la página predeterminada de IIS: CASOS DE USO – CRUCIGRAMA (Mañaneros) CASOS DE USO – SOPA DE LETRAS (Mañaneros) CASOS DE USO – CANTICAM (Mañaneros) Utilizando un AppleTV y un iPhone, se emite en tiempo real utilizando la cámara angular del dispositivo móvil con la posibilidad además de incorporar GIFS animados. CASOS DE USO – NAVEGADOR PERSONALIZADO (Los Desayunos de la 1, La Noche 24H, La Hora de la 1) CASOS DE USO – PRENSA (La Noche 24H) 1. Descarga automática de pdf’s que envían los medios. 2. Copiar esas imágenes a una carpeta y mediante un servicio detectarlo, convertirlo en imagen jpg y nombrarlo con un número de orden. 3. Desde un servidor web leer esas imágenes en orden y mostrarlas en el listado de la izquierda. CASOS DE USO - ELECCIONES TABLET (La Hora de la 1, Informativos) Las elecciones pueden ser Autonómicas o Municipales, con lo que el contenido deberá ser seleccionable para obtener la información que deseamos en cada momento: CASOS DE USO - ELECCIONES TABLET – PACTOMETRO (La Hora de la 1) CASOS DE USO - ELECCIONES TABLET – PACTOMETRO (La Hora de la 1) CASOS DE USO - ELECCIONES TABLET – PACTOMETRO (La Hora de la 1) CASOS DE USO - ELECCIONES TABLET – PACTOMETRO IZQUIERDA/ DERECHA (La Hora de la 1) CASOS DE USO – ELECCIONES TABLET Y SISTEMAS GRÁFICOS – ABSTENCIOMETRO (La Hora de la 1) CASOS DE USO – ELECCIONES TABLET – ABSTENCIOMETRO (La Hora de la 1) CASOS DE USO - ELECCIONES TABLET Y SISTEMAS GRÁFICOS – Grafismo (La Hora de la 1) CASOS DE USO – ELECCIONES – CRONOMETROS SIN SALIDA GRÁFICA (INFORMATIVOS) CASOS DE USO – ELECCIONES – CRONOMETROS (INFORMATIVOS) CASOS DE USO - ELECCIONES - DATOS EN TIEMPO REAL (INFORMATIVOS) https://resultados2023.comunidad.madrid/es/ CASOS DE USO - ELECCIONES - DATOS EN TIEMPO REAL (INFORMATIVOS) https://resultados2023.comunidad.madrid/es/ CASOS DE USO - ELECCIONES - DATOS EN TIEMPO REAL (INFORMATIVOS) CASOS DE USO - ELECCIONES - DATOS EN TIEMPO REAL (INFORMATIVOS) CASOS DE USO – REDES SOCIALES (Informativos, La Hora de la 1, Mañaneros, Canal 24H, Estudio Estadio, San Fermines, Premios Goya, Torneos de Tenis, Lotería de Navidad, Cabalgata…)  CASOS DE USO – REDES SOCIALES (API’s) Para acceder a la API v2 de X (anteriormente Twitter), debes seguir estos pasos: 1. Crear una Cuenta de Desarrollador Visita X Developer (https://developer.x.com/en ) y regístrate para obtener una cuenta de desarrollador. Documentación oficial de la API v2 de X ( https://developer.x.com/en/docs/x-api ). 2. Crear un Proyecto y una Aplicación Una vez que tengas la cuenta, crea un nuevo proyecto y aplicación desde el panel de control. Durante este proceso, se te proporcionarán las claves necesarias. 3. Obtener Credenciales Bearer Token: Necesario para autenticar las solicitudes a la API. También puedes necesitar: API Key API Secret Key CASOS DE USO – REDES SOCIALES (API’s) 4. Configuración de Postman Abre Postman y crea una nueva colección para organizar tus solicitudes. 5. Crear la Solicitud Método: GET URL: Por ejemplo, para obtener los tweets de un usuario, puedes usar: https://api.twitter.com/2/users/:id/tweets (Reemplaza :id con el ID del usuario del que deseas obtener los tweets). 6. Añadir Autenticación Ve a la pestaña Authorization en Postman. Selecciona Bearer Token en el tipo de autenticación. Introduce tu Bearer Token en el campo correspondiente. CASOS DE USO – REDES SOCIALES (API’s) 7. Ejecutar la Solicitud Haz clic en Send. Postman enviará la solicitud a la API de X. Verás la respuesta en formato JSON, que incluirá los tweets solicitados. La respuesta podría tener este aspecto: { "data": [ { "id": "123456789", "text": "¡Hola desde la API de X!" }, { "id": "987654321", "text": "Otro tweet de ejemplo." } ] } CASOS DE USO – REDES SOCIALES (Texto, Imágenes, Vídeos) CASOS DE USO – REDES SOCIALES (Texto, Imágenes, Vídeos) CASOS DE USO – REDES SOCIALES (Texto, Imágenes, Vídeos) CASOS DE USO – REDES SOCIALES (Texto, Imágenes, Vídeos) CASOS DE USO – REDES SOCIALES (Texto, Imágenes, Vídeos) CASOS DE USO – REDES SOCIALES (Texto, Imágenes, Vídeos)  CASOS DE USO – REDES SOCIALES (Texto, Imágenes, Vídeos) Mensaje de X solo Texto y otro de Texto y Foto con Emoticonos: CASOS DE USO – REDES SOCIALES (Encuestas) CASOS DE USO – REDES SOCIALES (Mostrar Capturas y Recortes)  CASOS DE USO – WHATSAPP/TELEGRAM(Texto,Audio, Imágenes,Vídeos) https://developers.facebook.com/docs/whatsapp/cloud-api https://core.telegram.org/api CASOS DE USO – WHATSAPP/TELEGRAM(Texto,Audio, Imágenes,Vídeos)  CASOS DE USO – DGT https://infocar.dgt.es/etraffic/ https://infocar.dgt.es/etraffic/rss_ca_13.xml CASOS DE USO – Pantalla Tactil (España Directo) CASOS DE USO – Pantalla Tactil (España Directo) ¿Preguntas?