GUI-Design

Inhalt

1 Einleitung

Einleitung

1.1 Über das Buch

1.1.1 Das Stichwort „GUI“

1.1.2 GUI – Fluch oder Segen?

1.1.3 Software – heute für die Welt von morgen

1.1.4 Fremdwort „UID“ – User Interface Design

1.1.5 Konstruktion vs. Komposition

1.1.6 Der Design-Prozess

1.1.7 Gutes oder schlechtes Design, aber nie kein Design

1.1.8 Neue Windows-Sprachen

1.1.9 Typographie: Programm plus Schriften plus Know-how

1.1.10 Vorteile von gutem Software-Design

1.1.11 Vorteile fertiger Schnittmuster

1.1.12 Normen zur Softwareergonomie

1.2 Über den Leser

1.2.1 Die Zielgruppe

1.2.2 Die Anwender

1.3 Über die Benamungen im Buch

1.3.1 Benutzer vs. Benutzung

1.3.2 GUI-Elemente: Pushbutton vs. Schaltflächen

1.4 Über die Neuauflage des Buches

1.4.1 Windows XP – The Next Generation?

1.4.2 Web-Design vs. GUI-Design

1.4.3 Web-Formulare vs. GUI-Dialoge

1.4.4 Beispiele: DOS, Windows 3.x, 9x, NT, 2000, xx...

1.5 Über die Vorgehensweise

2 GUI-Applikationen

2 GUI-Applikationen

2.1 Dieses Kapitel ...

2.2 Grundsätzliches

2.2.1 WIMP – „Windows, Icons, Menus & Pointing“

2.2.2 Einige Arten von Applikationen

2.3 Prinzipien für Benutzeroberflächen

2.3.1 Aufgabenangemessenheit

2.3.2 Selbstbeschreibungsfähigkeit

2.3.3 Steuerbarkeit

2.3.4 Erwartungskonformität

2.3.5 Fehlertoleranz

2.3.6 Individualisierbarkeit

2.3.7 Lernförderlichkeit

2.3.8 Ästhetik

2.3.9 Emotionalität

2.3.10 Metaphern

2.3.11 Direkte Manipulation

2.4 Zum Anwender

2.4.1 Benutzerprofile

2.4.2 Benutzerwortschatz

2.4.3 Mehrsprachige Applikationen

2.4.4 Anmerkungsspeicher

2.5 Schnittstellen

2.5.1 Tastaturbedienung

2.5.2 Mausfunktionen

2.5.3 Neuheiten seit Windows 98

2.5.4 Tastatur vs. Maus

3 Fenster

3 Fenster

3.1 Dieses Kapitel ....

3.2 Grundsätzliches

3.2.1 Etwas Geschichte

3.2.2 Applikationen: Leben in Fenstern

3.2.3 Die Elemente eines Fensters

3.2.4 Designwerkzeuge

3.2.5 Gestaltungsprinzipien

3.2.6 Standardfunktionen

3.2.7 Größe

3.2.8 Raumaufteilung & Layout

3.2.9 Position

3.2.10 Farben

3.2.11 Schriftarten

3.2.12 Modale Fenster

3.2.13 Ansicht-/Bearbeiten-/Neuaufnahme-Modus

3.2.14 MDI-Applikationen

3.2.15 Verknüpfte Fenster

3.2.16 Vorbelegungen

3.3 Der Desktop

3.3.1 Ein Anwendermessgerät ...

3.3.2 Desktop als Referenzkarte

3.3.3 Größe des Desktops

3.3.4 Bildschirmauflösung

3.3.5 System-Schriftart

3.3.6 Farben

3.4 Das Shellwindow

3.4.1 Steuerelemente in der Shell

3.4.2 Starten Sie mit einer guten „Home Base“

3.4.3 Verabschiedung

3.5 Childwindows

3.5.1 Größe

3.5.2 Platzierung

3.5.3 Grundfunktionalität

3.5.4 Vorgehensweise

3.6 Messageboxen

