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.

Smart Clients - Interaction Paradigms in Web Context

864 views

Published on

Published in: Design, Technology, Business
  • Be the first to comment

  • Be the first to like this

Smart Clients - Interaction Paradigms in Web Context

  1. 1. SMART CLIENTS Interaktionsparadigmen im Nutzungskontext Webbrowser
  2. 2. Autoren & Firma • Jan Groenefeld (User Interface Designer) • Markus Kühner (User Interface Designer) • Christian Kaspari (User Interface Designer) • Dieter Wallach (User Interface Designer) ERGOSIGN GmbH Stuhlsatzenhausweg 69 66123 Saarbrücken www.ergosign.de
  3. 3. Gliederung • Thematische Einführung • Usability Problemstellungen und theoretische Lösungsansätze • Praxisbeispiele • Fazit
  4. 4. Buzzwords & ‘Trendsetter’ • Web2.0 • RIA • Smart Client • AJAX
  5. 5. Das ‘neue’ Web Aber Mehr Discoverability Probleme Interaktion (’Direct Manipulation’) ‘Versteckte’ User Generated Interaktionsmöglichkeiten Content (’Read/Write- Accessibility Probleme Internet’, ’Social Networking’) Keine Gewährleistung von Funktionsvielfalt Barrierefreiheit, Web Standards Höher, Schneller, Weiter Komplexer, Schwieriger
  6. 6. Das ‘neue’ Web Aktuelle Entwicklung • Verwendung verkaufsfördernder Buzzwords • Konzentration auf Marketing und Technik • Bedürfnisse des Benutzers werden vernachlässigt (Featuritis) Überforderung des Benutzers durch Funktionsvielfalt?
  7. 7. Webanwender 1.0 Einfachheit der Webangebot Hyperlinkphilosophie vs. Funktionsvielfalt und Applikation Komplexität Webanwender 2.0
  8. 8. Usability Problemstellung Lösen des ‘Applikation in Applikation’-Problems?
  9. 9. ‘Applikation in Applikation’- Problematik Erzeugung eines applikationsartigen Kontexts Application Window Splash Screen http://us.ajax13.com/en/ajaxtunes/index.jsp Close Dialog
  10. 10. ‘Applikation in Applikation’- Problematik Umgang mit ‘Zustandslosigkeit’ Upload Reload
  11. 11. ‘Applikation in Applikation’- Problematik Spezialfall: History-Buttons / Bookmarks Löschen der History Löschen privater Daten http://www.mtv.de/overdrive/index.php Undo-Funktion? Ungewolltes Verlassen der Website! Page Model http://codinginparadise.org/projects/dhtml_history/testDhtmlHistory.html#4
  12. 12. Optimierungspotential ausgewählter Interaktionsparadigmen Drag & Drop Edit in Place
  13. 13. Heranführen des Benutzers an Funktionsvielfalt und Komplexität Erfahrungsdefizit und mangelnde Discoverability • Tutorials & Demonstrationen (z.B. Flash) beim ersten Besuch der Website • ‘Percieved Affordance’ von Controls • Nachahmung physikalischer Mechanismen • Cursor States • Kontextsensitiv eingeblendete Controls • mit gleichzeitigem Hinweis auf direkte Manipulation
  14. 14. Drag & Drop Lösungsansätze • Gripflächen • Optisches ‘Herausheben’ aus dem Content. z.B. durch Schlagschatten. • farbliche ‘Aktivierung’ sowohl des Elements als auch von evt. Zielflächen http://www.mtv.de/overdrive/index.php
  15. 15. Edit in Place Inkonsistente Darstellung Discoverability http://www.millstream.com.au/upload/code/tablekit/ http://24ways.org/examples/edit-in-place-with-ajax/ http://www.epointment.com/downloads/eeip/
  16. 16. Edit in Place Lösungsansätze • Kontextsensitiv eingeblendete Controls • Tooltipp • Cursor State • Blinkender Cursor
  17. 17. Potential-Analyse am Beispiel von www.mtvoverdrive.de Inkonsequenter Einsatz von Drag&Drop
  18. 18. MTV Overdrive Wireframe Dragable Areas
  19. 19. MTV Overdrive ‘First Visit Tutorial’
  20. 20. Fazit • Gezielter Einsatz neuer Interaktionskonzepte • Frühzeitige Klassifizierung

×