SlideShare ist ein Scribd-Unternehmen logo
1 von 48
Downloaden Sie, um offline zu lesen
Überall die Finger drin:
Anforderungen an das Touchscreen-Design
Alles wird mobil – soultank World Usability Day Event 2011
Agenda
 Einsatzgebiete von Touch-Technologien
 Nutzungskontextanalyse
 Gestaltungsrichtlinien
 Literatur & Links




                     soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 2
Touchscreens im Alltag




                   soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 3
Touchscreens im Alltag




                   soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 4
Touch-Technologien

  Existenz von Vielzahl an Touch-Technologien
       Branchenanalytiker zählten im Jahr 2009 rund
       20 unterschiedliche Touch-Technologien*
       Beispiele: Kapazitive, optische, druckempfindliche,
       (Schall)wellengesteuerte Touch Technologien, Multi-Touch usw.

  Haben jeweils unterschiedliche Stärken und Schwächen,
  da ihnen unterschiedliche Techniken zu Grunde liegen
  Produkte mit Touch-Technologie zeichnen sich jeweils
  durch andere Charakteristiken aus
  Einige Kunden und Märkte verlangen nach speziellen
  Touch-Technologien
  * Quelle: NZZ, 07/2009   soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 5
Touch-Technologien

     Durch Apples Einführung von Iphone usw. haben
     Touchscreens Weg in breite Masse gefunden
     Studie* von Gartner
          Für 2013 erwartet, dass mehr als Hälfte (58 %) von verkauften
          Mobiltelefonen über Touchscreen steuerbar sein wird
          Besonders hohe Touchscreen-Verbreitung auf hoch entwickelten
          Märkten (USA, westliche Teile Europas)




* Future Wireless Trends diskutiert auf Gartner Wireless, Networking & Communications Summit 2010, April 19-21,
  San Diego [URL: http://www.gartner.com/it/page.jsp?id=1313415]


                                           soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 6
Agenda
 Einsatzgebiete von Touch-Technologien
 Nutzungskontextanalyse
 Gestaltungsrichtlinien
 Literatur & Links




                     soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 7
Nutzungsorientierter Gestaltungsprozess




                   soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 8
Nutzungskontextanalyse: Beispiel

  Benutzer-, Aufgaben- und Kontextanalyse


                                                             Benutzer:
    Kontext:
                                                            Mann, Alter
 Business, Mobil
                                                            unbekannt




    Aufgabe:                                                  System:
  Dateneingabe                                            Stiftbedienung
                                                           Touchscreen




  Quelle: Modell abgeleitet von Michael Herczeg   soultank AG | 10.11.2011 | Folie 9
In welchem Kontext wird mobiles Touchscreen benutzt?

  Nutzungssituationen
      Zu Hause: 84 %
      Verschiedene Pausen während Tag: 80 %
      Während Wartezeit in Schlangen und in Einrichtungen: 74 %
      Während «Shopping»: 69 %
      Während Arbeiten: 64 %
      Während TV Schauen: 62 %
      Während Pendeln: 47 %




  Quelle: Luke Wroblewski. Mobile First. (2011)   soultank AG | 10.11.2011 | Folie 10
Welcher Interaktionstyp bist Du?

  Vier wichtige Interaktionstypen
   1.    Lookup/Find
         «Ich benötige aktuell eine Antwort zu bestimmten Thema.»
   2.    Explore/Play
         «Ich will etwas Zeit überbrücken und mich ablenken.»
   3.    Check in/Status
         «Es ändert/aktualisiert sich etwas und ich möchte Bescheid wissen.»
   4.    Edit/Create
         «Ich muss jetzt etwas Dringendes tun, was nicht warten kann.»




  Quelle: Luke Wroblewski. Mobile First. (2011)           soultank AG | 10.11.2011 | Folie 11
Nutzungskontextanalyse: Ergebnis

  Realitätsnahe auf Benutzer, Aufgaben und Kontext
  ausgerichtete mobile Anwendungsfälle, die Mehrwert
  für Benutzer bieten
  Beschränkung von Online-Services nicht auf ein Gerät
    Je nach Anwendungssituation unterschiedliche Geräte möglich



           “It looks like a giant iPhone,” is the first thing
                users say when asked to test an iPad.
             Their second comment? “Wow, it's heavy.”

           Quelle: Jakob Nielsen's Alertbox, 26.04.2010: iPad Usability: First Findings From User Testing


                                soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 12
Nutzungskontextanalyse: Ergebnis

  Mobile Website vs. App
  3 Möglichkeiten für mobile Inhalte
      Responsive Layout für Website
      Separate mobile Website
      Native Applikationen (Apps)

  Nutzerforschung* (2011) zeigt:
      Erfolgsrate bei mobilen Websites: 64 %
      Erfolgsrate bei Desktop-Websites auf mobilen Geräten: 58 %

      App noch besser: Erfolgsrate 76 %


  * http://www.useit.com/alertbox/mobile-usability.html   soultank AG | 10.11.2011 | Folie 13
Inhaltsverzeichnis
  Einsatzgebiete von Touch-Technologien
  Nutzungskontextanalyse
  Gestaltungsrichtlinien
  Literatur & Links




                      soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 14
Inhalt



         | Folie 15
Inhalt: Tipps & Tricks

  Inhaltlich stark auf Wesentliches beschränken
     Hauptinhalte integrieren, alle anderen Inhalte entfernen
     Keinen Werbetext einsetzen

  Starke Reduzierung von textlichem Inhalt
  Integration nur wichtigster Zusatzfunktionen (Features);
  Beschränkung sinnvoll
  Wichtigste Links als Hauptinhalt einbinden (Startseite), die
  auf Unterseiten verweisen (in Unterseiten auslagern)



                        soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 16
Inhalt: Positives Beispiel

  Varianten: Corporate Website, Mobile Website




                      soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 17
Inhalt: Negatives Beispiel

  Keine Variante: Corporate Website




                     soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 18
Design
Design: Tipps & Tricks

  Geringere Bildschirmauflösungen bei mobilen Geräten
  Gängige Bildschirmauflösungen
     800 x 480 px (Android)
     960 x 640 px (Iphone)
     1024 X 768 px (Ipad)

  Informationsangebot, Layout, Navigation müssen Grösse
  entsprechend angepasst werden
  Bildschirme und Verarbeitungsdauer können sich stark
  voneinander unterscheiden
  Je nach Anforderung unterschiedliche Versionen von
  mobilen Websites
                        soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 20
Design: Tipps & Tricks

  Design von Schaltflächen
  Größe von Schaltflächen
  Feedback und Akzeptieren von Eingaben
  Einfaches GUI-Design
  Farbigkeit
  Wahlmöglichkeiten begrenzen




                    soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 21
Design: Tipps & Tricks

  Wichtige «Call to actions» visuell in Vordergrund stellen




                      soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 22
Design: Positives Beispiel




                     soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 23
Design: Negatives Beispiel




                    soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 24
Navigation
Navigation: Tipps & Tricks

  Informationsarchitektur
     Navigationsoptionen einschränken
     Flache Navigationsstruktur einbinden

  Benutzerführung ist A und O
  Startseite
     Variante A: Benutzerbedürfnis schnelle Navigation und Suche
     Variante B: Auf E-Commerce Websites

  Auf Unterseiten Navigation im unteren Bildschirmbereich
  einbinden
  Zurück-Button nur auf Unterseiten anbieten
                        soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 26
Navigation: Positive Beispiele

  Flache Navigationsstruktur: 1 Klick
  Startseite auf Wichtigstes reduziert




                     soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 27
Navigation: Negative Beispiele

  Startseiten nicht auf Wichtigstes reduziert
  Lenkt von
  Navigation ab
  Werbe-Teaser
  störend
  Corporate
  Website und
  App nicht
  ausreichend,
  mobile Website
  fehlt
                      soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 28
Funktion
Funktion: Tipps & Tricks

  Texteingaben minimieren
  Texteingabe auf mobil genutzten Geräten wesentlich
  schwieriger als auf Desktop-PC oder Laptop-Tastatur
  Reduzierungswege: Nutzung von hinterlegten Daten z. B.
  unter «My Account» ermöglichen, Fragen ob Nutzer lieber
  PIN statt Passwort eingeben wollen, Vorteile von
  integrierten Funktionalitäten nutzen




                    soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 30
Funktion: Tipps & Tricks

  Vorteile von integrierter Funktionalität nutzen
     Telefonanrufe ermöglichen
     automatisches Anstossen eines Anrufs bei Klick auf Tel.-Nr.
     Adresse auf Karte anzeigen
     «Finde das nächste…» (GPS)
     Input-Eingabe auf innovativen Wegen
        QR Codes, Barcodes




                         soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 31
Funktion: Positive Beispiele

  Hilfreiche Funktionen
  Unterstützung durch Hardware (z. B. GPS, Kamera)




                     soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 32
Inhalt: Negative Beispiele

  Einbinden von integrierter Funktion wäre bei App möglich
  (z. B. Aktueller Standort, Route festlegen)
  Klickbereich in Navigation zu klein




                      soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 33
Interaktion
Interaktion: Tipps & Tricks – Input

  Einfache Gesten




                     soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 35
Interaktion: Tipps & Tricks – Input

  Komplexere Gesten




  Touch Gesture Cards (PDF): Luke Wroblewski)

                                            soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 36
