ampliación de multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y...

20
Ampliación de Multimedia C.F.G.M. Asistencia al Producto Gráfico Interactivo 2 Unidad 1. 1. Elementos multimedia avanzados.

Upload: dangminh

Post on 19-Sep-2018

214 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

Ampliación de MultimediaC.F.G.M. Asistencia al Producto Gráfico

Interactivo 2

Unidad 1. 1. Elementos multimedia avanzados.

Page 2: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

Unidad 1. Elementos multimedia avanzados.

1. Nuevos elementos multimedia avanzados: características y particularidades.

2. Imagen, sonido, vídeo, animaciones y gráficos en movimiento (motion graphics).

3. Nuevas tendencias en el ámbito de las animaciones gráficas en movimiento.

4. Nuevos soportes y nuevas técnicas para integración de contenidos multimedia: Realidad aumentada, realidad virtual, dispositivos weareables, internet de las cosas.

Page 3: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.1. Nuevos elementos multimedia avanzados:

características y particularidades.

• La tecnología que utilizan los diseñadores multimedia interactivos está en constante desarrollo. Los diseñadores deben estar al día de las últimas innovaciones y saber escoger aquellas que los ayudarán a mejorar sus proyectos interactivos. De esta manera, se encontrarán tecnologías en auge y otras que apenas son conocidas, pero que pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes.

Page 4: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.1. Nuevos elementos multimedia avanzados:

características y particularidades.

Con la llegada de HTML5 y CSS3 se ha producido un cambio importante en los productos interactivos para web:

• Han aparecido nuevas soluciones para problemas existentes en cuanto a maquetación de las páginas webs, como el diseño líquido y el diseño “responsivo”, que permiten la adaptación de las mismas a diferentes tipos de dispositivos.

• Se han incluido etiquetas con nuevas opciones en campos como el diseño gráfico y la animación, con nuevos efectos.

• Se han resuelto problemas existentes relativos a las tipografías utilizando, por ejemplo, las web fonts.

• Se ha potenciado mediante estas nuevas herramientas y otras la creación de aplicaciones para móviles y tablets.

Page 5: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.1. Nuevos elementos multimedia avanzados:

características y particularidades.

Por otro lado, las redes sociales y plataformas de blogs están disfrutando de un éxito sin precedentes.

Los nuevos sitios web y las nuevas apps están incluyendo cada vez más opciones relacionadas con las redes sociales.

Todos ellos se están preocupando de dar soporte a los antiguos y a los nuevos productos multimedia, como por ejemplo gifs animados, panoramas en formato foto y video en 360º.

Page 6: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.1. Nuevos elementos multimedia avanzados:

características y particularidades.

Nuevos dispositivos para conexión a internet:

• Tablets: disponen de pantalla táctil. Podemos utilizarlas en posición vertical u horizontal.

• Móviles (smartphones): cada vez más usados para conectarnos a Internet.

• Smart TV: permiten navegación por internet y el uso de determinadas “apps” diseñadas epecíficamente para TVs.

El diseño de la aplicación a nivel gráfico, funcional e interactivo debe tener en cuenta la posibilidad de que pueda ser ejecutada en diferentes soportes.

Page 7: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.1. Nuevos elementos multimedia avanzados:

características y particularidades.

Cuando utilizamos un móvil, podemos tener acceso a una serie de controles para manejar nuestras aplicaciones:

• Acelerómetro: mide los cambios de velocidad en un móvil.

• Giroscopio: detecta la posición de un móvil (permite, por ejemplo, cambiar la orientación del teléfono al girarlo)

• GPS: muchas aplicaciones ya se valen de este dispositivo para detectar donde está el usuario.

• Brújula: para saber donde está el norte.

• Cámara: nos permite grabar vídeo o tomar fotografías.

• Micrófono: algunos modelos permiten grabar audio de gran calidad

• Conexión a internet: nuevas conexiones 4G mucho más veloces.

• Gafas de Realidad Virtual o Virtual Reality (VR): algunos móviles son lo suficientemente potentes para reproducir contenido VR que puede ser visualizado mediante gafas diseñadas para ellos.

• Etc., etc.

Page 8: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.2. Imagen, sonido, vídeo, animaciones y gráficos en

movimiento (motion graphics).

El término “motion graphics” hace referencia a la animación gráfica digital multimedia.

Digital por realizarse con software y de forma no lineal y multimedia por aunar en una misma producción elementos de distinta naturaleza:

• Gráficos vectoriales

• Gráficos de mapa de bits

• Texto

• Recursos de vídeo

• Recursos de audio

• Animaciones

Es un término que se puede considerar ligado al diseño gráfico, y se considera acuñado por John Whitney (1917-1995), quien fundó la empresa Motion Graphics Incorporated para producir anuncios de TV y secuencias de títulos empleando un ordenador diseñado por él mismo.

Page 9: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.2. Imagen, sonido, vídeo, animaciones y gráficos en

movimiento (motion graphics).

Se debe distinguir entre gráficos animados (motion graphics) y animación: los primeros a menudo se crean para retocar o mejorar un video, mientras que la segunda forma suele formar parte de una estructura narrativa.

