Mltiples Pantallas

SEMINARIO EN DISEO DE INTERACCIN Mircoles 26 de Noviembre 2014 Juan Paulo Madriaza

Un mundo con

Introduccin Las pantallas se nos vienen encima

de nuestras interacciones con medios son mediante pantallas 90%

The New Multi-screen World - Google 2012

Pasamos al da mirando pantallas para entretenernos 4.4hrs

Visual Brand - 2012

De quienes tienen smartphones y tablets, los usan frente a la televisin 80%

The New Multi-screen World - Google 2012

81% 66% 66%

Cules son las combinaciones ms recurrentes?

The New Multi-screen World - Google 2012

Tiempo

Cunto tiempo tengo para realizar esta

interaccin?

Objetivo

Qu quiero conseguir con esta interaccin?

Ubicacin

Dnde estoy? Dnde est el dispositivo?

Actitud

Estoy de buen nimo?

Cmo elegimos qu dispositivo usar?

The New Multi-screen World - Google 2012

Qu cambi? Porqu hoy es distinto de ayer?

Internet est en todas partes En la tecnologa

Y entonces qu cambi?

La capacidad de procesamiento aumenta, los costos bajan En la tecnologa

Y entonces qu cambi?

La tecnologa nos acompaa a todas partes En la tecnologa

Y entonces qu cambi?

Se crean protocolos de comunicacin entre aparatos En la tecnologa

Y entonces qu cambi?

Somos sociales mediante internet En las personas

Y entonces qu cambi?

La tecnologa se hace personal En las personas

Y entonces qu cambi?

Nuestros umbrales de atencin son cada vez menores En las personas

Y entonces qu cambi?

Estamos expuestos a cantidades enormes de informacin En las personas

Y entonces qu cambi?

Nos acostumbramos a interactuar por sobre el leer/escuchar/ver En las personas

Y entonces qu cambi?

Sensacin de eficiencia al usar mltiples dispositivos En las personas

Y entonces qu cambi?

La portabilidad de las pantallas facilita la trans-tarea En las personas

Y entonces qu cambi?

NOSOTROS CON LAS PANTALLAS

Interaccin

Comandos Objetos MultiTouch Sensores

Cmo usamos las interfaces?

Secuencial

Ir de un dispositivo a otro en momentos

distintos para completar una tarea

Simultneo

Usar distintos dispositivos al mismo

tiempo para lo mismo o algo distinto

De qu manera interactuamos con mltiples pantallas?

Multitasking Actividad no relacionada

Complementario Actividad relacionada

The New Multi-screen World - Google 2012

DISPOSITIVOS QUE CONVERSAN

Interaccin

Internet Traspaso fsico Bluetooth GPS

Cmo se comunican los dispositivos entre si?

Audio Video Imagen Cercana

Coherencia

Se ve y funciona similar aunque me cambie de

dispositivo

Evernote

Sincronizacin

Los dispositivos estn siempre sincronizados

Kindle

Compartir pantalla

Distintos dispositivos comparten una misma

fuente

Air Display

Qu hacen cuando se comunican?

Precious DS Patterns for Multiscreen Design - 2011

Qu hacen cuando se comunican?

Cambio de dispositivo

El usuario se cambia de un dispositivo a otro libremente

Apple Airplay

Complementareidad

Los dispositivos se complementan entre si

Scrabble Board

Simultaneidad

Los dispositivos se usan de manera

simultnea

Heineken Star Player

Precious DS Patterns for Multiscreen Design - 2011

Diseo de interaccin

Mas pantallas significan ms desafos

Contextos de uso Interaccin Tctil

Visibilidad del estado del sistema

Correspondencia sistema/ mundo

Control y libertad

Consistencia y estndares

Prevencin de errores

Reconocimiento sobre recuerdo

Flexibilidad y eficiencia

Esttica y minimalismo

Recuperacin de errores

Ayuda y documentacin

Interaccin fsica y ergonoma

Inputs disponibles

Escala

Personalizacin y atajos

Color y contraste

Sonido / msica

Diseo responsivo / modos alternativos

Condiciones lumnicas

Interferencia de ruido

Movimiento

Interrupcin

Superficies de display

Flujo de trfico entre dispositivos

Actividades multi-pantalla

Seattle Interactive Conference - 2013

ALGUNOS EJEMPLOS NOTABLES

Interaccin

Netflix [Mobile / TV / Consola / HTPC / otros]

Multi plataforma Entretencin Sincronizacin

Star Player [TV / Tablet / Mobile]

Apuestas Segunda pantalla Publicidad

Remote [Smartphone / Tablet / PC]

Control remoto Segunda pantalla Educacin

Watch with eBay [TV / Tablet]

Segunda pantalla E-commerce Complementario

Scrabble Board [Smartphone / Tablet]

Complementario Simultneo Gaming

