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.160 Aufrufe

Veröffentlicht am

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

Veröffentlicht in: Design, Technologie, Kunst & Fotos
1 Kommentar
0 Gefällt mir
Statistik
Notizen
  • 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!

Keine Downloads
Aufrufe
Aufrufe insgesamt
1.160
Auf SlideShare
0
Aus Einbettungen
0
Anzahl an Einbettungen
8
Aktionen
Geteilt
0
Downloads
58
Kommentare
1
Gefällt mir
0
Einbettungen 0
Keine Einbettungen

Keine Notizen für die Folie
  • Eadweard Muybridge, 1887: Animal Locomotion\n
  • \n
  • Light pen: Luftüberwachung, 1987 für C64 nachgebaut\n30 Jahre zwischen Vorstellung der Maus bis zur universellen Verfügbarkeit\nHeute gibt es für Multitouch unzählige Anwendungen: Kunst im öffentlichen Raum, Diskotheken (VJ) Weitere: interaktives Whiteboard, \n
  • Als nächstes kommt verry Lowcost\n\n
  • \n
  • \n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Keine Grenzen bei der Interaktion: Processing, Falsh, PureData, Quartz, V4...\nDas Resultat kann manigfaltig sein: Video, Audio, Robotik ....\n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • Experiment bauen (Karton auf den Tisch,...\n
  • Experiment bauen (Karton auf den Tisch,...\n
  • Experiment bauen (Karton auf den Tisch,...\n
  • Materialeinsatz: unter 20 EUR\n.... Webcam anschließen, Touché starten und zeigen....\n
  • \n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • Experiment mit Arduino Board zeigen\nWer kann die LED mit seiner Kamera sehen?\nZusätzlich zu dem Experiment wird eine Beamer, eine IR-Lichtquelle und ein Schwarz-FIlter benötigt\n
  • \n
  • \n
  • \n
  • \n
  • Fertige Produkte: Reactable\n
  • Microsoft Surface\n
  • Beim Bau kein Kit oder exakte Anleitungen im Netz --> Check www.idwerk.de\nFehler: Keine Mattscheibe, Reflexionen, Ungenügende (IR)-Lichtausbeute\n
  • \n
  • Bildschirme sind ein sehr kleines „Fenster“ in die Welt des Rechners (kein direktes arbeiten möglich)\nWIN 7 integriert, Frameworks nutzen\nJe nach Anforderung, POS, Museen, Kollaboratives Arbeiten\n
  • \n
  • Bau des Multitouch zeigen (Diashow)\n
  • 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

    ×