2. Dialoge Software Engineering (FB EIT) Wintersemester 2008 / 2009 Prof. Dr. Bernhard Humm Hochschule Darmstadt, FB Informatik

Transkript

1 2. Dialoge Software Engineering (FB EIT) Wintersemester 2008 / 2009 Prof. Dr. Bernhard Humm Hochschule Darmstadt, FB Informatik 1 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

2 2 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

3 Bausteine zu den Anforderungen Anforderungen Zentrale Ziele und Rahmenbedingungen Funktionale Anforderungen Projektanforderungen Nichtfunktionale Anforderungen Einführungsanforderungen Migrationsanforderungen Dialog-Gestaltungsvorgabe Betriebsanforderungen Fachliche Gestaltung Verhalten Geschäftsprozesse Anwendungsfälle Anwendungsfunktionen Fachlicher Überblick Struktur Domänen & Komponenten Logisches Datenmodell & Datentypverzeichnis Interaktion Dialoge Druckausgaben Nachbarsystem-Schnittstellen Batchverarbeitung Querschnittskonzepte und Dienste Glossar Quelle: sd&m Research 3 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

4 Agenda Agenda Statik Statik Dynamik Ergonomie Praktikumsaufgabe

5 Die Statik von Dialogen: das Layout Fenster Menü Editor Subdialog Label Textfeld Button Panel Scroll bar 5 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

6 Statik Bausteine für das Dialoglayout (Bibliothek) Kopfzeile Spalte Spalte Spalte Spalte U Datei Bearbeiten Ansicht Hilfe A A A V Teildialog Reiter Feld Wert Button 6 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

7 Statik Gestaltungsregeln Beispiel: Chaotisches Fenster-Layout Auftragseingang: Kunde: Auftragsnr.: Zahlung: Bearbeiter: Kundennummer : Rabattierung: Bemerkung: Lieferung: Nr. Menge Artikel Preis 3 2 Dopppel-S Ziegel schwarz, 100 E 102, Zinkrinne, 2m 28, Zinkblech 1m, 0,9mm 65, Belüftungsziegel Doppel-S 12, Velux-Fenster 90*1,10, Kipp 723,23 7 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

8 Statik Gestaltungsregeln Beispiel: Strukturiertes Fenster-Layout Kunde: Kundennr: Rabatt: Zahlung: Lieferung: Auftragsnr.: Bearbeiter:: Bemerkung: Eingang: Nr. Menge Artikel Preis 3 2 Dopppel-S Ziegel schwarz, 100 E 102, Zinkrinne, 2m 28, Zinkblech 1m, 0,9mm 65, Belüftungsziegel Doppel-S 12, Velux-Fenster 90*1,10, Kipp 723,23 8 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

9 Statik Gestaltungsregeln Fenster-Layout Blocksatz, Gruppierung gruppierte Edittexte in Länge angleichen Ausnahmen: Kurzformate (1 Zeichen, PLZ) Spaltenbildung Mehrere Spalten nutzen den Raum besser aus. Symmetrie, Balance 9 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

10 Statik Konsistente Verwendung von Farben Ziel: Intuitives Verständnis der GUI, Einheitlichkeit Z.B. Aktive/ markierte Teile immer blau, inaktive Teile grau Hilfe: Farbraster: 10 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

11 Statik Ähnliche Struktur (wie andere Applikationen) Ähnliche Menüstruktur Kommen fast in jedem Menü vor: Ähnliche Einträge Ähnliche Bilder Gleiche Shortcuts (Control -C, -V, -Z) Kommen fast in jeder Toolbar vor 11 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

12 Agenda Agenda Statik Dynamik Ergonomie Praktikumsaufgabe

13 Dynamische Aspekte von Dialogen: Was geschieht Daten darstellen Dialogsteuerung Mehrsprachigkeit Eingaben validieren Aktionen ausführen Zustände verwalten 13 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

14 Dynamik Dialoge und ihre Übergänge sichtbar machen Idee: Spezifizierte Masken ausdrucken An Pinnwand heften Mit Kunden über Dialogabläufe diskutieren (und aufmalen) Ablauf z.b. als als State-Diagram (UML) dokumentieren Minimal Screenshots mit Pfeilen verbinden 14 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

15 Agenda Agenda Statik Dynamik Ergonomie Praktikumsaufgabe

