Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Introducción a la interacción en mesas multicontacto

159 views

Published on

Transparencias que resumen las distintas tecnologías de mesas multicontacto, y sus aplicaciones.

Published in: Education
  • DOWNLOAD THAT BOOKS INTO AVAILABLE FORMAT (2019 Update) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download Full EPUB Ebook here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download Full doc Ebook here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download PDF EBOOK here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download EPUB Ebook here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download doc Ebook here { http://bit.ly/2m6jJ5M } ......................................................................................................................... ......................................................................................................................... ................................................................................................................................... eBook is an electronic version of a traditional print book that can be read by using a personal computer or by using an eBook reader. (An eBook reader can be a software application for use on a computer such as Microsoft's free Reader application, or a book-sized computer that is used solely as a reading device such as Nuvomedia's Rocket eBook.) Users can purchase an eBook on diskette or CD, but the most popular method of getting an eBook is to purchase a downloadable file of the eBook (or other reading material) from a Web site (such as Barnes and Noble) to be read from the user's computer or reading device. Generally, an eBook can be downloaded in five minutes or less ......................................................................................................................... .............. Browse by Genre Available eBooks .............................................................................................................................. Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, ......................................................................................................................... ......................................................................................................................... .....BEST SELLER FOR EBOOK RECOMMEND............................................................. ......................................................................................................................... Blowout: Corrupted Democracy, Rogue State Russia, and the Richest, Most Destructive Industry on Earth,-- The Ride of a Lifetime: Lessons Learned from 15 Years as CEO of the Walt Disney Company,-- Call Sign Chaos: Learning to Lead,-- StrengthsFinder 2.0,-- Stillness Is the Key,-- She Said: Breaking the Sexual Harassment Story That Helped Ignite a Movement,-- Atomic Habits: An Easy & Proven Way to Build Good Habits & Break Bad Ones,-- Everything Is Figureoutable,-- What It Takes: Lessons in the Pursuit of Excellence,-- Rich Dad Poor Dad: What the Rich Teach Their Kids About Money That the Poor and Middle Class Do Not!,-- The Total Money Makeover: Classic Edition: A Proven Plan for Financial Fitness,-- Shut Up and Listen!: Hard Business Truths that Will Help You Succeed, ......................................................................................................................... .........................................................................................................................
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THAT BOOKS INTO AVAILABLE FORMAT (2019 Update) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download Full EPUB Ebook here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download Full doc Ebook here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download PDF EBOOK here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download EPUB Ebook here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download doc Ebook here { http://bit.ly/2m6jJ5M } ......................................................................................................................... ......................................................................................................................... ................................................................................................................................... eBook is an electronic version of a traditional print book that can be read by using a personal computer or by using an eBook reader. (An eBook reader can be a software application for use on a computer such as Microsoft's free Reader application, or a book-sized computer that is used solely as a reading device such as Nuvomedia's Rocket eBook.) Users can purchase an eBook on diskette or CD, but the most popular method of getting an eBook is to purchase a downloadable file of the eBook (or other reading material) from a Web site (such as Barnes and Noble) to be read from the user's computer or reading device. Generally, an eBook can be downloaded in five minutes or less ......................................................................................................................... .............. Browse by Genre Available eBooks .............................................................................................................................. Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, ......................................................................................................................... ......................................................................................................................... .....BEST SELLER FOR EBOOK RECOMMEND............................................................. ......................................................................................................................... Blowout: Corrupted Democracy, Rogue State Russia, and the Richest, Most Destructive Industry on Earth,-- The Ride of a Lifetime: Lessons Learned from 15 Years as CEO of the Walt Disney Company,-- Call Sign Chaos: Learning to Lead,-- StrengthsFinder 2.0,-- Stillness Is the Key,-- She Said: Breaking the Sexual Harassment Story That Helped Ignite a Movement,-- Atomic Habits: An Easy & Proven Way to Build Good Habits & Break Bad Ones,-- Everything Is Figureoutable,-- What It Takes: Lessons in the Pursuit of Excellence,-- Rich Dad Poor Dad: What the Rich Teach Their Kids About Money That the Poor and Middle Class Do Not!,-- The Total Money Makeover: Classic Edition: A Proven Plan for Financial Fitness,-- Shut Up and Listen!: Hard Business Truths that Will Help You Succeed, ......................................................................................................................... .........................................................................................................................
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Be the first to like this

Introducción a la interacción en mesas multicontacto

  1. 1. Introducción a las mesas multitáctiles Pablo A. Haya Manuel García-Herranz IIC – UAM amilab-UAM Pablo Llinás Fernando Olivera amilab-UAM amilab-UAM Fecha última actualización:15 noviembre 2011 http://pablohaya.com
  2. 2. Créditos Este obra está bajo una licencia de Creative Commons Reconocimiento-CompartirIgual 3.0 Unported. (Texto en castellano) Parte de los contenidos que se han utilizado en esta obra han sido obtenidos de las siguientes fuentes, las cuales retienen los derechos de autor: •Bad Designs (www.baddesigns.com). •Degani, A (2004) Taming HAL: Designing Interfaces Beyond 2001. Palgrave Macmillan. •Google Inc. •Javier Gómez Escribano. •Jebel Gil. •IKEA. •Interface Hall of Shame (www.ronaldbieber.de/Interface_Hall_of_Shame/shame.html). •Manuel García-Herranz del Olmo. •Microsoft Word 2003 y 2007. •Microsoft PowerPoint 2011. •Mac OS X, iTunes y Apple. •Rogers, Y., Sharp, H, and Preece, J. (2011) Interaction Design: Beyond Human-Computer Interaction. New York, John Wiley & Sons, Inc. •Useit (www.useit.com). •Verónica Alvalá. •Wikipedia (en.wikipedia.org). El resto de texto e imágenes se rige por la siguiente licencia:
  3. 3. Agenda Introducción Hardware Ópticas DI FTIR LLP PixelSense Capacitivas Diamound Touch Detección de dedos TUIO Reconocimiento de dedos Frameworks libres y comerciales FLING Otros Temas Consideraciones de diseño Tangibles/Fiduciales Referencias
  4. 4. INTRODUCCIÓN
  5. 5. WIMP: SIstema Star (1981) “Window, Icon, Menus and Pointer”. Una interfaz visual basada en la oficina física. Estaba orientado a trabajadores que no estaban interesados en la computación per se. src: [Johnson, J. and Roberts, T. L, 1999]  Bitmaps, GUI, iconos, carpetas, ratón, Ethernet, servidor de fichero, impresión y correo-e..  Lisa de Apple, Mac (1983)
  6. 6. Manipulación directa [Shneiderman, 1983] Objetos digitales se diseñan de manera que la interacción sea análoga a como se manipulan los objetos físicos. Usuario siente que controla directamente el objeto digital Principios: Representación continua de los objectos y acciones de interés. Acciones físicas (ej. pulsar botón, seleccionar, arrastar…) en vez de comandos Acciones reversibles con retroalimentación inmediata de los objetos de interes Ejemplos: Herramientas de diseño gráfico WYSIWYG
  7. 7. ALGO DE HISTORIA (BILL BUXTON) 1982 Multi-Touch Input: Nimish Mehta University of Toronto. 1983 Rich Gesture Recognition, Myron Krueger. http://www.youtube.com/watch?v=dmmxVA5xhuo 1984 Multi-Touch Screen (Bob Boie, Bell Labs, Murray Hill NJ) 1985 Multi-Touch Tablet (Input Research Group, University of Toronto) 1991 Digital Desk, Pierre Wellner (Rank Xerox EuroPARC, Cambridge) src: billbuxton.com/myronOval.jpg src: billbuxton.com/DGPtouch.jpg src: billbuxton.com/MultitouchAssets/ubicomp11sm.gif
  8. 8. YA ESTÁN AQUI 9 Apple iphone Samsung Galaxy Apple ipad Nintendo WII Kinect XBOX Microsoft Surface src: Wikipedia
  9. 9. Ejemplos superficies multi-contacto 11 src: Jeff Han, http://cs.nyu.edu/~jhan/ftirsense src: Wikipedia, Reactable src: amilab, http://amilab.ii.uam.es src: Wikipedia
  10. 10. CARACTERÍSTICAS BÁSICAS Pantalla/PanelPantalla/Panel Manipulación Directa Manipulación Directa Interacción intuitiva Interacción intuitiva Dedos tocans los objetos visuales Dedos tocans los objetos visuales Arrastar, tocar, pellizcar Arrastar, tocar, pellizcar Doble Funcionalidad Doble Funcionalidad
  11. 11. MÚLTIPLES USUARIOS CollaboraciónCollaboración Interacción concurrente Interacción concurrente Reconocimiento de Personas Reconocimiento de Personas Fragmentación de tareas Fragmentación de tareas Sensores extrasSensores extras Varios usuarios en la misma tarea Varios usuarios en la misma tarea
  12. 12. TECNOLOGÍAS MULTICONTACTO
  13. 13. OPTICAS Tecnologías Multicontacto
  14. 14. DI: Diffused Illumination Diffused Illumination (DI) • Funciona por detección de sombras • Iluminación trasera o delantera • Permite el uso de objetos tangibles • Sensible a la luminosidad Ejemplo • Microsoft Surface 1.0 src: nuigroup, http://wiki.nuigroup.com/Diffused_Illumination
  15. 15. FTIR: Frustrated Total Internal Reflection Frustrated Total Internal Reflection (FTIR) • [Hans 2005] • Luz confinada • Funcióna por presión • Excelente detección de dedos • No detecta objetos Ejemplos • Perceptive Pixel, Inc • Multi-touch Collaboration Wall (CNN, 2008) • TED:http://www.ted.com/talks/jeff_han_demos_his_breakthrough_touchscree n.html src: nuigroup, http://wiki.nuigroup.com/FTIR
  16. 16. LLP: LASER LIGHT PLANE ILLUMINATION Laser Light Illumination • LASER IR montado sobre la superficie • 1mm grosor src: nuigroup, http://wiki.nuigroup.com/Llp
  17. 17. LCD+IR Tecnologías Multicontacto
  18. 18. PIXELSENSETM Microsoft Surface 2.0 Samsung SRU40 (January 6, 2011, Microsoft previewed the latest version of Microsoft Surface at Consumer Electronics Show (CES) 2011) Características • Iluminación IR trasera • LCD + fotoreceptores integrados src: Microsoft Surface 2.0
  19. 19. CAPACITIVAS Tecnologías Multicontacto
  20. 20. projected- capacitive touch Ventajas • Larga duración • Excellent optimal performance • Sin límite de puntos Unlimited multi-touch Desventajas • Dificultad de intergración (sensible a interferencias electromágneticas) • Precio elevado (82’’ pixel perceptive) • Sólo dedos Ej: iphone src: XXXXXXXX).
  21. 21. Diamond TOUCH Acomplamiento capacitivo Detección de usuario src: Dietz, P.; Leigh, D. (2001).
  22. 22. DETECCIÓN DEDOS Tecnologías Multicontacto
  23. 23. DETECCIÓN DE DEDOS/MANOS src: Touchlib
  24. 24. DETECCIÓN DE DEDOS/MANOS Video que recibe la camára se procesa en blob/objetos Datos de seguimiento • Identificador, posición, tamaño, aceleración, rotación Eventos • Dedos posicionad, levantado, moviéndose Ejemplo • CCV: Community Core Vision (tbeta) • reacTIVision (permite Fiducials) • Touchlib • Touchè: Mac OS X: http://gkaindl.com/software/touche
  25. 25. Sesiones dedos Sesiones dedos Uno solo dedo Seguimiento trayectoria Seguimiento trayectoria Posición y acelareación Posición y acelareación Historia movimiento Historia movimiento Física mejoradaFísica mejorada Persistente mientras aprieta Persistente mientras aprieta
  26. 26. TUIO A Protocol for Table Based Tangible User Interfaces TUIO Protocol - Semantic types of set messages s sessionID, temporary object ID, int32 i classID (e.g. marker ID), int32 x, y, z position, float32, range 0...1 a, b, c angle, float32, range 0..2PI X, Y ,Z movement vector (motion speed & direction), float32 A, B, C rotation vector (rotation speed & direction), float32 m motion acceleration, float32 r rotation acceleration, float32 P free parameter, type defined by OSC packet header Extracted from: http://www.tuio.org/?specification
  27. 27. PROCESAR UN SOLO DEDO Cliente TUIO (Oficiales) • Processing • C++: • Java • C#: • Pure Data • Max/MSP • Quartz Composer • Flash AS3 Otros • VVVV: http://vvvv.org/ • Python • Squeak • Ruby • JavaScript • Matlab • …
  28. 28. RECONOCIMIENTO DE GESTOS Tecnologías Multicontacto
  29. 29. Multiples dedos Reconocimento gestos Reconocimento gestos Reconocimiento mano Reconocimiento mano Correspondencia Acciones Correspondencia Acciones Asociación dedos por proximidad Asociación dedos por proximidad Gestos específicos Gestos específicos Tocar, Rotar, Pellizcar… Tocar, Rotar, Pellizcar…
  30. 30. Ejemplos de gestos
  31. 31. Correspondencia gesto-acción 34
  32. 32. Más sobre gestos GESTO ACCIÓN Doble toque Menú circular Tick Correcto Dedo fijo y otro se mueve en esquina Hojear Encerrar con el dedo Seleccionar Cinco dedos que se cierran Borrar ¿? ¿? ● Mismo gestos distintas acciones. Ej. Separar para agrandar y copiar ● Anclas especiales para realizar gestos. Ej. Hojear ● Usar los bordes de la superficie ● El reverso de las ventanas se puede emplear
  33. 33. PROCESAR GESTOS Código abierto • PyMT • Grafiti • Squidy • SparshUI • Midas • libTISCH • MT4j • FLING Comerciales • Surface SDK • DiamondTouch SDK • Gestureworks (Flash y Flex)
  34. 34. http://amilab.ii.uam.es/fling Main Developer MTUI Researcher MTUI Researcher MTUI Researcher Head of Lab Graphic Designer Pablo.Llinas@uam.es German.Montoro@uam.es Manuel.GarciaHerranz@uam.es Pablo.Haya@uam.es Xavier.Alaman@uam.es Gemma.DeCastro@uam.es Descargars manuales, videos, fotos…
  35. 35. Video FeedVideo Feed Atomic EventsAtomic Events Visual ApplicationVisual Application Gesture Interpretation Gesture Interpretation Resumen de FLING
  36. 36. Virtual Working Area Virtual Working Area Multiple Input Devices with Different Protocols Multiple Input Devices with Different Protocols Events Captured by Workspace Listeners Events Captured by Workspace Listeners Tree Structured Objects Tree Structured Objects Event Target Search Event Target Search FLING Object Detail FLING Object Detail Raw Event Unification Raw Event Unification Advanced Gesture Interpretation Advanced Gesture Interpretation Functions Triggered by Gestures Functions Triggered by Gestures FLING en detalle
  37. 37. VIDEO http://www.youtube.com/pebs74 Ejemplos
  38. 38. OTROS
  39. 39. Consideraciones de diseño Se emplean las manos y los dedos • Diseñar controles tamaños adecuado (1cm diámetro ó 1x1cm2) • PPI (Pixels per Inch): medida de densidad. PPI=pixels/inch (se suele utilizar la diagonal) • 1 cm (0.4 inch) • Nokia N800 4.1'', 800x480, PPI 225, 1cm => 90p • Touchscreen 15'', 1024x768, PPI 85, 1cm => 34p • Icerberg tips y adaptive targets • Las manos pueden cubrir la pantalla • Diestros vs. Zurdos
  40. 40. TANGIBLES + MESAS MULTICONTACTO Superficies de Interacción Superficies en las que se puede interactuar mediante elementos tangibles. Adecuada para trabajo colaborativo. Urp (1999) metaDesk (1997) ActuatedWorkbench (2002)
  41. 41. TANGIBLES + MESAS MULTICONTACTO Fiduciales
  42. 42. TANGIBLES + MESAS MULTICONTACTO Interfaces que al contrario que la mayoría de las TUI pueden cambiar su forma. Illuminate Clay (2002) SandScape (2004)
  43. 43. REFERENCIAShttp://delicious.com/phaya/nui
  44. 44. Páginas web Historicas • Bill Buxton (http://billbuxton.com/multitouchOverview.html) • Jeff Han (http://cs.nyu.edu/~jhan) • Demostración TED (http://www.ted.com/talks/jeff_han_demos_his_breakthrough_touchscreen.html) Tecnologías • Do-It-Yourself (http://nuigroup.org) • Microsoft Surface (http://www.microsoft.com/surface) • Perceptive Pixel (http://www.perceptivepixel.com/) • Projected-Capacitive (www.walkermobile.com/March_2010_ID_Projected_Capacitive.pdf) (www.touchinternational.com/literature/whitepapers/ProjectedCapacitiveTechnology.pdf)
  45. 45. Páginas web Reconomiento de dedos • CCV: Communitiy Core Vision (aka tbeta) (http://ccv.nuigroup.com/) • reacTIVision (http://reactivision.sourceforge.net/) • Touchlib (http://nuigroup.com/touchlib/) • TUIO (http://tuio.org) • Touchè (http://gkaindl.com/software/touche)
  46. 46. PAGINAS WEB Reconomiento de gestos • Grafiti (Master Thesis) (http://grafitiproject.wordpress.com/) • Kivy (Python, LGPL) (http://kivy.org) • PyMT (Python, LGPL) (http://pymt.eu/) • Squidy (Java, LGPL) (http://www.squidy-lib.de/) • SparshUI (LGPL, C++, Java) (http://code.google.com/p/sparsh-ui/) • Midas (http://groups.google.com/group/midas-framework) • libTISCH (C++ with bindings for C#, Java, Python, LGPL) (http://tisch.sourceforge.net/) • MT4j (http://www.mt4j.org) • FLING (http://amilab.ii.uam.es/fling)
  47. 47. PAGINAS WEB Reconomiento de gestos (Comerciales) • MS Surface SDK (Gratuita) (http://www.microsoft.com/surface) • DiamodTouch SDK (http://www.merl.com/areas/dtsdk/) • Gesture Works (http://gestureworks.com/)
  48. 48. Libros Müller-Tomfelde, C. (Ed.) (2010) Tabletops - Horizontal Interactive Displays Springer; 1st Edition. edition (May 6, 2010) Saffer, D (2008) Designing Gestural Interfaces: Touchscreens and Interactive Devices. O'Reilly Media; 1 edition (December 3, 2008) Saffer, D. (2009) Designing for Interaction: Creating Innovative Applications and Devices (2nd Edition) New Riders Press; 2 edition (August 24, 2009) Wigdor, D. & Wixon, D. (2011) Brave NUI World: Designing Natural User Interfaces for Touch and Gesture. Morgan Kaufmann; 1 edition (April 27, 2011)
  49. 49. ARTICULOS libTISCH: Echtler, F., Klinker., G.: A Multitouch Software Architecture. In 5th Nordic Conference on Human-Computer Interaction (NordiCHI 2008), pp. 463--466 (2008) DIAMONDTOUCH: Dietz, P.; Leigh, D. (2001). "DiamondTouch: A Multi-User Touch Technology". Proceedings of the 14th annual ACM symposium on User interface software and technology. f. UIST: Orlando, FL. pp. 219–226. FTIR: Han, J. Y. 2005. Low-Cost Multi-Touch Sensing through Frustrated Total Internal Reflection. In Proceedings of the 18th Annual ACM Symposium on User Interface Software and Technology PyMT: Hansen, T. E., Hourcade, J. P., Virbel, M., Patali, S., Serra, T.: PyMT: a post-WIMP multi-touch user interface toolkit. In: ACM International Conference on Interactive Tabletops and Surfaces (ITS '09), pp. 17--24. ACM, New York (2009) Historical: Johnson, J. and Roberts, T. L. The Xerox "Star": A Retrospective. IEEE Computer, September 1989 Squidy: König, W. A., Rädle, R., Reiterer, H.: Squidy: a zoomable design environment for natural user interfaces. In: 27th international conference extended abstracts on Human factors in computing systems (CHI EA '09), pp. 4561--4566. ACM, New York (2009)
  50. 50. ARTICULOS TUIO: Kaltenbrunner, M., Bovermann, T., Bencina, R., Costanza, E.: "TUIO - A Protocol for Table Based Tangible User Interfaces". Proceedings of the 6th International Workshop on Gesture in Human-Computer Interaction and Simulation (GW 2005), Vannes, France, 2005 MT4j: Laufs, U., Ruff, C., Zibuschka, J.: MT4j - A Cross-platform Multi-touch Development Framework. In: Engineering Patterns for Multi-Touch Interfaces 2010, Workshop of the ACM EICS (2010) Historical: Nakatani, L. H. & Rohrlich, John A. (1983). Soft Machines: A Philosophy of User-Computer Interface Design. Proceedings of the ACM Conference on Human Factors in Computing Systems (CHI’83), 12-15. Grafiti: De Nardi, A: Grafiti: Gesture Recognition mAnagement Framework for Interactive Tabletop Interfaces. Diploma thesis. University of Pisa (2008) SparshUI: Ramanahally, P., Gilbert, S., Niedzielski, T., Velázquez, D., Anagnost, C.: Sparsh UI: A Multi-Touch Framework for Collaboration and Modular Gesture Recognition. In Proc. of WINVR 2009, Conference on Innovative Virtual Reality, pp 1–-6 (2009) Historical: Shneiderman, Ben, Direct Manipulation: A Step Beyond Programming Languages, IEEE COMPUTER, 16, 8, (August 1983), 57-69. Midas: Scholliers, C., Hoste, L., Signer, B., De Meuter, W.: Midas: a declarative multi- touch interaction framework. In: 5th International Conference on Tangible, Embedded, and embodied Interaction (TEI '11), pp. 49--56. ACM, New York (2011)

×