3.6.1 Standard-Messageboxen

3.6.2 Texte

3.6.3 Icons

3.6.4 Buttons

3.6.5 Abfragen „on demand“

3.6.6 Selbstschließende Messageboxen

3.6.7 Fehlermeldungen

3.6.8 Alternativen

3.6.9 Meldungsaufkommen

3.6.10 Beliebte Fehler

3.7 Dialoge

3.7.1 Standard-Dialoge

3.7.2 Dialoge wiederholen

3.7.3 Zur Raumaufteilung

3.7.4 Titelleisten-Varianten

3.8 Register-Dialoge

3.8.1 Vorteile

3.8.2 Beliebte Unschönheiten

3.8.3 Vorgehensweise

3.9 Teilbare Fenster

3.9.1 Explorer-Fenster

3.9.2 Split-Windows

3.10 Klapp-Dialoge

3.10.1 Wichtige und unwichtige Controls

3.10.2 Einbahnstraßen

3.10.3 Alternativen

3.11 Assistenten

3.11.1 Gezieltes, schrittweises Vorgehen

3.11.2 Anordnung der Pushbuttons

4 Menüs

4 Menüs

4.1 Dieses Kapitel ...

4.2 Grundsätzliches

4.2.1 Die Elemente eines Menüs

4.2.2 Zur Nomenklatur

4.3 Menüelemente

4.3.1 Texte

4.3.2 Bitmaps

4.3.3 Texte und Bitmaps

4.3.4 Trennlinien

4.3.5 Untermenüs

4.3.6 Kurzbeschreibungen

4.3.7 Windows 98 ff.-Menüs

4.4 Organisation

4.4.1 Platzierung

4.4.2 Gruppierungen

4.4.3 Anzahl der Optionen

4.4.4 Reihenfolge

4.4.5 Beliebte Fehler

4.5 Menütexte

4.5.1 Wortwahl

4.5.2 Formales

4.5.3 Inhalt & Bedeutung

4.5.4 Beliebte Fehler

4.6 Tastenfunktionen

4.6.1 Hotkeys

4.6.2 Tastenkürzel

4.7 Dynamische Menüs

4.7.1 Werte statt Optionen

4.7.2 Optionen verändern

4.8 Untermenüs

4.8.1 Schachtelungstiefe

4.8.2 Abreißbare Menüs

4.8.3 Menüarten

4.9 Pulldown-Menüs

4.9.1 Besonderheiten

4.9.2 Die Menüleiste

4.9.3 Standardmenü DATEI BEARBEITEN ANSICHT FENSTER HILFE

4.9.4 Zentrales Pulldown-Menü

4.9.5 Vorteile von Pulldown-Menüs

4.9.6 Nachteile

4.9.7 Alternativen

4.10 Kontextmenüs

4.10.1 Allgemeines

4.10.2 Vorteile

4.10.3 Nachteile

4.10.4 Standard-Kontextmenüs

4.10.5 Zugriff auch über Tastatur

4.10.6 Beliebte Fehler

4.10.7 Fenster-Kontextmenüs

4.10.8 Floskelspeicher

4.11 Popup-Menüs

4.11.1 Pushbutton plus Kontextmenü

4.11.2 Vorteile

4.11.3 Nachteile

4.11.4 Beliebte Fehler

4.11.5 Alternativen

4.12 Systemmenüs

4.12.1 Etwas versteckt ...

4.12.2 ... aber flexibel

4.12.3 Erweiterungen

4.12.4 Vorteile

4.12.5 Nachteile

4.12.6 Beliebte Fehler

4.13 Icon-Menüs

4.13.1 Vorteile

4.13.2 Nachteile

4.13.3 Alternativen

4.14 Symbolleisten

4.14.1 Merkmale

4.14.2 Vorteil

4.14.3 Nachteil

4.14.4 Controls in Symbolleisten

4.14.5 Bitmap-Buttons

4.14.6 „Kybernetische“ Fähigkeiten