También podemos decir que los motion graphics tienen un propósito de comunicación y no de simple experiencia visual.

Es un medio publicitario muy dinámico que se puede utilizar para: vídeos corporativos de empresa, postproducción audiovisual, presentaciones interactivas, eventos, exposiciones de proyectos y anuncios publicitarios entre otros.

Page 10: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.3. Nuevas tendencias en el ámbito de las animaciones

gráficas en movimiento.

Algunas de las últimas tendencias en este campo son:

• Texto sobre fondos difuminados y desenfocados.

• Estética global simple y lineal.

• Se busca la originalidad y la creatividad para contar y visualizar contenidos.

• Estética low-poly (3D con bajo número de polígonos).

• Iconos flat design (diseño plano)

• Geometría.

• Zentangle o dibujo de patrones.

• Scroll infinito (diseño web)

• Seamless transitions (motion graphics)

Últimas tendencias actualizadas según Shutterstock:

http://www.shutterstock.com/es/trends

Tendencias para 2017 por envato.com:

https://envato.com/blog/best-motion-graphics-trends-design-2017/

Page 11: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.4. Nuevos soportes y nuevas técnicas para integración de contenidos

multimedia: Realidad aumentada, realidad virtual, dispositivos

weareables, internet de las cosas.

Realidad aumentada:La realidad aumentada o RA (Augmented Reality o AR en inglés) es el término que se usa para definir una visión a través de un dispositivo tecnológico, directa o indirecta, de un entorno físico del mundo real, cuyos elementos se combinan con elementos virtuales para la creación de una realidad mixta en tiempo real. Consiste en un conjunto de dispositivos que añaden información virtual a la información física ya existente, es decir, añadir una parte sintética virtual a lo real. Esta es la principal diferencia con la realidad virtual, puesto que no sustituye la realidad física, sino que sobreimprime los datos informáticos al mundo real.

Page 12: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.4. Nuevos soportes y nuevas técnicas para integración de contenidos

multimedia: Realidad aumentada, realidad virtual, dispositivos

weareables, internet de las cosas.

Con la ayuda de la tecnología (por ejemplo, añadiendo la visión por ordenador y reconocimiento de objetos) la información sobre el mundo real alrededor del usuario se convierte en interactiva y digital. La información artificial sobre el medio ambiente y los objetos pueden ser almacenada y recuperada como una capa de información en la parte superior de la visión del mundo real.

Según Ronald Azuma. La definición que dio en 1997 dice que la realidad aumentada:• Combina elementos reales y virtuales.• Es interactiva en tiempo real.• Está registrada en 3D.

Diferentes dispositivos pueden hacer uso de la realidad aumentada. Es requisito indispensable que dichos dispositivos dispongan de una cámara. Algunos de estos dispositivos que pueden utilizar esta tecnología son: smartphones, tablets, consolas portátiles (como la PlayStation Vita) o gafas de realidad aumentada (como las Google Glass o las Microsoft HoloLens).

Page 13: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.4. Nuevos soportes y nuevas técnicas para integración de contenidos

multimedia: Realidad aumentada, realidad virtual, dispositivos

weareables, internet de las cosas.

• Algunas aplicaciones de RA requieren el uso de marcadores para detectar el espacio 3D de la escena captada.

Page 14: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.4. Nuevos soportes y nuevas técnicas para integración de contenidos

multimedia: Realidad aumentada, realidad virtual, dispositivos

weareables, internet de las cosas.

Realidad Aumentada:Descripción:https://www.youtube.com/watch?v=-qb4YkhRO58

Ejemplos:Transformers (marcadores):https://www.youtube.com/watch?v=_BiUyBuC6Bk#t=84PlayStation Vita (marcadores):https://www.youtube.com/watch?v=OElik_UM01wKuruchuSoft (educación):http://webadictos.com/2015/03/20/realidad-aumentada-aprendizaje-primaria/Aplicación Disney para colorear:http://www.elconfidencial.com/tecnologia/2015-10-08/disney-quiere-que-los-libros-para-dibujar-tengan-realidad-aumentada_1051644/Realidad aumentada con gafas Hololens:https://www.youtube.com/watch?v=ZaHi-4ZGOscRealidad aumentada mediante gafas:https://www.youtube.com/watch?v=U3ToeF0Jqfk

Page 15: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.4. Nuevos soportes y nuevas técnicas para integración de contenidos

multimedia: Realidad aumentada, realidad virtual, dispositivos

weareables, internet de las cosas.

Realidad virtual (VR):

La realidad virtual es un entorno de escenas u objetos de apariencia real, generado mediante tecnología informática, que crea en el usuario la sensación de estar inmerso en él. Dicho entorno es contemplado por el usuario a través normalmente de un dispositivo conocido como gafas o casco de realidad virtual. Este puede ir acompañado de otros dispositivos (como guantes, trajes especiales, o dispositivos especiales que detectan la posición en el espacio 3D, el movimiento y giro de los mismos, su aceleración, etc.) que permiten una mayor interacción con el entorno así como la percepción de diferentes estímulos que intensifican la sensación de realidad.

