Mitglied der Fachhochschule Ostschweiz FHO 1 © FHS St.Gallen Software Engineering OOD – Object Oriented Design III GUI-Design

Mitglied der Fachhochschule Ostschweiz FHO 2 © FHS St.Gallen Software Engineering Lernziele Sie können... –die Grundsätze des Screen-Designs erläutern –einen GUI-Design vornehmen.

Mitglied der Fachhochschule Ostschweiz FHO 3 © FHS St.Gallen Software Engineering Literatur Applikationen objektorientiert konzipieren: –Kapitel 8.2 Lehrbuch der Objektmodellierung: –LE 9 + LE 10

Mitglied der Fachhochschule Ostschweiz FHO 4 © FHS St.Gallen Software Engineering GUI – Graphical User Interface Mensch-Maschine-Schnittstelle Look and Feel Dialoggestaltung –Styleguides –Softwareergonomie Gesetzliche Vorgaben –Barrierefreiheit (Zugang für Behinderte) –Web Accessibility Initiative (WAI) der W3C Technik berücksichtigen: –Rich-Client –Thin-Client (mit Browser)

Mitglied der Fachhochschule Ostschweiz FHO 5 © FHS St.Gallen Software Engineering Software-Ergonomie – ISO 9241 Aufgabenangemessenheit Selbstschreibungsfähigkeit (Hilfen, Rückmeldungen) Steuerbarkeit durch den Benutzer Erwartungskonform (konsistent) Fehlertolerant Individualisierbar Lernförderlich (z.B. Nutzung von Metaphern)

Mitglied der Fachhochschule Ostschweiz FHO 6 © FHS St.Gallen Software Engineering Bedienungs-Orientierung Objektorientiert Geschäftsobjekte sichtbar Kontextmenü (Pop-Up-Menü) beim Objekt Passende Symbolleisten Doppelklick auf Objekt Drag and Drop Funktionsorientiert Programmaufruf Öffnen bzw. Suchen der Objekte als Funktion im Anwendungsprogramm Zugang über Menü (Drop-Down-Menü) in Menübalken

Mitglied der Fachhochschule Ostschweiz FHO 7 © FHS St.Gallen Software Engineering Fensterarten Anwendungsfenster: –meist nicht modal Hauptfenster Unterfenster Dialog-, Mitteilungsfenster –meist modal (d.h. müssen exklusiv bearbeitet und wieder verlassen werden)

Mitglied der Fachhochschule Ostschweiz FHO 8 © FHS St.Gallen Software Engineering Style-Guides Microsoft Windows XP - Guidelines for Applications IBM IBM Common User Access Guidelines, (CUA) Apple Macintosh Human Interface Guidelines SAP R/3 Style Guide Open Software Foundation (Osf) Osf/Motif Style Guide: Revision 1.2 (Osf/Motif Series) SUN Microsystems Java Look and Feel Design Guidelines (2nd Edition)

Mitglied der Fachhochschule Ostschweiz FHO 9 © FHS St.Gallen Software Engineering Interaktionselemente Textfeld (ein-/mehrzeilig) Drehfelder (spin button) Optionsfeld (radio button) Kontrollkästchen (check box) Listenfeld (list box) Kombinationsfeld (combo box, dop-down) Schieberegler (slider) Schaltflächen (command button) Register (tab control) Strukturansicht (tree view control)

Mitglied der Fachhochschule Ostschweiz FHO 10 © FHS St.Gallen Software Engineering Farb-Gestaltungsregeln Farben sparsam einsetzen Konsistentes Farbdesign keine grellen Farben, eher Pastelltöne Auf Farbkontraste achten: –nicht störend –nicht hindernd für Farbenblinde –druckfähig Farbmetaphere korrekt verwenden: –grün ok, weiter –gelb Achtung, Vorsicht –rot Stopp

Mitglied der Fachhochschule Ostschweiz FHO 11 © FHS St.Gallen Software Engineering Bildschirmgestaltungsregeln Proportionen beachten Symmetrie einhalten Sequenz muss logisch sein Möglichst einfach gestalten virtuelle Linien minimieren

Mitglied der Fachhochschule Ostschweiz FHO 12 © FHS St.Gallen Software Engineering Entwurf der GUI-Schicht

Mitglied der Fachhochschule Ostschweiz FHO 13 © FHS St.Gallen Software Engineering Entwicklungstools I Visueller Editor

Mitglied der Fachhochschule Ostschweiz FHO 14 © FHS St.Gallen Software Engineering Entwicklungstools II Business Intelligence und Reporting Tool

Mitglied der Fachhochschule Ostschweiz FHO 15 © FHS St.Gallen Software Engineering Literaturhinweis Kompendium Screen-Design Frank Thissen ISBN Springer-Verlag

Mitglied der Fachhochschule Ostschweiz FHO 16 © FHS St.Gallen Software Engineering Übungen UML-Übungen Übung 9 Fallstudie Nutz AG Auftrag 9