4.14.7 Menüoption, Pushbutton oder Toolbar-Button?

4.14.8 Tooltipps für Toolbar-Bitmaps

4.14.9 Beliebte Fehler

4.14.10 Varianten

4.15 Statusleisten

4.15.1 Einsatzmöglichkeiten

4.15.2 Vorteile

4.15.3 Nachteile

4.15.4 Beliebte Fehler

4.16 Konfigurierbarkeit

4.16.1 Für den Benutzer definiert

4.16.2 Durch den Benutzer definierbar

4.16.3 Beispiel: Word für Windows

4.17 Alternativen zum Menü

4.17.1 Dialogboxen

4.17.2 Pushbuttons

4.17.3 Geheimtasten

4.18 Menüs „messen“

4.18.1 Quiz der Art „Wo bin ich?“

4.18.2 Anwender-Feedback

4.19 Vorgehensweise

4.19.1 Menüart

4.19.2 Zusammenstellen der Optionen

4.19.3 Symbolleisten

5 Steuerelemente

5 Steuerelemente

5.1 Dieses Kapitel ...

5.2 Übersicht

5.2.1 Statische Elemente

5.2.2 Eingabefelder

5.2.3 Auswahl-Elemente

5.2.4 Tabellen-Controls

5.2.5 Schaltflächen

5.2.6 Statusanzeigen

5.3 Grundsätzliches

5.3.1 Sichtbarkeit

5.3.2 Anordnung

5.3.3 Reihenfolge

5.3.4 Farben

5.3.5 Gleichförmigkeit

5.3.6 Schriftarten

5.3.7 Beschriftung

5.3.8 Tooltipps

5.3.9 Attribute

5.3.10 Auswahlhilfen

5.3.11 Validierung

5.4 FixedText-Elemente

5.4.1 Bezeichnungen

5.4.2 Eigenschaften

5.4.3 Bemaßungen

5.4.4 Beschriftung

5.4.5 Anordnung

5.4.6 Größe

5.4.7 Erweiterte Attribute

5.4.8 Beliebte Eigentümlichkeiten

5.5 Rahmen & Linien

5.5.1 Eigenschaften

5.5.2 Bemaßungen

5.5.3 Erweiterte Attribute

5.5.4 Beliebte Eigentümlichkeiten

5.6 Bitmaps & Icons

5.7 SingleLineEdit

5.7.1 Bemaßungen

5.7.2 Anordnung

5.7.3 Standard-Attribute

5.7.4 Erweiterte Attribute

5.7.5 Abweichungen vom Windows-Standard

5.7.6 Alternativen

5.7.7 Beliebte Eigentümlichkeiten

5.8 Editierbare Comboboxen

5.8.1 Eigenschaften

5.8.2 Bemaßungen

5.8.3 Alternativen

5.8.4 Beliebte Fehler

5.9 Drehfelder

5.9.1 Bezeichnungen

5.9.2 Eigenschaften

5.9.3 Bemaßungen

5.9.4 Erweiterte Attribute

5.9.5 Alternativen

5.9.6 Beliebte Fehler

5.10 MultiLineEdit

5.10.1 Eigenschaften

5.10.2 Bemaßungen

5.11 RichText-Controls

5.12 Popup-Menüs

5.13 Kontextmenüs

5.14 Radiobuttons

5.14.1 Bezeichnungen

5.14.2 Eigenschaften

5.14.3 Beschriftung

5.14.4 Hotkeys

5.14.5 Bemaßungen

5.14.6 Erweiterte Attribute

5.14.7 Alternativen

5.14.8 Beliebte Unschönheiten

5.15 Checkboxen

5.15.1 Bezeichnungen

5.15.2 Bemaßungen

5.15.3 Eigenschaften

5.15.4 Erweiterte Attribute

5.15.5 Alternativen

5.15.6 Beliebte Fehler

5.16 Comboboxen

5.16.1 Eigenschaften

5.16.2 Bemaßungen

5.16.3 Alternativen