SmartGlass [Smartphone / Tablet / Consola / TV]

Control remoto Segunda pantalla Entretencin / Gaming

Motorola Connect [Smartphone / PC]

Notificaciones Segunda pantalla Productividad

Shazam Ads [TV / Smartphone / Tablet]

Audio recognition Segunda pantalla Publicidad

WiiU Controller [Smartphone / Tablet]

Control remoto Complementario / independiente Gaming

TWD StorySync [TV / Tablet / PC]

Trivia Segunda pantalla Entretencin

NearPod [Tablet / Tablet]

Control remoto Sincronizacin Educacin

AC Unity App [Smartphone / Tablet]

Complementario Segunda pantalla Gaming

Air Display [PC / Tablet]

Screen sharing Segunda pantalla Productividad

LiveView [PC / Tablet / Smartphone]

Screen sharing Prototipado Productividad

Gallery One [Interactive Wall / Tablet]

Augmented Reality Multitouch Kinect

Gallery One [Interactive Wall / Tablet]

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

SOBRE EL FUTURO Algunos conceptos

Hay muchas pantallas que estn sobrando

El feedback touch se hace insuficiente

Aparece la Invisible GUI

Necesitamos crear interacciones multicanal orquestadas

Estamos demasiado centrados en disear interfaces en vez de

solucionar interacciones

Gracias Esta presentacin ya est publicada en Slideshare

http://www.slideshare.net/madriaza

Juan Paulo Madriaza @mad_uxd . mad.uxd.cl

Ms informacin http://uxmag.com/articles/designing-for-context-the-multiscreen-ecosystem

http://www.slideshare.net/azizhaddad/the-new-multiscreen-world?qid=d7d97b83-ebbb-4a3a-ac6d-27c38c44e3d6&v=default&b=&from_search=5

http://www.slideshare.net/tomchapman/building-an-agency-fit-for-the-multiscreen-world-33086341?qid=d7d97b83-ebbb-4a3a-ac6d-27c38c44e3d6&v=qf1&b=&from_search=33

http://www.slideshare.net/SocialOgilvyNZ/five-principles-for-storytelling-in-a-multiscreening-world-41031676?qid=d7d97b83-ebbb-4a3a-ac6d-27c38c44e3d6&v=default&b=&from_search=23

http://www.slideshare.net/seattleinteractive/ux-panel-aligning-to-multiscreen-customer-journeys-at-sic2013?qid=d7d97b83-ebbb-4a3a-ac6d-27c38c44e3d6&v=default&b=&from_search=14

http://www.slideshare.net/laurenkgray/the-multiscreen-integrated-experience?qid=d7d97b83-ebbb-4a3a-ac6d-27c38c44e3d6&v=default&b=&from_search=6

http://www.fastcodesign.com/1672144/the-future-of-ui-isn-t-invisible-nor-is-it-seamless

http://www.cooper.com/journal/2012/08/the-best-interface-is-no-interface

http://www.laccir.org/sda/files/rodolfoinostroza.pdf

http://es.slideshare.net/preciousforever/patterns-for-multiscreen-strategies

http://www.slideshare.net/bengrossman/second-screen-strategy-planning-for-and-against-a-multiscreen-world?related=1

Mltiples PantallasIntroduccinNmero de diapositiva 3Nmero de diapositiva 4Nmero de diapositiva 5Cules son las combinaciones ms recurrentes?Cmo elegimos qu dispositivo usar?Qu cambi?Y entonces qu cambi?Y entonces qu cambi?Y entonces qu cambi?Y entonces qu cambi?Y entonces qu cambi?Y entonces qu cambi?Y entonces qu cambi?Y entonces qu cambi?Y entonces qu cambi?Y entonces qu cambi?Y entonces qu cambi?Nosotros con las pantallasCmo usamos las interfaces?De qu manera interactuamos con mltiples pantallas?Dispositivos que conversanNmero de diapositiva 24Cmo se comunican los dispositivos entre si?Qu hacen cuando se comunican?Qu hacen cuando se comunican?Mas pantallas significan ms desafosAlgunos ejemplos notablesNmero de diapositiva 30Nmero de diapositiva 31Nmero de diapositiva 32Nmero de diapositiva 33Nmero de diapositiva 34Nmero de diapositiva 35Nmero de diapositiva 36Nmero de diapositiva 37Nmero de diapositiva 38Nmero de diapositiva 39Nmero de diapositiva 40Nmero de diapositiva 41Nmero de diapositiva 42Nmero de diapositiva 43Nmero de diapositiva 44Nmero de diapositiva 45Sobre el futuroNmero de diapositiva 47Nmero de diapositiva 48Nmero de diapositiva 49Nmero de diapositiva 50Nmero de diapositiva 51GraciasEsta presentacin ya est publicada en Slideshare http://www.slideshare.net/madriazaMs informacin