Interaktion: Beispiele – Input

  Wenig bekannte Gesten
     Wischen erzeugt Submenü




     Zurück/weiter-Buttons bei
   Formulareingaben




                       soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 37
Interaktion: Tipps & Tricks – Input

  «Für den dicken Finger designen»
     MIT: Fingerbeere Ø 10-14 mm breit
     Fingerspitze Ø 8-10 mm breit

     Detailangaben für verschiedene Plattformen: www.lukew.com,
     Touch Target Sizes




                       soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 38
Interaktion: Tipps & Tricks – Input

  Für Rechts- und Linkshänder designen
  Websites: Navigationsleiste oft links -> ungünstig für
  Rechtshänder
  Browsererkennung: für mobile Geräte alternative
  Navigation anbieten




                      soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 39
Interaktion: Stolpersteine

  Kein Maus-Zeiger vorhanden
     User wissen immer, wo ihr Finger ist

  Nicht möglich, versch. Maus-Stati anzuzeigen
  Status-Anzeige möglich durch Hervorhebung (Farbe, Rand,
  Animation o.ä.)
  Keine Analogie zu Maus-Button Interaktion
  (anzeigen und auslösen in 1 Schritt)




                        soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 40
Interaktion: Stolpersteine

  Vermeiden:
     Javascript-Tooltips mit wichtigen Informationen
     Auslösende Elemente via Hover-Status (zB editieren, löschen)
     Grafiken oder Fotos, welche erst bei Hover-Status vollständig
     angezeigt werden
     Drop-down Menüs. Falls tap möglich, klaren Hinweis darauf
     geben.
     Zu stark auf Hover-abhängiges CSS3 fokussieren. Multi-touch User
     sehen die coolen Effekte nicht.




                        soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 41
User Experience & Usability
User Experience & Usability – Tipps & Tricks

  Mobile Anwendungen intuitiv gestalten
  Fokus: KISS-Prinzip «Keep it short and simple»
  «Joy of Use» in Vordergrund stellen
  Performanz im Hinterkopf behalten
     Bei träger Anwendung verliert Benutzer schnell Interesse
     Aufmerksamkeit durch schnelle Reaktion auf Berührung steigern

  Konzipiertes Produkt unbedingt mit Zielgruppe testen
     Test mit echtem Gerät durchführen, keine Simulationen
     Wenn Benutzer an bestimmter Stelle «zögert» oder «stolpert»,
     diese Stelle unbedingt optimieren

                        soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 43
Agenda
 Einsatzgebiete von Touch-Technologien
 Nutzungskontextanalyse
 Gestaltungsrichtlinien
 Literatur & Links




                     soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 44
Literatur & Links

  Normen
     DIN EN ISO 9241-210:2011
     Prozess zur Gestaltung gebrauchstauglicher Systeme

  Touch Guidelines
     Apple: http://developer.apple.com/library/ios/#documentation/user
     experience/conceptual/mobilehig/Introduction/Introduction.html
     Windows: http://msdn.microsoft.com/en-us/library/windows/
     desktop/cc872774.aspx#interaction
     SAP: http://www.sapdesignguild.org
     Usability of Mobile Websites & Applications: 210 Design Guidelines for
     Improving the User Experience of Mobile Sites and Apps, 2nd Edition.
     Nielsen Norman Group Report (2011): www.nngroup.com/reports/mobile



                          soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 45
Literatur & Links




  Luke Wroblewski: Mobile First
  Gesten und Buttons für verschiedene Plattformen:
     Luke Wroblewski, www.lukew.com, Touch Target Sizes




                       soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 46
Literatur & Links




  Steven Hoober: Designing Mobile Interfaces




                     soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 47
Herzlichen Dank für Ihre Aufmerksamkeit
Bei Fragen stehen wir gerne zur Verfügung

Más contenido relacionado

Was ist angesagt?

Mobile Produktentwicklung – wie geht das? Konzeption, Design, Entwicklung, Ve...
Mobile Produktentwicklung – wie geht das? Konzeption, Design, Entwicklung, Ve...Mobile Produktentwicklung – wie geht das? Konzeption, Design, Entwicklung, Ve...
Mobile Produktentwicklung – wie geht das? Konzeption, Design, Entwicklung, Ve...Bokowsky + Laymann GmbH
 
Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...
Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...
Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...Bokowsky + Laymann GmbH
 
Erstellung von mobilen cross-platform-Apps
Erstellung von mobilen cross-platform-AppsErstellung von mobilen cross-platform-Apps
Erstellung von mobilen cross-platform-AppsRalf Lütke
 
User xperience entsteht nicht durch Zufall
User xperience entsteht nicht durch ZufallUser xperience entsteht nicht durch Zufall
User xperience entsteht nicht durch ZufallDaniel Muther
 
ONE Konferenz: Von der Idee zur App
ONE Konferenz: Von der Idee zur AppONE Konferenz: Von der Idee zur App
ONE Konferenz: Von der Idee zur AppNetcetera
 
01-2015 - Java aktuell - Mandy Goram - Entwicklung mobiler Anwendungen für Bl...
01-2015 - Java aktuell - Mandy Goram - Entwicklung mobiler Anwendungen für Bl...01-2015 - Java aktuell - Mandy Goram - Entwicklung mobiler Anwendungen für Bl...
01-2015 - Java aktuell - Mandy Goram - Entwicklung mobiler Anwendungen für Bl...Mandy Goram
 

Was ist angesagt? (8)

