Touch Interaction
Konzeptuelle Beschreibung von Berührungs-basierten Interaktionen auf Touch-Displays, inklusive Gesten, Zielgrößen und Feedbackmechanismen.
Klassifikation
- KomplexitätMittel
- AuswirkungTechnisch
- EntscheidungstypDesign
- OrganisationsreifeFortgeschritten
Technischer Kontext
Prinzipien & Ziele
Use Cases & Szenarien
Kompromisse
- Fehlende Barrierefreiheit bei ausschließlicher Touch-Bedienung.
- Falsche Gestenerkennung kann unerwünschte Aktionen auslösen.
- Performance-Probleme bei komplexen Multitouch-Interaktionen.
- Verwende Mindestgrößen für Touch-Ziele (z. B. 44px Zielhöhe).
- Gib sofortiges visuelles Feedback bei Touch-Ereignissen.
- Teste auf mehreren realen Geräten mit unterschiedlichen Eingabeverzögerungen.
I/O & Ressourcen
- Design-Richtlinien und Styleguide
- Prototypen und Usability-Tests auf Zielgeräten
- Hardware- und Browser-Kompatibilitätsmatrix
- Implementierte und getestete Touch-Interaktionsmuster
- Dokumentierte Regeln für Zielgrößen und Gesten
- Monitoring-Metriken zur Interaktionsqualität
Beschreibung
Touch-Interaktion beschreibt UI-Muster und Eingabemodalitäten, die auf direktem taktilen Kontakt mit dem Display basieren. Sie umfasst Gesten, Touch-Ziele, Druck und Multitouch-Semantik und beeinflusst Layout, Rückmeldung und Barrierefreiheit. Insbesondere bei Interaktionen wie Scrollen, Zoomen und Drag-and-Drop sind Anpassungen nötig.
✔Vorteile
- Intuitive direkte Manipulation verbessert Nutzerbindung.
- Reduzierter Lernaufwand bei bekannten Gesten.
- Ermöglicht ergonomische Interaktionen auf mobilen Geräten.
✖Limitationen
- Präzision ist begrenzt bei kleinen Zielen.
- Unterschiedliches Verhalten auf verschiedenen Geräten und Browsern.
- Haptisches Feedback ist nicht auf allen Geräten verfügbar.
Trade-offs
Metriken
- Fehlerrate bei Touch-Events
Prozentsatz falscher oder ungewollter Touch-Aktionen im Test.
- Durchschnittliche Zeit bis zur Aktion
Zeitspanne zwischen Touch-Ereignis und sichtbarer Systemreaktion.
- Zugänglichkeitstest-Score
Bewertung der Erfüllung von Barrierefreiheitskriterien für Touch.
Beispiele & Implementierungen
iOS Home-Bildschirm Gesten
Systemweite Wisch- und Tipparbeiten als Referenz für Konsistenz zwischen Apps.
Mobile Web: responsive Touch-Buttons
Anpassung von Zielgrößen und Hit-Areas für verschiedene Breakpoints.
Mapping-App: Pinch-to-Zoom
Implementierung von Multitouch-Zoom mit flüssiger Rückmeldung und Grenzen.
Implementierungsschritte
Konzeption: Gesten, Zielgrößen und Feedback definieren.
Prototyping: Testen auf realen Geräten und Iteration.
Integration: Performance-Optimierung und Accessibility-Checks.
⚠️ Technische Schulden & Engpässe
Tech Debt
- Hardcodierte Zielgrößen, die nicht responsive sind.
- Fehlende Tests für ältere Geräte und Browser.
- Spaghetticode im Event-Handling ohne zentrale Abstraktion.
Bekannte Engpässe
Beispiele für Missbrauch
- Menus, die nur durch komplexe Mehrfinger-Gesten zugänglich sind.
- Kritische Aktionen ohne Bestätigung nach versehentlichem Tap.
- Verwendung von Touch-only Patterns ohne alternative Eingabewege.
Typische Fallen
- Nicht berücksichtigte Scroll- vs. Swipe-Konflikte.
- Zu kurze Zeitfenster für Long-Press-Erkennung.
- Ignorieren der Fingergröße bei kleinen Geräten.
Erforderliche Fähigkeiten
Drivers (Architectural Drivers)
Constraints
- • Unterschiedliche physische Bildschirmgrößen und Pixeldichten.
- • Unzuverlässige Haptik-APIs und eingeschränkte Hardwarezugriffe.
- • Einschränkungen durch Browser- oder OS-Implementierungen.