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

Präsentation zum Thema: "Mitglied der Fachhochschule Ostschweiz FHO 1 www.fhsg.ch © FHS St.Gallen Software Engineering OOD – Object Oriented Design III GUI-Design."—  Präsentation transkript:

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

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

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

4 Mitglied der Fachhochschule Ostschweiz FHO 4 www.fhsg.ch © 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)

5 Mitglied der Fachhochschule Ostschweiz FHO 5 www.fhsg.ch © 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)

6 Mitglied der Fachhochschule Ostschweiz FHO 6 www.fhsg.ch © 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

7 Mitglied der Fachhochschule Ostschweiz FHO 7 www.fhsg.ch © 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)

8 Mitglied der Fachhochschule Ostschweiz FHO 8 www.fhsg.ch © 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) www.procontext.com/de/richtlinien

9 Mitglied der Fachhochschule Ostschweiz FHO 9 www.fhsg.ch © 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)

10 Mitglied der Fachhochschule Ostschweiz FHO 10 www.fhsg.ch © 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

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

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

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

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

15 Mitglied der Fachhochschule Ostschweiz FHO 15 www.fhsg.ch © FHS St.Gallen Software Engineering Literaturhinweis Kompendium Screen-Design Frank Thissen ISBN 3-540-43552-2 Springer-Verlag

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