Mobile Produktentwicklung – wie geht das? Konzeption, Design, Entwicklung, Ve...
Mobile Produktentwicklung – wie geht das? Konzeption, Design, Entwicklung, Ve...Mobile Produktentwicklung – wie geht das? Konzeption, Design, Entwicklung, Ve...
Mobile Produktentwicklung – wie geht das? Konzeption, Design, Entwicklung, Ve...
 
Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...
Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...
Einführung in die Mobile-Produktentwicklung: Konzeption, Design, Entwicklung,...
 
Mobile Applikationen - Juni 2013 - Idee, Konzeption, Architektur
Mobile Applikationen - Juni 2013 - Idee, Konzeption, ArchitekturMobile Applikationen - Juni 2013 - Idee, Konzeption, Architektur
Mobile Applikationen - Juni 2013 - Idee, Konzeption, Architektur
 
Erstellung von mobilen cross-platform-Apps
Erstellung von mobilen cross-platform-AppsErstellung von mobilen cross-platform-Apps
Erstellung von mobilen cross-platform-Apps
 
User xperience entsteht nicht durch Zufall
User xperience entsteht nicht durch ZufallUser xperience entsteht nicht durch Zufall
User xperience entsteht nicht durch Zufall
 
ONE Konferenz: Von der Idee zur App
ONE Konferenz: Von der Idee zur AppONE Konferenz: Von der Idee zur App
ONE Konferenz: Von der Idee zur App
 
01-2015 - Java aktuell - Mandy Goram - Entwicklung mobiler Anwendungen für Bl...
01-2015 - Java aktuell - Mandy Goram - Entwicklung mobiler Anwendungen für Bl...01-2015 - Java aktuell - Mandy Goram - Entwicklung mobiler Anwendungen für Bl...
01-2015 - Java aktuell - Mandy Goram - Entwicklung mobiler Anwendungen für Bl...
 
Responsive design
Responsive designResponsive design
Responsive design
 

Andere mochten auch

Bibliotheken und Linked Open Data
Bibliotheken und Linked Open DataBibliotheken und Linked Open Data
Bibliotheken und Linked Open DataMagnus Pfeffer
 
OpenNetwork Event 2013, Präsentation HS Mittweida
OpenNetwork Event 2013, Präsentation HS MittweidaOpenNetwork Event 2013, Präsentation HS Mittweida
OpenNetwork Event 2013, Präsentation HS Mittweidaofficesax
 
Examen de recuperación del 3er trimestre 1º bach.
Examen de recuperación del 3er trimestre 1º bach.Examen de recuperación del 3er trimestre 1º bach.
Examen de recuperación del 3er trimestre 1º bach.lagartiger
 
Konservative Anlageideen – Zehn Prozent in zwei Monaten, ist das möglich? Vol...
Konservative Anlageideen – Zehn Prozent in zwei Monaten, ist das möglich? Vol...Konservative Anlageideen – Zehn Prozent in zwei Monaten, ist das möglich? Vol...
Konservative Anlageideen – Zehn Prozent in zwei Monaten, ist das möglich? Vol...Deutsche Börse AG
 
Examen de 1º de Bach. del T5
Examen de 1º de Bach. del T5Examen de 1º de Bach. del T5
Examen de 1º de Bach. del T5lagartiger
 
Examen T8 de 4º
Examen T8 de 4ºExamen T8 de 4º
Examen T8 de 4ºlagartiger
 
T folge8 xetra handelbare werte i
T folge8 xetra handelbare werte iT folge8 xetra handelbare werte i
T folge8 xetra handelbare werte iDeutsche Börse AG
 
Una carta a garcia
Una carta a garciaUna carta a garcia
Una carta a garciadiana9121
 
Usability coffee-mobile protptyping
Usability coffee-mobile protptypingUsability coffee-mobile protptyping
Usability coffee-mobile protptypingsoultank AG
 
OpenNetwork Event 2013, Präsentation TU Bergakademie Freiberg-Career Center
OpenNetwork Event 2013, Präsentation TU Bergakademie Freiberg-Career CenterOpenNetwork Event 2013, Präsentation TU Bergakademie Freiberg-Career Center
OpenNetwork Event 2013, Präsentation TU Bergakademie Freiberg-Career Centerofficesax
 
"Wie kann man in wenig Zeit viel Information aus verschiedenen Quellen erfass...
"Wie kann man in wenig Zeit viel Information aus verschiedenen Quellen erfass..."Wie kann man in wenig Zeit viel Information aus verschiedenen Quellen erfass...
"Wie kann man in wenig Zeit viel Information aus verschiedenen Quellen erfass...89grad
 

Andere mochten auch (20)

Bibliotheken und Linked Open Data
Bibliotheken und Linked Open DataBibliotheken und Linked Open Data
Bibliotheken und Linked Open Data
 
Exposicion_biblioteca
Exposicion_bibliotecaExposicion_biblioteca
Exposicion_biblioteca
 
OpenNetwork Event 2013, Präsentation HS Mittweida
OpenNetwork Event 2013, Präsentation HS MittweidaOpenNetwork Event 2013, Präsentation HS Mittweida
OpenNetwork Event 2013, Präsentation HS Mittweida
 
Examen de recuperación del 3er trimestre 1º bach.
Examen de recuperación del 3er trimestre 1º bach.Examen de recuperación del 3er trimestre 1º bach.
Examen de recuperación del 3er trimestre 1º bach.
 
Konservative Anlageideen – Zehn Prozent in zwei Monaten, ist das möglich? Vol...
Konservative Anlageideen – Zehn Prozent in zwei Monaten, ist das möglich? Vol...Konservative Anlageideen – Zehn Prozent in zwei Monaten, ist das möglich? Vol...
Konservative Anlageideen – Zehn Prozent in zwei Monaten, ist das möglich? Vol...
 
T folge7 listing und ipo
T folge7 listing und ipoT folge7 listing und ipo
T folge7 listing und ipo
 
Examen de 1º de Bach. del T5
Examen de 1º de Bach. del T5Examen de 1º de Bach. del T5
Examen de 1º de Bach. del T5
 
Examen T8 de 4º
Examen T8 de 4ºExamen T8 de 4º
Examen T8 de 4º
 
T folge11 ftt
T folge11 fttT folge11 ftt
T folge11 ftt
 
windows movie make
windows movie makewindows movie make
windows movie make
 
Catalogo eje
Catalogo ejeCatalogo eje
Catalogo eje
 
T folge8 xetra handelbare werte i
T folge8 xetra handelbare werte iT folge8 xetra handelbare werte i
T folge8 xetra handelbare werte i
 
Una carta a garcia
Una carta a garciaUna carta a garcia
Una carta a garcia
 
Usability coffee-mobile protptyping
Usability coffee-mobile protptypingUsability coffee-mobile protptyping
Usability coffee-mobile protptyping
 
HFT Presseworkshop
HFT PresseworkshopHFT Presseworkshop
HFT Presseworkshop
 
Muestreo
MuestreoMuestreo
Muestreo
 
OpenNetwork Event 2013, Präsentation TU Bergakademie Freiberg-Career Center
OpenNetwork Event 2013, Präsentation TU Bergakademie Freiberg-Career CenterOpenNetwork Event 2013, Präsentation TU Bergakademie Freiberg-Career Center
OpenNetwork Event 2013, Präsentation TU Bergakademie Freiberg-Career Center
 
Presentación 2
Presentación 2 Presentación 2
Presentación 2
 
La reina de la nit i joan miró
La reina de la nit i joan miróLa reina de la nit i joan miró
La reina de la nit i joan miró
 
