MultitouchInteraktionenStefan DinterDinter | Multitouch Interaktionen | Überblick
Überblick • Einführung • Multitouch Interface & Experiment (DIY) • Multitouch Display (optisch) • Grenzen • AusblickDinter...
Einführung •   First Touch: Light pen (Lincoln Laboratory (MIT), 1949)     Erste CAD-Anwendung Sketchpad, 1963 •   Compute...
Abgrenzung     •   Resistive Systeme     •   Kapazitive Systeme     •   Induktive Systeme     •   SAW (Surface Acoustic Wa...
Einführung •   Jeff Han at TED 2006     •   High Resolution     •   Geringe Kosten     •   Einfach zu implementierenDinter...
Multitouch Interface (DIY) •   Erkennen von Lichtspitzen, sogenannten „Blobs“     mittels Kamera •   Zuordnen der „Blobs“ ...
Dinter | Multitouch Interaktionen | Überblick
Pre-Processing  Image(QuartzCor    e)   Capture Image   Dinter | Multitouch Interaktionen | Überblick
Pre-Processing                 Blob Tracking  Image                      Framework(QuartzCor                   (Touchlib) ...
Pre-Processing                 Blob Tracking              Interaction  Image                      Framework               ...
Pre-Processing                 Blob Tracking              Interaction              Result  Image                      Fram...
Funktion Blob TrackingDinter | Multitouch Interaktionen | Überblick
Funktion Blob TrackingDinter | Multitouch Interaktionen | Überblick
Funktion Blob TrackingDinter | Multitouch Interaktionen | Überblick
Beispiel InteraktionDinter | Multitouch Interaktionen | Überblick
Beispiel Interaktion •   Beispiel für die Verarbeitung mit     Processing und dem Framework MSA FluidDinter | Multitouch I...
Beispiel Interaktion •   Beispiel für die Verarbeitung mit     Processing und dem Framework MSA FluidDinter | Multitouch I...
Kosten & Aufwand •   Schnell                                    Gegenstand    EUR •   Einfach                             ...
Multitouch Display(optisch) •   Bilderkennung, wie bei Experiment, besondere     Lichtverhältnisse •   Direktes Arbeiten (...
Optischer Trick •   CCDs erkennen ein     größeres LichtspektrumDinter | Multitouch Interaktionen | Überblick
AufbauDinter | Multitouch Interaktionen | Überblick
Aufbau                      0.01nm   1nm   100nm      1mm   1cm   1m     1km                      400nm                   ...
Aufbau                      0.01nm     1nm   100nm        1mm   1cm   1m     1km                      400nm               ...
Aufbau                      0.01nm     1nm   100nm        1mm   1cm   1m     1km                      400nm               ...
Aufbau                      0.01nm     1nm   100nm          1mm   1cm   1m     1km                      400nm             ...
Aufbau                      0.01nm     1nm   100nm          1mm   1cm   1m     1km                      400nm             ...
Aufbau                      0.01nm     1nm   100nm           1mm   1cm   1m     1km                      400nm            ...
Aufbau                                                                  850 nm                                            ...
Optische Bauformen •   Frustrated Total Internal Reflection (FTIR)     Totalreflektion •   Diffused Illumination (DI) •   Di...
SchemaDinter | Multitouch Interaktionen | Überblick
AcrylglasMultitouch-Tisch|FTIRQuelle: Tim Roth                                                   LEDsLEDs                 ...
Multitouch-Tisch|DIQuelle: Tim Roth                                Acrylglass     PC                                      ...
Reactablewww.reactable.comDinter | Multitouch Interaktionen | Überblick
Surfacewww.microsoft.com/surfaceDinter | Multitouch Interaktionen | Überblick
Multitouch-Tisch|DIQuelle: Stefan DinterDinter | Multitouch Interaktionen | Überblick
Grenzen • Sehr wenige Informationen über Multitouch-   Interaktionen, obwohl bereits seit über 25 Jahren   Geräte zur Verf...
Ausblick • Überwindung der herkömmlichen   Interaktionsschnittstelle Screen • In Systemen integriert oder leicht nachzuins...
Quellen•   Theorie    http://www.billbuxton.com/multitouchOverview.html•   Bilderkennung (Frameworks)    reacTIVision > ht...
Danke für‘s Zuhören.Stefan DinterDiplom-DesignerLehrauftrag «Interaktive Medien» am Lehrstuhl Kunstpädagogik, Friedrich-Al...
Nächste SlideShare
Wird geladen in …5
×

UX Stammtische Franken

1.347 Aufrufe

Veröffentlicht am

Vortrage über die Funktionsweise von Multitouch-Tischen und -Interaktionen beim UX Stammtisch Franken

Veröffentlicht in: Design, Technologie, Kunst & Fotos
  • tanx is very small word for your information
       Antworten 
    Sind Sie sicher, dass Sie …  Ja  Nein
    Ihre Nachricht erscheint hier
  • Gehören Sie zu den Ersten, denen das gefällt!

UX Stammtische Franken

  1. 1. MultitouchInteraktionenStefan DinterDinter | Multitouch Interaktionen | Überblick
  2. 2. Überblick • Einführung • Multitouch Interface & Experiment (DIY) • Multitouch Display (optisch) • Grenzen • AusblickDinter | Multitouch Interaktionen | Überblick
  3. 3. Einführung • First Touch: Light pen (Lincoln Laboratory (MIT), 1949) Erste CAD-Anwendung Sketchpad, 1963 • Computermäuse (Engelbart & English, 1963/64) brauchten gebrauchstaugliche Interfaces: Xerox Star und PERQ, 1982 • Touch Displays wurden bereits Mitte der 60er Jahre entwickelt Erstes gebrauchstaugliches Gerät: IBM PLATO IV, 1972Dinter | Multitouch Interaktionen | Überblick
  4. 4. Abgrenzung • Resistive Systeme • Kapazitive Systeme • Induktive Systeme • SAW (Surface Acoustic Wave – Schallwellengesteuerte Systeme) • Dispersive-Signal-Technology-SystemeDinter | Multitouch Interaktionen | Überblick
  5. 5. Einführung • Jeff Han at TED 2006 • High Resolution • Geringe Kosten • Einfach zu implementierenDinter | Multitouch Interaktionen | Überblick
  6. 6. Multitouch Interface (DIY) • Erkennen von Lichtspitzen, sogenannten „Blobs“ mittels Kamera • Zuordnen der „Blobs“ in ein Koordinatensystem (2D) • Universelles Protokoll für Datenversand (MIDI/OSC/ TUIO) • Interaktionsapplikation empfängt und verarbeitet diese DatenDinter | Multitouch Interaktionen | Überblick
  7. 7. Dinter | Multitouch Interaktionen | Überblick
  8. 8. Pre-Processing Image(QuartzCor e) Capture Image Dinter | Multitouch Interaktionen | Überblick
  9. 9. Pre-Processing Blob Tracking Image Framework(QuartzCor (Touchlib) e) Capture Image Point Detection Blob Tracking Gesture Recordination Send Pack (e.g. TUIO) Dinter | Multitouch Interaktionen | Überblick
  10. 10. Pre-Processing Blob Tracking Interaction Image Framework Processing(QuartzCor (Touchlib) (Processing e) ) Capture Image Point Detection Recive Pack Protocol Blob Tracking Process Events Gesture Recordination Send Pack (e.g. TUIO) Dinter | Multitouch Interaktionen | Überblick
  11. 11. Pre-Processing Blob Tracking Interaction Result Image Framework Processing Output(QuartzCor (Touchlib) (Processing e) ) Video/ Capture Image Point Detection Recive Pack Protocol Audio Blob Tracking Process Events Gesture Recordination Send Pack (e.g. TUIO) Dinter | Multitouch Interaktionen | Überblick
  12. 12. Funktion Blob TrackingDinter | Multitouch Interaktionen | Überblick
  13. 13. Funktion Blob TrackingDinter | Multitouch Interaktionen | Überblick
  14. 14. Funktion Blob TrackingDinter | Multitouch Interaktionen | Überblick
  15. 15. Beispiel InteraktionDinter | Multitouch Interaktionen | Überblick
  16. 16. Beispiel Interaktion • Beispiel für die Verarbeitung mit Processing und dem Framework MSA FluidDinter | Multitouch Interaktionen | Überblick
  17. 17. Beispiel Interaktion • Beispiel für die Verarbeitung mit Processing und dem Framework MSA FluidDinter | Multitouch Interaktionen | Überblick
  18. 18. Kosten & Aufwand • Schnell Gegenstand EUR • Einfach Webcam 13.95 € • Günstig Karton 0.00 € Glasscheibe 5.00 € 0.02 € Butterbrotp. Gesamt 18.97 €Dinter | Multitouch Interaktionen | Überblick
  19. 19. Multitouch Display(optisch) • Bilderkennung, wie bei Experiment, besondere Lichtverhältnisse • Direktes Arbeiten (Eingabegerät = Ausgabegerät) • ohne Hilfsmittel auf dem Screen • Vielzahl an Frameworks und ScriptsDinter | Multitouch Interaktionen | Überblick
  20. 20. Optischer Trick • CCDs erkennen ein größeres LichtspektrumDinter | Multitouch Interaktionen | Überblick
  21. 21. AufbauDinter | Multitouch Interaktionen | Überblick
  22. 22. Aufbau 0.01nm 1nm 100nm 1mm 1cm 1m 1km 400nm 700nmDinter | Multitouch Interaktionen | Überblick
  23. 23. Aufbau 0.01nm 1nm 100nm 1mm 1cm 1m 1km 400nm 700nm Sichtbares Licht: Mensch entsprichtDinter | Multitouch Interaktionen | Überblick
  24. 24. Aufbau 0.01nm 1nm 100nm 1mm 1cm 1m 1km 400nm 700nm Sichtbares Licht: Mensch entspricht IR-QuelleDinter | Multitouch Interaktionen | Überblick
  25. 25. Aufbau 0.01nm 1nm 100nm 1mm 1cm 1m 1km 400nm 700nm Sichtbares Licht: Mensch entspricht IR-Quelle Sichtbares Licht: WebcamDinter | Multitouch Interaktionen | Überblick
  26. 26. Aufbau 0.01nm 1nm 100nm 1mm 1cm 1m 1km 400nm 700nm Sichtbares Licht: Mensch entspricht IR-Quelle Sichtbares Licht: Webcam Schwarz-FilterDinter | Multitouch Interaktionen | Überblick
  27. 27. Aufbau 0.01nm 1nm 100nm 1mm 1cm 1m 1km 400nm Anzeigen 700nm Erkennen Sichtbares Licht: Mensch entspricht IR-Quelle Sichtbares Licht: Webcam Schwarz-FilterDinter | Multitouch Interaktionen | Überblick
  28. 28. Aufbau 850 nm + 0.01nm 1nm 100nm 1mm 1cm 1m 1km 400nm Anzeigen 700nm Erkennen Sichtbares Licht: Mensch entspricht IR-Quelle Sichtbares Licht: Webcam Schwarz-FilterDinter | Multitouch Interaktionen | Überblick
  29. 29. Optische Bauformen • Frustrated Total Internal Reflection (FTIR) Totalreflektion • Diffused Illumination (DI) • Diffused Surface Illumination (DSI) • Laser Light Plane (LLP) • LED Light Plane (LED-LP)Dinter | Multitouch Interaktionen | Überblick
  30. 30. SchemaDinter | Multitouch Interaktionen | Überblick
  31. 31. AcrylglasMultitouch-Tisch|FTIRQuelle: Tim Roth LEDsLEDs ProjektorComputerSpiegel KameraDinter | Multitouch Interaktionen | Überblick
  32. 32. Multitouch-Tisch|DIQuelle: Tim Roth Acrylglass PC LED Strahler Projektor Spiegel Kamera LED StrahlerDinter | Multitouch Interaktionen | Überblick
  33. 33. Reactablewww.reactable.comDinter | Multitouch Interaktionen | Überblick
  34. 34. Surfacewww.microsoft.com/surfaceDinter | Multitouch Interaktionen | Überblick
  35. 35. Multitouch-Tisch|DIQuelle: Stefan DinterDinter | Multitouch Interaktionen | Überblick
  36. 36. Grenzen • Sehr wenige Informationen über Multitouch- Interaktionen, obwohl bereits seit über 25 Jahren Geräte zur Verfügung stehen • Rechenintensive Erkennung der Gesten oder Fiducials • Keine standarisierten Gesten • Zum Teil Abhängig vom UmgebungslichtDinter | Multitouch Interaktionen | Überblick
  37. 37. Ausblick • Überwindung der herkömmlichen Interaktionsschnittstelle Screen • In Systemen integriert oder leicht nachzuinstallieren • Nicht für jeden Bereich ist Multitouch optimal – Maus/Tastatur werden auch in Zukunft bleiben • Weitere Devices für Multitouch: mehrere Displays kombinieren, SmartPhone, SmartPad, TrackPadDinter | Multitouch Interaktionen | Überblick
  38. 38. Quellen• Theorie http://www.billbuxton.com/multitouchOverview.html• Bilderkennung (Frameworks) reacTIVision > http://reactivision.sourceforge.net Touché > http://gkaindl.com/software/touche• Protokoll/Experiment (Sourcecode/Binary) TUIO > http://www.tuio.org XTUIO > http://www.xtuio.com• Entwicklungsumgebung (IDE) Processing > http://processing.orgDinter | Multitouch Interaktionen | Überblick
  39. 39. Danke für‘s Zuhören.Stefan DinterDiplom-DesignerLehrauftrag «Interaktive Medien» am Lehrstuhl Kunstpädagogik, Friedrich-Alexander-Universität Erlangen-NürnbergAdobe Certified Expert (ACE) Adobe Acrobat ProfessionalMitgliedschaften:Deutsche Gesellschaft für Designtheorie und -forschung e.V. (DGTF), Alliance of German Designers e.V. (AGD),Usability Professionals‘ Association (G|UPA), Interaction Design Association (IxDA)Dinter | Multitouch Interaktionen | Überblick

×