La aplicación de la realidad virtual, aunque centrada inicialmente en el terreno del entretenimiento y de los videojuegos, se ha extendido a otros muchos campos, como la medicina, la arqueología, la creación artística, el entrenamiento militar o las simulaciones de vuelo.

Page 16: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.4. Nuevos soportes y nuevas técnicas para integración de contenidos

multimedia: Realidad aumentada, realidad virtual, dispositivos

weareables, internet de las cosas.

Realidad virtual (VR):Accesorios Realidad Virtual:https://www.youtube.com/watch?v=cPcLEGKR6ZI

http://www.itespresso.es/realidad-virtual-perifericos-mas-alla-de-la-experiencia-visual-128099.html

Omni:https://www.youtube.com/watch?v=ZSbVY-yGly0

Existe otro tipo de sensores que pueden ser utilizados para realidad virtual, pero no exclusivamente, ya que además nos permiten controlar o interactuar con el ordenador fuera de entornos VR. Algunos ejemplos son:

Kinect:http://www.xatakawindows.com/xbox/la-evolucion-de-kinect-y-la-

importancia-de-microsoft-research

Leap:https://www.leapmotion.com/

Page 17: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

Elementos multimedia avanzados, de conectividad, localización de posiciones, interfaz con el usuario y capacidad de almacenaje removible.

•Reconocimiento de voz: S Voice de Samsung

•Reconocimiento de música: Spotify

•Reconocimiento de imagen

Reconocimiento facial: aplicaciones para realizar FaceTracking, reconocimiento facial de Facebook.

Reconocedores de cuadros: Google Googles.

Reconocimiento de matrículas

Detección de movimiento de deportistas: NBA player tracking, Sports VU para fútbol...

Etc.

•Integración de contenido alojado en la nube, el cual puede ser modificado dando lugar a un cambio en el producto final (modificación de un vídeo alojado en una plataforma web, inclusión de datos a tiempo real, etc.)

•Aplicaciones multimedia que aprovechan elementos incluidos en el smartphone (giroscopio, acelerómetro, GPS, cámara...)

•Aplicaciones multimedia que aprovechan las tecnologías de conexión inalámbrica: WiFi, Bluetooth, infrarrojos.

Page 18: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.4. Nuevos soportes y nuevas técnicas para integración de

contenidos multimedia: Realidad aumentada, realidad virtual,

dispositivos weareables, internet de las cosas.

Dispositivos:

• Elementos incluidos en el smartphone (giroscopio, acelerómetro, GPS, cámara...)

• Tecnologías de conexión inalámbrica: WiFi, Bluetooth, infrarrojos.

• Internet de las cosas (internet of things o IoT, también llamado internet of everything): interconexión digital de objetos de uso cotidiano con internet. Un ejemplo sería un frigorífico que avisa al supermercado con las cosas que necesitas y te las llevan a casa, o que nos avisa cuando un producto está caducado o un inodoro que nos haga un análisis de nuestra orina y nos recomiende la dieta más adecuada (o incluso transmita los datos vía internet a nuestro médico).

http://www.xataka.com/internet-of-things/las-3-tecnologias-clave-para-el-internet-de-las-cosas

Page 19: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.4. Nuevos soportes y nuevas técnicas para integración de contenidos

multimedia: Realidad aumentada, realidad virtual, dispositivos

weareables, internet de las cosas.

• Dispositivos wearables (llevables o ponibles): aquellos dispositivos electrónicos que llevamos con nosotros bien sea debajo, encima o en nuestra ropa. A parte de ser llevados de forma natural por el usuario algunas de las características de la tecnología wearable son:

▫ Tienen la capacidad de estar en constante funcionamiento, no necesitan ser encendidos o apagados.

▫ Son dispositivos que facilitan la multitarea, no es necesario dejar de hacer algo para usarlos.

▫ En algunos casos pueden actuar como una extensión del cuerpo o la mente del usuario. por ejemplo en forma de prótesis.

Pulsera Cicret Bracelet:

https://www.youtube.com/watch?v=LcgnAzwCrHM

Zapatillas Lechal con GPS:

http://lechal.com/

Page 20: Ampliación de Multimedia · pueden ser de utilidad para crear soluciones de diseño innovadora y fascinantes. 1.1. Nuevos elementos multimedia avanzados: ... Digital por realizarse

1.4. Nuevos soportes y nuevas técnicas para integración de contenidos

multimedia: Realidad aumentada, realidad virtual, dispositivos

weareables, internet de las cosas.

• Grafeno.El grafeno es una sustancia formada por carbono puro, con átomos dispuestos en patrón regular hexagonal, similar al grafito, pero en una hoja de un átomo de espesor.

Si fuésemos capaces de introducir electrónica en todos los objetos, se podría transformar la sociedad. “Pantallas introducidas en las ventanas de nuestras casas, que den información sobre el tiempo que hace fuera, o publicidad”.

Pese a los esfuerzos de numerosas iniciativas por todo el mundo, tanto públicas como privadas, no ha logrado dar el salto del laboratorio a las cadenas de montaje.

¿Qué es el grafeno?

https://www.youtube.com/watch?v=FNJRXYc3xSQ