5.16.4 Beliebte Fehler

5.17 Listboxen

5.17.1 Eigenschaften

5.17.2 Attribute

5.17.3 Bemaßungen

5.17.4 Alternativen

5.17.5 Beliebte Fehler

5.18 ListView-Elemente

5.18.1 Bezeichnungen

5.18.2 Eigenschaften

5.18.3 Erweiterte Attribute

5.18.4 Alternativen

5.18.5 Beliebte Fehler

5.19 TreeView-Elemente

5.19.1 Bezeichnungen

5.19.2 Eigenschaften

5.19.3 Erweiterte Eigenschaften

5.19.4 Alternativen

5.19.5 Beliebte Fehler

5.20 Scrollbars

5.20.1 Bezeichnungen

5.20.2 Eigenschaften

5.20.3 Alternativen

5.20.4 Beliebte Fehler

5.21 Schieberegler

5.21.1 Eigenschaften

5.21.2 Erweiterte Attribute

5.21.3 Alternativen

5.21.4 Beliebte Fehler

5.22 Browser

5.22.1 Zellen

5.22.2 Teilungsmöglichkeiten

5.22.3 Breite der Spalten

5.22.4 Browser vs. Eingabemasken

5.22.5 Browser – noch zeitgemäß?

5.22.6 Alternativen

5.23 Pushbuttons

5.23.1 Eigenschaften

5.23.2 Bemaßungen

5.23.3 Beschriftung

5.23.4 Farbe

5.23.5 Anordnung

5.23.6 Erweiterte Attribute

5.23.7 Alternativen zu Pushbuttons

5.23.8 Beliebte Fehler

5.24 Bitmap-Buttons

5.24.1 Einsatzmöglichkeiten

5.25 Tab-Controls

5.25.1 Bemaßungen

5.25.2 Laschentexte

5.25.3 Bitmaps in Laschen

5.25.4 Dynamische Laschen

5.25.5 Verschachtelte Laschen

5.25.6 Controls außerhalb der Laschenfenster

5.25.7 Pushbuttons

5.25.8 Tastenbedienung

5.25.9 Alternativen

5.26 Fortschrittsanzeigen

5.26.1 Eigenschaften

5.26.2 Regeln

5.26.3 Restriktionen

5.26.4 Möglichkeiten

5.26.5 Alternativen

5.26.6 Beliebte Fehler

5.27 Mauszeiger

5.27.1 Mauscursor als Feedbackanzeige

5.27.2 Mauscursor als Informationsträger

5.27.3 Hotspot

5.27.4 Intelligentes Platzieren

5.28 Zwischenablage

5.28.1 Originale Zwischenablage

5.28.2 Zusatzprogramm „ClipTray“

5.28.3 Desktop als Ablage

5.28.4 Selbst programmierte Zwischenablage

5.29 Custom Controls – Get Unlimited Interfaces

5.29.1 WYSIWYG-Controls

5.30 TUI – Tangible User Interface

5.31 Microsoft Visual Studio .NET – Der neue GUI-Standard?

6 Graphikelemente

6 Graphikelemente

6.1 Dieses Kapitel ...

6.2 Grundsätzliches

6.2.1 Warum Graphik ...?

6.2.2 Anwendungen

6.2.3 Pixelschmuck

6.2.4 Orientierung an Standards

6.2.5 Einheitlichkeit

6.2.6 Beliebte Vorurteile

6.3 Werkzeuge

6.3.1 Für Bitmaps ...

6.3.2 Für Icons...

6.3.3 Für Cursor ...

6.3.4 Hilfreich: Lupe bei Windows 98

6.4 Äußerlichkeiten

6.4.1 Größe

6.4.2 Farbe

6.4.3 Beleuchtung

6.4.4 Umriss

6.4.5 Testen, testen, testen!

6.4.6 Beliebte Fehler

6.5 Innere Werte

6.5.1 Verb vs. Objekt

6.5.2 Symbolbedeutung