"Wie kann man in wenig Zeit viel Information aus verschiedenen Quellen erfass...
"Wie kann man in wenig Zeit viel Information aus verschiedenen Quellen erfass..."Wie kann man in wenig Zeit viel Information aus verschiedenen Quellen erfass...
"Wie kann man in wenig Zeit viel Information aus verschiedenen Quellen erfass...
 

Ähnlich wie Anforderungen an das Touchscreen-Design

10 do’s und dont’s der gestaltung mobiler anwendungen
10 do’s und dont’s der gestaltung mobiler anwendungen10 do’s und dont’s der gestaltung mobiler anwendungen
10 do’s und dont’s der gestaltung mobiler anwendungenONE Schweiz
 
Multiscreen Experience (Mai 2012, IA Konferenz, Essen)
Multiscreen Experience (Mai 2012, IA Konferenz, Essen)Multiscreen Experience (Mai 2012, IA Konferenz, Essen)
Multiscreen Experience (Mai 2012, IA Konferenz, Essen)Wolfram Nagel
 
The Future of Digital Banking - Übergangslos, mobile, abschlussstark!
The Future of Digital Banking - Übergangslos, mobile, abschlussstark!The Future of Digital Banking - Übergangslos, mobile, abschlussstark!
The Future of Digital Banking - Übergangslos, mobile, abschlussstark!Namics – A Merkle Company
 
Mobile User Experience: Entwicklung von benutzerfreundlichen mobilen Websites...
Mobile User Experience: Entwicklung von benutzerfreundlichen mobilen Websites...Mobile User Experience: Entwicklung von benutzerfreundlichen mobilen Websites...
Mobile User Experience: Entwicklung von benutzerfreundlichen mobilen Websites...usability.de
 
Responsive Design by Peter Grosskopf
Responsive Design by Peter GrosskopfResponsive Design by Peter Grosskopf
Responsive Design by Peter GrosskopfPeter Grosskopf
 
Mobile User Experience - Entwicklung von benutzerfreundlichen mobilen Website...
Mobile User Experience - Entwicklung von benutzerfreundlichen mobilen Website...Mobile User Experience - Entwicklung von benutzerfreundlichen mobilen Website...
Mobile User Experience - Entwicklung von benutzerfreundlichen mobilen Website...Christoph Mühlbauer
 
Universal Theme vs. APEX mobile
Universal Theme vs. APEX mobileUniversal Theme vs. APEX mobile
Universal Theme vs. APEX mobileSteven Grzbielok
 
Fonda: Erfolgsfaktor Benutzeroberfläche
Fonda: Erfolgsfaktor BenutzeroberflächeFonda: Erfolgsfaktor Benutzeroberfläche
Fonda: Erfolgsfaktor BenutzeroberflächeFonda Wien
 
Die mobile Herausforderung
Die mobile Herausforderung Die mobile Herausforderung
Die mobile Herausforderung Martin Reiher
 
APPsolut praktisch?! – Wie mobil optimierte Websites und Apps die Rezeption v...
APPsolut praktisch?! – Wie mobil optimierte Websites und Apps die Rezeption v...APPsolut praktisch?! – Wie mobil optimierte Websites und Apps die Rezeption v...
APPsolut praktisch?! – Wie mobil optimierte Websites und Apps die Rezeption v...Martin Krieg
 
Pidoco @ DT-HH - Prototyping begreifbarer Interaktionen für mobile Geräte
Pidoco @ DT-HH - Prototyping begreifbarer Interaktionen für mobile GerätePidoco @ DT-HH - Prototyping begreifbarer Interaktionen für mobile Geräte
Pidoco @ DT-HH - Prototyping begreifbarer Interaktionen für mobile GerätePidoco
 
User Experience im Digital Banking
User Experience im Digital BankingUser Experience im Digital Banking
User Experience im Digital BankingJürg Stuker
 
Mobile web #bch11
Mobile web #bch11Mobile web #bch11
Mobile web #bch11Leif Janzik
 