16 Ergonomie Das Aufgaben-Benutzer-Computer Modell Begriff der Arbeitswissenschaft. Relevant bei Arbeits(re)organisation Aufgabe Die Aufgaben durch geeignete Funktionen unterstützen Benutzer Persönlichkeitsförderlichkeit Angemessenheit Handhabbarkeit Computer Unterschiedliche Benutzer und unterschiedliche Nutzungen berücksichtigen Unnötige Interaktionen vermeiden und einfache Erschließbarkeit ermöglichen 16 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

17 Ergonomie Kriterien der Systemgestaltung: Wichtige Normen EG-Richtlinie 90/270 EWG Mensch-Maschine-Schnittstelle ISO 9241 (=DIN EN ) Teil 1-9: Hardware Requirements Teil 10: Dialog Principles Teil 11-17: spezifische Regelungen (Draft) ISO Analogon zur ISO 9001: Ergonomie statt Qualität Definiert effektiven benutzerzentrierten Entwicklungsprozeß 17 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

18 Ergonomie Grundsätze der Dialoggestaltung: (ISO 9241/10) Aufgabenangemessenheit (effektive, effiziente Unterstützung des Benutzers) Selbstbeschreibungsfähigkeit (jeder Schritt des Systems für Benutzer unmittelbar verständlich) Steuerbarkeit (Anpassbar an Benutzer: Verhalten, Farben, ) Erwartungskonformität (System verhält sich, wie es der Nutzer erwartet) Fehlerrobustheit (selbst bei Fehlern Arbeitsergebnis mit min. Korrekturaufwand erreichbar) Individualisierbarkeit (Makros, Abschalten von Bestätigungsdialogen,, PowerUser-Funktion) Lernförderlichkeit (passive und aktive Hilfe, Wizards, ) 18 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

19 Ergonomie (Aufgaben-) Angemessenheit Ein System ist angemessen, wenn es die Aufgabenerledigung durch geeignete Funktionen gut unterstützt. Es gibt verschiedene Aufgabentypen: formalisierbare, berechenbare Aufgaben: Zinsberechung automatisierte Berechnung Feste Bearbeitungsfolge: Auftragsbuchung computergesteuerte Bearbeitung (Formulare) unstrukturierte Aufgaben: Planung, Design computerunterstützte Bearbeitung (Direkte Manipulation) Aufgabenangemessenheit ergibt sich aus der gesamten Spezifikation und ist keine Eigenschaft der Benutzerschnittstelle! 19 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

20 Ergonomie Beispiel Aufgabenangemessenheit: Formularbasierte Oberflächen Feste Bearbeitungsfolge computergesteuerte Bearbeitung (Formulare) 20 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

21 Ergonomie Beispiel Aufgabenangemessenheit: Direkte Manipulation für Planungssysteme Projektplanung mit MS-Project und GANTT- Diagrammen Grafische Darstellung erleichtert Planung 21 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

22 Ergonomie Beispiel Aufgabenangemessenheit: Komplexe Planungssysteme Zeitwegediagramm zur direkt manipulativen Planung von Zugbegleitungen auf einer Zugstrecke. + Planungsstand dauerhaft sichtbar + Mögliche Rückfahrten werden angezeigt 22 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

23 Ergonomie Handhabbarkeit Ein System ist gut handhabbar, wenn die benötigten Funktionen einfach ausgeführt werden können. Handhabbarkeit wird durch viele Punkte beeinflusst: Sind systembedingte Zusatztätigkeiten erforderlich? (ich will verschiedene Dokumente bearbeiten und muss vorher das Bearbeitungsprogramm starten!) Sind die häufig genutzten Funktionen eines Dialogs besonders leicht ausführbar (z.b. Suche nach Elementen). Sieht man, in welchem Zustand der Dialog gerade ist? Orientiert sich das System an Nachbar-Anwendungen? Hat der Benutzer eine Chance, das System zu kapieren (Erschließbarkeit)? 23 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