6.5.3 Unterscheidbarkeit vs. Attraktivität

6.5.4 Einheitlichkeit vs. Erkennbarkeit

6.5.5 Erkennen vs. Wiedererkennen

6.5.6 Konsistenz

6.5.7 Beliebte Fehler

6.6 Bitmaps

6.6.1 Startbitmap beim Laden der Applikation

6.6.2 Schmuck-Elemente

6.6.3 WYSIWYG-Elemente

6.6.4 Validierungsanzeigen

6.6.5 Bitmaps in TreeView-Elementen

6.6.6 Bitmaps in ListView-Elementen

6.6.7 Bitmaps in Pushbuttons

6.6.8 Bitmaps in TabControl-Laschen

6.6.9 Bitmaps als Menüoptionen

6.6.10 Bitmaps in Toolbars

6.7 Icons

6.7.1 Sinnvolle Beschränkungen

6.7.2 Icons: Bilder oder Symbole

6.7.3 Texte in Icons

6.7.4 Icons mit Verknüpfungsfunktion

6.7.5 Applikations-Icons

6.7.6 Fenster-Icons

6.7.7 Bearbeitung von Icons als Bitmaps

6.8 Mauszeiger

6.8.1 Mauszeiger ...?

6.8.2 Standard-Mauszeiger

6.8.3 Geben Sie Feedback, Sire!

6.8.4 Sehr, sehr sinnvolle Ergänzungen

6.8.5 Optional: Tastenfunktionen

6.8.6 Der Hotspot

6.9 Animationen

6.9.1 Benutzung vorhandener Ressourcen

6.9.2 Kleine Icons

6.9.3 Herstellung

6.10 Vorgehensweise

6.10.1 Scharenweise Bitmaps

6.10.2 Erstens: Viel Zeichenplatz ...

6.10.3 Zweitens: Brainstorming

6.10.4 Drittens: Randbedingungen festlegen

6.10.5 Viertens: Entwurf der „Kulisse“

6.10.6 Fünftens: Entwurf der „Hauptszene“

6.10.7 Sechstens: Abstimmung

6.10.8 Siebtens: Reinzeichnung

6.10.9 Ad infinitum: Prüfen & korrigieren

7 Wegweiser zum erfolgreichen „ Going GUI“

7 Wegweiser zum erfolgreichen „ Going GUI“

7.1 Dieses Kapitel ...

7.2 Software-Design

7.2.1 Folgen von Software

7.2.2 Entscheidungsgeschwindigkeit

7.2.3 Externe Anregungen

7.2.4 Interne Regeln

7.2.5 Ergebnisse prüfen

7.2.6 Konstruktion vs. Komposition

7.2.7 Für den Anwender

7.2.8 Werkzeuge: Painter vs. Papier

7.2.9 Letztendlich–

7.3 Zum Anwender ...

7.3.1 Fehler des Anwenders

7.3.2 Typische Fragen der Benutzer

7.3.3 Software für Anwender

7.4 Zur Applikation ...

7.4.1 Aufgabenangemessenheit

7.4.2 Einheitliche Gestaltung

7.4.3 Konsistenz

7.4.4 Räumliche Platzierung von Elementen

7.4.5 Mehr Sicherheit

7.4.6 Mehr Möglichkeiten

7.4.7 Hinzufügen neuer Features

7.4.8 Features vs. Effizienz und Usability

7.4.9 What you see is what you know

7.4.10 Das Pareto-Prinzip

7.4.11 Virtuosität

7.4.12 Die Goldene Grundregel

7.5 Zum Schluss ...

7.5.1 PS No. 1

7.5.2 PS No. 2

Anhang

Anhang

A Dieses Kapitel …

B Normen

C Styleguides

D Windows-Programmierung

E GUI-Gestaltung

F Icon-Design

G Gestaltung von Hilfesystemen

H Web-Design

I Software-Entwicklung

J Typographie

K Farblehre

L Unterhaltsames

M Ergonomie-Randgebiete

Index

Index