eparo – Inhalte und Funktionen von Websites (Vortrag IICO Kongress 2009 – Rol...
eparo – Inhalte und Funktionen von Websites (Vortrag IICO Kongress 2009 – Rol...eparo – Inhalte und Funktionen von Websites (Vortrag IICO Kongress 2009 – Rol...
eparo – Inhalte und Funktionen von Websites (Vortrag IICO Kongress 2009 – Rol...eparo GmbH
 
User Centered Design für das neue Xing
User Centered Design für das neue XingUser Centered Design für das neue Xing
User Centered Design für das neue XinguxHH
 
Multiscreen Experience (Mai 2012, IA Konferenz, Essen)
Multiscreen Experience (Mai 2012, IA Konferenz, Essen)Multiscreen Experience (Mai 2012, IA Konferenz, Essen)
Multiscreen Experience (Mai 2012, IA Konferenz, Essen)digiparden GmbH
 
BASTA Spring 2018: User Interface, quo vadis? Überlebensstrategien eines Soft...
BASTA Spring 2018: User Interface, quo vadis? Überlebensstrategien eines Soft...BASTA Spring 2018: User Interface, quo vadis? Überlebensstrategien eines Soft...
BASTA Spring 2018: User Interface, quo vadis? Überlebensstrategien eines Soft...Rainer Stropek
 

Ähnlich wie Anforderungen an das Touchscreen-Design (20)

10 do’s und dont’s der gestaltung mobiler anwendungen
10 do’s und dont’s der gestaltung mobiler anwendungen10 do’s und dont’s der gestaltung mobiler anwendungen
10 do’s und dont’s der gestaltung mobiler anwendungen
 
Multiscreen Experience (Mai 2012, IA Konferenz, Essen)
Multiscreen Experience (Mai 2012, IA Konferenz, Essen)Multiscreen Experience (Mai 2012, IA Konferenz, Essen)
Multiscreen Experience (Mai 2012, IA Konferenz, Essen)
 
The Future of Digital Banking - Übergangslos, mobile, abschlussstark!
The Future of Digital Banking - Übergangslos, mobile, abschlussstark!The Future of Digital Banking - Übergangslos, mobile, abschlussstark!
The Future of Digital Banking - Übergangslos, mobile, abschlussstark!
 
Mobile User Experience: Entwicklung von benutzerfreundlichen mobilen Websites...
Mobile User Experience: Entwicklung von benutzerfreundlichen mobilen Websites...Mobile User Experience: Entwicklung von benutzerfreundlichen mobilen Websites...
Mobile User Experience: Entwicklung von benutzerfreundlichen mobilen Websites...
 
Responsive Design by Peter Grosskopf
Responsive Design by Peter GrosskopfResponsive Design by Peter Grosskopf
Responsive Design by Peter Grosskopf
 
Mobile User Experience - Entwicklung von benutzerfreundlichen mobilen Website...
Mobile User Experience - Entwicklung von benutzerfreundlichen mobilen Website...Mobile User Experience - Entwicklung von benutzerfreundlichen mobilen Website...
Mobile User Experience - Entwicklung von benutzerfreundlichen mobilen Website...
 
Universal Theme vs. APEX mobile
Universal Theme vs. APEX mobileUniversal Theme vs. APEX mobile
Universal Theme vs. APEX mobile
 
Fonda: Erfolgsfaktor Benutzeroberfläche
Fonda: Erfolgsfaktor BenutzeroberflächeFonda: Erfolgsfaktor Benutzeroberfläche
Fonda: Erfolgsfaktor Benutzeroberfläche
 
Die mobile Herausforderung
Die mobile Herausforderung Die mobile Herausforderung
Die mobile Herausforderung
 
APPsolut praktisch?! – Wie mobil optimierte Websites und Apps die Rezeption v...
APPsolut praktisch?! – Wie mobil optimierte Websites und Apps die Rezeption v...APPsolut praktisch?! – Wie mobil optimierte Websites und Apps die Rezeption v...
APPsolut praktisch?! – Wie mobil optimierte Websites und Apps die Rezeption v...
 
Pidoco @ DT-HH - Prototyping begreifbarer Interaktionen für mobile Geräte
Pidoco @ DT-HH - Prototyping begreifbarer Interaktionen für mobile GerätePidoco @ DT-HH - Prototyping begreifbarer Interaktionen für mobile Geräte
Pidoco @ DT-HH - Prototyping begreifbarer Interaktionen für mobile Geräte
 
User Experience im Digital Banking
User Experience im Digital BankingUser Experience im Digital Banking
User Experience im Digital Banking
 
Mobile Applikationen: LeasePlan Mobil
Mobile Applikationen: LeasePlan MobilMobile Applikationen: LeasePlan Mobil
Mobile Applikationen: LeasePlan Mobil
 
Mobile web #bch11
Mobile web #bch11Mobile web #bch11
Mobile web #bch11
 
eparo – Inhalte und Funktionen von Websites (Vortrag IICO Kongress 2009 – Rol...
eparo – Inhalte und Funktionen von Websites (Vortrag IICO Kongress 2009 – Rol...eparo – Inhalte und Funktionen von Websites (Vortrag IICO Kongress 2009 – Rol...
eparo – Inhalte und Funktionen von Websites (Vortrag IICO Kongress 2009 – Rol...
 
Mobile Applikationen: Entwicklung, Rollout, Wartung - Tipps und Tricks für di...
Mobile Applikationen: Entwicklung, Rollout, Wartung - Tipps und Tricks für di...Mobile Applikationen: Entwicklung, Rollout, Wartung - Tipps und Tricks für di...
Mobile Applikationen: Entwicklung, Rollout, Wartung - Tipps und Tricks für di...
 
User Centered Design für das neue Xing
User Centered Design für das neue XingUser Centered Design für das neue Xing
User Centered Design für das neue Xing
 
Multiscreen Experience (Mai 2012, IA Konferenz, Essen)
Multiscreen Experience (Mai 2012, IA Konferenz, Essen)Multiscreen Experience (Mai 2012, IA Konferenz, Essen)
Multiscreen Experience (Mai 2012, IA Konferenz, Essen)
 
130605 webinale-nuisol
130605 webinale-nuisol130605 webinale-nuisol
130605 webinale-nuisol
 
BASTA Spring 2018: User Interface, quo vadis? Überlebensstrategien eines Soft...
BASTA Spring 2018: User Interface, quo vadis? Überlebensstrategien eines Soft...BASTA Spring 2018: User Interface, quo vadis? Überlebensstrategien eines Soft...
BASTA Spring 2018: User Interface, quo vadis? Überlebensstrategien eines Soft...
 

Mehr von soultank AG

Visual thinking, Usability Coffee, Bern, 16.06.2016
Visual thinking, Usability Coffee, Bern, 16.06.2016Visual thinking, Usability Coffee, Bern, 16.06.2016
Visual thinking, Usability Coffee, Bern, 16.06.2016soultank AG
 
Scrum und User Centered Design – wie geht das?, Usability Coffee, Bern, 12.04...
Scrum und User Centered Design – wie geht das?, Usability Coffee, Bern, 12.04...Scrum und User Centered Design – wie geht das?, Usability Coffee, Bern, 12.04...
Scrum und User Centered Design – wie geht das?, Usability Coffee, Bern, 12.04...soultank AG
 
Usability Coffee-mobile protptyping-10.03.2016-Bern
Usability Coffee-mobile protptyping-10.03.2016-BernUsability Coffee-mobile protptyping-10.03.2016-Bern
Usability Coffee-mobile protptyping-10.03.2016-Bernsoultank AG
 
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 11.02....
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 11.02....Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 11.02....
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 11.02....soultank AG
 
Texten Fürs Web, Usability Coffee Zug, 24.11.2015
Texten Fürs Web, Usability Coffee Zug, 24.11.2015Texten Fürs Web, Usability Coffee Zug, 24.11.2015
Texten Fürs Web, Usability Coffee Zug, 24.11.2015soultank AG
 
Wie messe ich den Erfolg eines Redesigns? - Vorher-Nachher-Befragung vs. Conv...
Wie messe ich den Erfolg eines Redesigns? - Vorher-Nachher-Befragung vs. Conv...Wie messe ich den Erfolg eines Redesigns? - Vorher-Nachher-Befragung vs. Conv...
Wie messe ich den Erfolg eines Redesigns? - Vorher-Nachher-Befragung vs. Conv...soultank AG
 
Visual thinking, Usability Coffee, Zug, 14.04.2015
Visual thinking, Usability Coffee, Zug, 14.04.2015Visual thinking, Usability Coffee, Zug, 14.04.2015
Visual thinking, Usability Coffee, Zug, 14.04.2015soultank AG
 
Visual thinking usability coffee st gallen 19 03 2015
Visual thinking usability coffee st gallen 19 03 2015Visual thinking usability coffee st gallen 19 03 2015
Visual thinking usability coffee st gallen 19 03 2015soultank AG
 
Mobile Protptyping, Usability Coffee, Zug, 19.02.105
Mobile Protptyping, Usability Coffee, Zug, 19.02.105Mobile Protptyping, Usability Coffee, Zug, 19.02.105
Mobile Protptyping, Usability Coffee, Zug, 19.02.105soultank AG
 
"Texten fürs Web", Usability Coffee, Zug, 22.01.2015
"Texten fürs Web", Usability Coffee, Zug, 22.01.2015"Texten fürs Web", Usability Coffee, Zug, 22.01.2015
"Texten fürs Web", Usability Coffee, Zug, 22.01.2015soultank AG
 
Texten fürs Web, Usability Coffee, St. Gallen, 20.11.2014
Texten fürs Web, Usability Coffee, St. Gallen, 20.11.2014Texten fürs Web, Usability Coffee, St. Gallen, 20.11.2014
Texten fürs Web, Usability Coffee, St. Gallen, 20.11.2014soultank AG
 
Dank Storytelling zum erfolgreichen Produkt. Warum Use Cases im Projekt nicht...
Dank Storytelling zum erfolgreichen Produkt. Warum Use Cases im Projekt nicht...Dank Storytelling zum erfolgreichen Produkt. Warum Use Cases im Projekt nicht...
Dank Storytelling zum erfolgreichen Produkt. Warum Use Cases im Projekt nicht...soultank AG
 
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 21.08....
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 21.08....Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 21.08....
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 21.08....soultank AG
 
Do's und Dont's bei Online-Formularen, Usability Coffee, Zug und St.Gallen
Do's und Dont's bei Online-Formularen, Usability Coffee, Zug und St.GallenDo's und Dont's bei Online-Formularen, Usability Coffee, Zug und St.Gallen
Do's und Dont's bei Online-Formularen, Usability Coffee, Zug und St.Gallensoultank AG
 
Scrum und User Centered Design, Usability Coffee, 05.06.2014, St.Gallen
Scrum und User Centered Design, Usability Coffee, 05.06.2014, St.GallenScrum und User Centered Design, Usability Coffee, 05.06.2014, St.Gallen
Scrum und User Centered Design, Usability Coffee, 05.06.2014, St.Gallensoultank AG
 
Prototyping-Methoden beim Redesign einer Website
Prototyping-Methoden beim Redesign einer WebsitePrototyping-Methoden beim Redesign einer Website
Prototyping-Methoden beim Redesign einer Websitesoultank AG
 
Entwicklung des neuen Swisscom Intranets mit User Centered Design
Entwicklung des neuen Swisscom Intranets mit User Centered DesignEntwicklung des neuen Swisscom Intranets mit User Centered Design
Entwicklung des neuen Swisscom Intranets mit User Centered Designsoultank AG
 
Mobile Applikationen testen: So funktioniert’s!
Mobile Applikationen testen: So funktioniert’s!Mobile Applikationen testen: So funktioniert’s!
Mobile Applikationen testen: So funktioniert’s!soultank AG
 

Mehr von soultank AG (18)

Visual thinking, Usability Coffee, Bern, 16.06.2016
Visual thinking, Usability Coffee, Bern, 16.06.2016Visual thinking, Usability Coffee, Bern, 16.06.2016
Visual thinking, Usability Coffee, Bern, 16.06.2016
 
Scrum und User Centered Design – wie geht das?, Usability Coffee, Bern, 12.04...
Scrum und User Centered Design – wie geht das?, Usability Coffee, Bern, 12.04...Scrum und User Centered Design – wie geht das?, Usability Coffee, Bern, 12.04...
Scrum und User Centered Design – wie geht das?, Usability Coffee, Bern, 12.04...
 
Usability Coffee-mobile protptyping-10.03.2016-Bern
Usability Coffee-mobile protptyping-10.03.2016-BernUsability Coffee-mobile protptyping-10.03.2016-Bern
Usability Coffee-mobile protptyping-10.03.2016-Bern
 
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 11.02....
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 11.02....Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 11.02....
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 11.02....
 
Texten Fürs Web, Usability Coffee Zug, 24.11.2015
Texten Fürs Web, Usability Coffee Zug, 24.11.2015Texten Fürs Web, Usability Coffee Zug, 24.11.2015
Texten Fürs Web, Usability Coffee Zug, 24.11.2015
 
Wie messe ich den Erfolg eines Redesigns? - Vorher-Nachher-Befragung vs. Conv...
Wie messe ich den Erfolg eines Redesigns? - Vorher-Nachher-Befragung vs. Conv...Wie messe ich den Erfolg eines Redesigns? - Vorher-Nachher-Befragung vs. Conv...
Wie messe ich den Erfolg eines Redesigns? - Vorher-Nachher-Befragung vs. Conv...
 
Visual thinking, Usability Coffee, Zug, 14.04.2015
Visual thinking, Usability Coffee, Zug, 14.04.2015Visual thinking, Usability Coffee, Zug, 14.04.2015
Visual thinking, Usability Coffee, Zug, 14.04.2015
 
Visual thinking usability coffee st gallen 19 03 2015
Visual thinking usability coffee st gallen 19 03 2015Visual thinking usability coffee st gallen 19 03 2015
Visual thinking usability coffee st gallen 19 03 2015
 
Mobile Protptyping, Usability Coffee, Zug, 19.02.105
Mobile Protptyping, Usability Coffee, Zug, 19.02.105Mobile Protptyping, Usability Coffee, Zug, 19.02.105
Mobile Protptyping, Usability Coffee, Zug, 19.02.105
 
"Texten fürs Web", Usability Coffee, Zug, 22.01.2015
"Texten fürs Web", Usability Coffee, Zug, 22.01.2015"Texten fürs Web", Usability Coffee, Zug, 22.01.2015
"Texten fürs Web", Usability Coffee, Zug, 22.01.2015
 
Texten fürs Web, Usability Coffee, St. Gallen, 20.11.2014
Texten fürs Web, Usability Coffee, St. Gallen, 20.11.2014Texten fürs Web, Usability Coffee, St. Gallen, 20.11.2014
Texten fürs Web, Usability Coffee, St. Gallen, 20.11.2014
 
Dank Storytelling zum erfolgreichen Produkt. Warum Use Cases im Projekt nicht...
Dank Storytelling zum erfolgreichen Produkt. Warum Use Cases im Projekt nicht...Dank Storytelling zum erfolgreichen Produkt. Warum Use Cases im Projekt nicht...
Dank Storytelling zum erfolgreichen Produkt. Warum Use Cases im Projekt nicht...
 
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 21.08....
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 21.08....Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 21.08....
Scrum und User Centered Design – wie geht das?, Usability Coffee, Zug, 21.08....
 
Do's und Dont's bei Online-Formularen, Usability Coffee, Zug und St.Gallen
Do's und Dont's bei Online-Formularen, Usability Coffee, Zug und St.GallenDo's und Dont's bei Online-Formularen, Usability Coffee, Zug und St.Gallen
Do's und Dont's bei Online-Formularen, Usability Coffee, Zug und St.Gallen
 
Scrum und User Centered Design, Usability Coffee, 05.06.2014, St.Gallen
Scrum und User Centered Design, Usability Coffee, 05.06.2014, St.GallenScrum und User Centered Design, Usability Coffee, 05.06.2014, St.Gallen
Scrum und User Centered Design, Usability Coffee, 05.06.2014, St.Gallen
 
Prototyping-Methoden beim Redesign einer Website
Prototyping-Methoden beim Redesign einer WebsitePrototyping-Methoden beim Redesign einer Website
Prototyping-Methoden beim Redesign einer Website
 
Entwicklung des neuen Swisscom Intranets mit User Centered Design
Entwicklung des neuen Swisscom Intranets mit User Centered DesignEntwicklung des neuen Swisscom Intranets mit User Centered Design
Entwicklung des neuen Swisscom Intranets mit User Centered Design
 
Mobile Applikationen testen: So funktioniert’s!
Mobile Applikationen testen: So funktioniert’s!Mobile Applikationen testen: So funktioniert’s!
Mobile Applikationen testen: So funktioniert’s!
 

Último

09c Hämosiderose nach Beta Thalassämie. Hämosiderose
09c Hämosiderose nach Beta Thalassämie. Hämosiderose09c Hämosiderose nach Beta Thalassämie. Hämosiderose
09c Hämosiderose nach Beta Thalassämie. HämosideroseWolfgang Geiler
 
25 Pädriatische Notfälle und Reye Syndrom.Pädiatrische Notfälle
25 Pädriatische Notfälle und Reye Syndrom.Pädiatrische Notfälle 25 Pädriatische Notfälle und Reye Syndrom.Pädiatrische Notfälle
25 Pädriatische Notfälle und Reye Syndrom.Pädiatrische Notfälle Wolfgang Geiler
 
09 Ursachen der einfachen Hämosiderose.
09 Ursachen der einfachen Hämosiderose.09 Ursachen der einfachen Hämosiderose.
09 Ursachen der einfachen Hämosiderose.Wolfgang Geiler
 
09a Hämosiderose der Lunge. Hämosiderose
09a Hämosiderose der Lunge. Hämosiderose09a Hämosiderose der Lunge. Hämosiderose
09a Hämosiderose der Lunge. HämosideroseWolfgang Geiler
 
24 Pädiatrische Notfälle.Notfallschema und Kruppsyndrom
24 Pädiatrische Notfälle.Notfallschema und Kruppsyndrom24 Pädiatrische Notfälle.Notfallschema und Kruppsyndrom
24 Pädiatrische Notfälle.Notfallschema und KruppsyndromWolfgang Geiler
 
09d Therapie der sekundären Hämochromatose, Hämosiderose
09d Therapie der sekundären Hämochromatose, Hämosiderose09d Therapie der sekundären Hämochromatose, Hämosiderose
09d Therapie der sekundären Hämochromatose, HämosideroseWolfgang Geiler
 
09b Hämosiderose des ZNS. Hämosiderose. Hämosiderose und Hämochromatose
09b Hämosiderose des ZNS. Hämosiderose. Hämosiderose und Hämochromatose09b Hämosiderose des ZNS. Hämosiderose. Hämosiderose und Hämochromatose
09b Hämosiderose des ZNS. Hämosiderose. Hämosiderose und HämochromatoseWolfgang Geiler
 

Último (7)

09c Hämosiderose nach Beta Thalassämie. Hämosiderose
09c Hämosiderose nach Beta Thalassämie. Hämosiderose09c Hämosiderose nach Beta Thalassämie. Hämosiderose
09c Hämosiderose nach Beta Thalassämie. Hämosiderose
 
25 Pädriatische Notfälle und Reye Syndrom.Pädiatrische Notfälle
25 Pädriatische Notfälle und Reye Syndrom.Pädiatrische Notfälle 25 Pädriatische Notfälle und Reye Syndrom.Pädiatrische Notfälle
25 Pädriatische Notfälle und Reye Syndrom.Pädiatrische Notfälle
 
09 Ursachen der einfachen Hämosiderose.
09 Ursachen der einfachen Hämosiderose.09 Ursachen der einfachen Hämosiderose.
09 Ursachen der einfachen Hämosiderose.
 
09a Hämosiderose der Lunge. Hämosiderose
09a Hämosiderose der Lunge. Hämosiderose09a Hämosiderose der Lunge. Hämosiderose
09a Hämosiderose der Lunge. Hämosiderose
 
24 Pädiatrische Notfälle.Notfallschema und Kruppsyndrom
24 Pädiatrische Notfälle.Notfallschema und Kruppsyndrom24 Pädiatrische Notfälle.Notfallschema und Kruppsyndrom
24 Pädiatrische Notfälle.Notfallschema und Kruppsyndrom
 
09d Therapie der sekundären Hämochromatose, Hämosiderose
09d Therapie der sekundären Hämochromatose, Hämosiderose09d Therapie der sekundären Hämochromatose, Hämosiderose
09d Therapie der sekundären Hämochromatose, Hämosiderose
 
09b Hämosiderose des ZNS. Hämosiderose. Hämosiderose und Hämochromatose
09b Hämosiderose des ZNS. Hämosiderose. Hämosiderose und Hämochromatose09b Hämosiderose des ZNS. Hämosiderose. Hämosiderose und Hämochromatose
09b Hämosiderose des ZNS. Hämosiderose. Hämosiderose und Hämochromatose
 

Anforderungen an das Touchscreen-Design

  • 1. Überall die Finger drin: Anforderungen an das Touchscreen-Design Alles wird mobil – soultank World Usability Day Event 2011
  • 2. Agenda Einsatzgebiete von Touch-Technologien Nutzungskontextanalyse Gestaltungsrichtlinien Literatur & Links soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 2
  • 3. Touchscreens im Alltag soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 3
  • 4. Touchscreens im Alltag soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 4
  • 5. Touch-Technologien Existenz von Vielzahl an Touch-Technologien Branchenanalytiker zählten im Jahr 2009 rund 20 unterschiedliche Touch-Technologien* Beispiele: Kapazitive, optische, druckempfindliche, (Schall)wellengesteuerte Touch Technologien, Multi-Touch usw. Haben jeweils unterschiedliche Stärken und Schwächen, da ihnen unterschiedliche Techniken zu Grunde liegen Produkte mit Touch-Technologie zeichnen sich jeweils durch andere Charakteristiken aus Einige Kunden und Märkte verlangen nach speziellen Touch-Technologien * Quelle: NZZ, 07/2009 soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 5
  • 6. Touch-Technologien Durch Apples Einführung von Iphone usw. haben Touchscreens Weg in breite Masse gefunden Studie* von Gartner Für 2013 erwartet, dass mehr als Hälfte (58 %) von verkauften Mobiltelefonen über Touchscreen steuerbar sein wird Besonders hohe Touchscreen-Verbreitung auf hoch entwickelten Märkten (USA, westliche Teile Europas) * Future Wireless Trends diskutiert auf Gartner Wireless, Networking & Communications Summit 2010, April 19-21, San Diego [URL: http://www.gartner.com/it/page.jsp?id=1313415] soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 6
  • 7. Agenda Einsatzgebiete von Touch-Technologien Nutzungskontextanalyse Gestaltungsrichtlinien Literatur & Links soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 7
  • 8. Nutzungsorientierter Gestaltungsprozess soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 8
  • 9. Nutzungskontextanalyse: Beispiel Benutzer-, Aufgaben- und Kontextanalyse Benutzer: Kontext: Mann, Alter Business, Mobil unbekannt Aufgabe: System: Dateneingabe Stiftbedienung Touchscreen Quelle: Modell abgeleitet von Michael Herczeg soultank AG | 10.11.2011 | Folie 9
  • 10. In welchem Kontext wird mobiles Touchscreen benutzt? Nutzungssituationen Zu Hause: 84 % Verschiedene Pausen während Tag: 80 % Während Wartezeit in Schlangen und in Einrichtungen: 74 % Während «Shopping»: 69 % Während Arbeiten: 64 % Während TV Schauen: 62 % Während Pendeln: 47 % Quelle: Luke Wroblewski. Mobile First. (2011) soultank AG | 10.11.2011 | Folie 10
  • 11. Welcher Interaktionstyp bist Du? Vier wichtige Interaktionstypen 1. Lookup/Find «Ich benötige aktuell eine Antwort zu bestimmten Thema.» 2. Explore/Play «Ich will etwas Zeit überbrücken und mich ablenken.» 3. Check in/Status «Es ändert/aktualisiert sich etwas und ich möchte Bescheid wissen.» 4. Edit/Create «Ich muss jetzt etwas Dringendes tun, was nicht warten kann.» Quelle: Luke Wroblewski. Mobile First. (2011) soultank AG | 10.11.2011 | Folie 11
  • 12. Nutzungskontextanalyse: Ergebnis Realitätsnahe auf Benutzer, Aufgaben und Kontext ausgerichtete mobile Anwendungsfälle, die Mehrwert für Benutzer bieten Beschränkung von Online-Services nicht auf ein Gerät Je nach Anwendungssituation unterschiedliche Geräte möglich “It looks like a giant iPhone,” is the first thing users say when asked to test an iPad. Their second comment? “Wow, it's heavy.” Quelle: Jakob Nielsen's Alertbox, 26.04.2010: iPad Usability: First Findings From User Testing soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 12
  • 13. Nutzungskontextanalyse: Ergebnis Mobile Website vs. App 3 Möglichkeiten für mobile Inhalte Responsive Layout für Website Separate mobile Website Native Applikationen (Apps) Nutzerforschung* (2011) zeigt: Erfolgsrate bei mobilen Websites: 64 % Erfolgsrate bei Desktop-Websites auf mobilen Geräten: 58 % App noch besser: Erfolgsrate 76 % * http://www.useit.com/alertbox/mobile-usability.html soultank AG | 10.11.2011 | Folie 13
  • 14. Inhaltsverzeichnis Einsatzgebiete von Touch-Technologien Nutzungskontextanalyse Gestaltungsrichtlinien Literatur & Links soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 14
  • 15. Inhalt | Folie 15
  • 16. Inhalt: Tipps & Tricks Inhaltlich stark auf Wesentliches beschränken Hauptinhalte integrieren, alle anderen Inhalte entfernen Keinen Werbetext einsetzen Starke Reduzierung von textlichem Inhalt Integration nur wichtigster Zusatzfunktionen (Features); Beschränkung sinnvoll Wichtigste Links als Hauptinhalt einbinden (Startseite), die auf Unterseiten verweisen (in Unterseiten auslagern) soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 16
  • 17. Inhalt: Positives Beispiel Varianten: Corporate Website, Mobile Website soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 17
  • 18. Inhalt: Negatives Beispiel Keine Variante: Corporate Website soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 18
  • 20. Design: Tipps & Tricks Geringere Bildschirmauflösungen bei mobilen Geräten Gängige Bildschirmauflösungen 800 x 480 px (Android) 960 x 640 px (Iphone) 1024 X 768 px (Ipad) Informationsangebot, Layout, Navigation müssen Grösse entsprechend angepasst werden Bildschirme und Verarbeitungsdauer können sich stark voneinander unterscheiden Je nach Anforderung unterschiedliche Versionen von mobilen Websites soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 20
  • 21. Design: Tipps & Tricks Design von Schaltflächen Größe von Schaltflächen Feedback und Akzeptieren von Eingaben Einfaches GUI-Design Farbigkeit Wahlmöglichkeiten begrenzen soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 21
  • 22. Design: Tipps & Tricks Wichtige «Call to actions» visuell in Vordergrund stellen soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 22
  • 23. Design: Positives Beispiel soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 23
  • 24. Design: Negatives Beispiel soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 24
  • 26. Navigation: Tipps & Tricks Informationsarchitektur Navigationsoptionen einschränken Flache Navigationsstruktur einbinden Benutzerführung ist A und O Startseite Variante A: Benutzerbedürfnis schnelle Navigation und Suche Variante B: Auf E-Commerce Websites Auf Unterseiten Navigation im unteren Bildschirmbereich einbinden Zurück-Button nur auf Unterseiten anbieten soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 26
  • 27. Navigation: Positive Beispiele Flache Navigationsstruktur: 1 Klick Startseite auf Wichtigstes reduziert soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 27
  • 28. Navigation: Negative Beispiele Startseiten nicht auf Wichtigstes reduziert Lenkt von Navigation ab Werbe-Teaser störend Corporate Website und App nicht ausreichend, mobile Website fehlt soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 28
  • 30. Funktion: Tipps & Tricks Texteingaben minimieren Texteingabe auf mobil genutzten Geräten wesentlich schwieriger als auf Desktop-PC oder Laptop-Tastatur Reduzierungswege: Nutzung von hinterlegten Daten z. B. unter «My Account» ermöglichen, Fragen ob Nutzer lieber PIN statt Passwort eingeben wollen, Vorteile von integrierten Funktionalitäten nutzen soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 30
  • 31. Funktion: Tipps & Tricks Vorteile von integrierter Funktionalität nutzen Telefonanrufe ermöglichen automatisches Anstossen eines Anrufs bei Klick auf Tel.-Nr. Adresse auf Karte anzeigen «Finde das nächste…» (GPS) Input-Eingabe auf innovativen Wegen QR Codes, Barcodes soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 31
  • 32. Funktion: Positive Beispiele Hilfreiche Funktionen Unterstützung durch Hardware (z. B. GPS, Kamera) soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 32
  • 33. Inhalt: Negative Beispiele Einbinden von integrierter Funktion wäre bei App möglich (z. B. Aktueller Standort, Route festlegen) Klickbereich in Navigation zu klein soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 33
  • 35. Interaktion: Tipps & Tricks – Input Einfache Gesten soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 35
  • 36. Interaktion: Tipps & Tricks – Input Komplexere Gesten Touch Gesture Cards (PDF): Luke Wroblewski) soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 36
  • 37. Interaktion: Beispiele – Input Wenig bekannte Gesten Wischen erzeugt Submenü Zurück/weiter-Buttons bei Formulareingaben soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 37
  • 38. Interaktion: Tipps & Tricks – Input «Für den dicken Finger designen» MIT: Fingerbeere Ø 10-14 mm breit Fingerspitze Ø 8-10 mm breit Detailangaben für verschiedene Plattformen: www.lukew.com, Touch Target Sizes soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 38
  • 39. Interaktion: Tipps & Tricks – Input Für Rechts- und Linkshänder designen Websites: Navigationsleiste oft links -> ungünstig für Rechtshänder Browsererkennung: für mobile Geräte alternative Navigation anbieten soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 39
  • 40. Interaktion: Stolpersteine Kein Maus-Zeiger vorhanden User wissen immer, wo ihr Finger ist Nicht möglich, versch. Maus-Stati anzuzeigen Status-Anzeige möglich durch Hervorhebung (Farbe, Rand, Animation o.ä.) Keine Analogie zu Maus-Button Interaktion (anzeigen und auslösen in 1 Schritt) soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 40
  • 41. Interaktion: Stolpersteine Vermeiden: Javascript-Tooltips mit wichtigen Informationen Auslösende Elemente via Hover-Status (zB editieren, löschen) Grafiken oder Fotos, welche erst bei Hover-Status vollständig angezeigt werden Drop-down Menüs. Falls tap möglich, klaren Hinweis darauf geben. Zu stark auf Hover-abhängiges CSS3 fokussieren. Multi-touch User sehen die coolen Effekte nicht. soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 41
  • 42. User Experience & Usability
  • 43. User Experience & Usability – Tipps & Tricks Mobile Anwendungen intuitiv gestalten Fokus: KISS-Prinzip «Keep it short and simple» «Joy of Use» in Vordergrund stellen Performanz im Hinterkopf behalten Bei träger Anwendung verliert Benutzer schnell Interesse Aufmerksamkeit durch schnelle Reaktion auf Berührung steigern Konzipiertes Produkt unbedingt mit Zielgruppe testen Test mit echtem Gerät durchführen, keine Simulationen Wenn Benutzer an bestimmter Stelle «zögert» oder «stolpert», diese Stelle unbedingt optimieren soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 43
  • 44. Agenda Einsatzgebiete von Touch-Technologien Nutzungskontextanalyse Gestaltungsrichtlinien Literatur & Links soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 44
  • 45. Literatur & Links Normen DIN EN ISO 9241-210:2011 Prozess zur Gestaltung gebrauchstauglicher Systeme Touch Guidelines Apple: http://developer.apple.com/library/ios/#documentation/user experience/conceptual/mobilehig/Introduction/Introduction.html Windows: http://msdn.microsoft.com/en-us/library/windows/ desktop/cc872774.aspx#interaction SAP: http://www.sapdesignguild.org Usability of Mobile Websites & Applications: 210 Design Guidelines for Improving the User Experience of Mobile Sites and Apps, 2nd Edition. Nielsen Norman Group Report (2011): www.nngroup.com/reports/mobile soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 45
  • 46. Literatur & Links Luke Wroblewski: Mobile First Gesten und Buttons für verschiedene Plattformen: Luke Wroblewski, www.lukew.com, Touch Target Sizes soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 46
  • 47. Literatur & Links Steven Hoober: Designing Mobile Interfaces soultank AG | Anforderungen an das Touchscreen-Design | 10.11.2011 | Folie 47
  • 48. Herzlichen Dank für Ihre Aufmerksamkeit Bei Fragen stehen wir gerne zur Verfügung