24 Ergonomie Handhabbarkeit: Negativ-Beispiele Durchsuchen startet leider nicht die Suche :-( Kein Schließen-Button, (Escape geht auch nicht) Titelbeschriftung wird inkonsistent aktualisiert Aufteilung in drei Register: Übersicht geht verloren. Eingabe in Typ löscht Eintrag Name im anderen Register (und umgekehrt) 24 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

25 Ergonomie Handhabbarkeit: Warum kompliziert? 25 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

26 Ergonomie wenn es auch einfach geht! Sie verlassen das Programm. Änderungen speichern Änderungen verwerfen Zurück zur Anwendung Nicht Fragen stellen, sondern Konsequenzen verdeutlichen. Der Dialog ist erheblich kürzer und direkter und damit sicherer ausführbar und leichter erlernbar geworden. 26 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

27 Ergonomie Selbstbeschreibungsfähigkeit (EN ISO 9241 Teil 10) Beschreibung: Ein Dialog ist in dem Maße selbstbeschreibungsfähig, wie jeder einzelne Dialogschritt durch Rückmeldung des Dialogsystems unmittelbar verständlich ist oder dem Benutzer erklärt wird, wenn er die entsprechenden Informationen verlangt. Empfehlungen: nach jeder Handlung eine Rückmeldung Erläuterungen wenn schwerwiegende Folgen entstehen können an Benutzer angepasste Terminologie situationsbezogene Rückmeldung Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

28 Ergonomie Selbstbeschreibungsfähigkeit Hilfesysteme / Assistenten Office-Assistent Online-Hilfe 28 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

29 Ergonomie Sebstbeschreibungsfähigkeit Rückmeldung: Vorausschauendes Feedback In Informationssystemen sind es eher folgende Fakten: Prüfen ohne Speichern Simulation, Planvarianten 29 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

30 Ergonomie Sebstbeschreibungsfähigkeit Rückmeldung: Fortschrittsanzeige + Abbrechbarkeit 30 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

31 Ergonomie Sebstbeschreibungsfähigkeit: Lokalität der Beschriftungen Hier steht auch die Aktion. Hierhin kann der Benutzer nicht schauen, wenn er den Button drücken will... Dies is der Fokus für die Mausaktion. Hier sollte auch die Konsequenz der Aktion stehen. 31 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

32 Ergonomie Steuerbarkeit Arbeitsmittel und Wege für den Benutzer frei wählbar (z.b. mit Wizzard oder ohne) Vorgehen in leicht überschaubaren Dialogschritten Dialog kann beliebig unterbrochen und wieder aufgenommen werden Mehrstufiges undo und redo Sicherheitsabfragen bei kritischen Funktionen Steuerung der Menge der angezeigten Informationen (z.b. Auswahl kurz- oder Langdarstellung) Abschalten von Bestätigungsfenstern 32 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

33 Steuerbarkeit: Abschalten von Bestägigungsfenstern 33 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

34 Ergonomie Erwartungskonformität Dialogverhalten ist einheitlich Bei ähnlichen Arbeitsaufgaben sind die Dialoge einheitlich gestaltet Zustandsänderungen, die für den Dialog relevant sind, werden dem Benutzer mitgeteilt Eingaben in Kurzform werden als Langtext bestätigt 34 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

35 Statik Erwartungskonformität: konsistentes Verhalten Ziel: Intuitives Verständnis der GUI Z.B. alles mit gepunkteter Oberfläche kann bewegt werden 35 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

36 Ergonomie Fehlerrobustheit / Fehlermeldungen Markierung fehlerhafter Eingaben Cursor verschieben Kommentare 36 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

37 Ergonomie Lernförderlichkeit Beispiel Wizzard bei Powerpoint 37 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

38 Agenda Agenda Statik Dynamik Ergonomie Praktikumsaufgabe

39 Praktikumsaufgabe 2: Dialoge Arbeiten Sie meine Review-Anmerkungen zur Aufgabe 1 (Anforderungen und Anwendungsfälle) in ihre Ergebnisse ein Entwerfen Sie alle Dialoge (GUI Statik, also ausschließlich das Layout) für Ihre Anwendung Entwerfen Sie ein Übersichtsdiagramm mit dem Dialogfluss Achten Sie darauf, dass alle Anwendungsfälle abgedeckt sind Beachten Sie dabei die in der Vorlesung besprochenen Gestaltungsregeln Das Werkzeug ist Ihnen überlassen (z.b. gescannter Papierentwurf, Zeichenprogramm wie MS Visio, Prototypumgebung wie MS Access oder NetBeans) Stellen Sie Ihre Ergebnisse im WIKI ein 39 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /

40 Zeitplanung Alle Ergebnisse müssen eine Woche vor dem nächsten Termin im WIKI und Subversion Repository abgelegt sein Ich begutachte die Ergebnisse in der Woche des nächsten Termins Bereiten Sie sich auf eine Präsentation Ihrer Ergebnisse vor Viel Spaß und Erfolg! 40 Prof. Dr. Bernhard Humm, Hochschule Darmstadt, FB Informatik: Software Engineering (EIT), WS 2008 /