Screenlayoutelemente (Screendesign)

Beim Screenlayout geht es um die Gestaltung des Bildschirms, damit sein Inhalt als Einheit wahrgenommen werden kann. Dabei sind folgende Fragen relevant...

• Wie sollen die einzelnen Elemente platziert werden ?
• Worauf sollte man dabei achten ?
• Wie nehmen Menschen visuelle Ordnungen wahr ?
• Wie kann man Mithilfe der Strukturen Zusammenhänge verdeutlichen ?

Vor der Entwicklung eines Produkts ist es daher sinnvoll ein Konzept für die Gestaltung der Seiten auszuarbeiten. Nach der Feststellung, welche Elemente gebraucht werden muss deren Anordnung unter Berücksichtigung von Formen, Flächen und Linienverläufen geplant werden.

Man sollte dabei auf folgende Punkte achten...

• Der Bildschirminhalt sollte bei der Gestaltung auf Harmonie und Gesamteindruck überprüft werden. Der Screen sollte als Einheit wahrgenommen werden, daher sollten die dargestellten Elemente in Bezug und Ergänzung zueinander gesetzt werden.
• Konsistente Gestaltung der Seiten (Harmonische Ganzheit)
• Je nach Zielgruppe sollte man entscheiden ob die Bildschirmkomposition eher strukturiert oder verspielt sein soll. Man sollte die Präsentation an die Aufnahmefähigkeit des Benutzers anpassen. Weniger ist oft mehr !

Eine implizite Struktur
Es ist empfehlenswert, sich für die Erstellung von Bildschirmseiten grundsätzlich Muster zu entwerfen. Zuerst sollte man festlegen welche Elemente benötigt werden. Danach sollte man die Anordnung definieren. Dabei sollte man in Formen, Flächen und Linienverläufen denken bevor man an die Details geht.

Merke: Eine implizite Struktur setzt den Bildschirminhalt und die einzelnen Elemente in Beziehung zueinander und lässt sie zu einer Gesamtheit werden.

Vorder- und Hintergrund-Beziehung
Der Hintergrund, auf dem die verschiedenen Elemente liegen, dient als Rahmen und optischer Halt. Er zieht sich meist durch das ganze Multimediaprodukt hindurch und verleiht ihm eine Konsistenz. Er visualisiert außerdem oft das Thema und baut eine passende Atmosphäre auf. Die Bedeutung der Informationselemente wird dadurch verstärkt und sie werden außerdem optisch hervorgehoben.

Regeln zum guten Hintergrunddesign
Der Hintergrund darf auf keinem Fall die eigentlichen Bildschirminhalte und seine Elemente dominieren. Je mehr Elemente verwendet werden desto unaufälliger muss der Hintergrund sein. Es sollte daher wenige aufgehellte, großflächige Farben oder Bilder mit einer Unschärfe verwendet werden.

Man sollte immer versuchen, einen möglichst hohen Kontrast von Vorder- und Hintergrund zu erreichen. Das gilt sowohl für Farben als auch für Formen. Außerdem sollte nicht zu viele Hintergrundfarben verwendet werden. Das Auge des Betrachters wird dadurch nur abgelenkt.

Gestaltgesetze
Die Gestaltgesetze helfen die Elemente am Bildschirm so anzuordnen, dass sie der menschlichen Wahrnehmung entgegenkommen. Folgende Regeln und Prinzipien bilden eine Grundlage für die Gestaltung von ansprechendem Design...

• Gesetz der Nähe: Zusammengehörendes räumliche nahe beieinander anordnen
• Gesetz der Ähnlichkeit: Zusammengehörendes optisch ähnlich gestalten
• Gesetz der Prägnanz: Einfache Strukturen anbieten
• Gesetz der Geschlossenheit: Muss bei angeschnittenen oder überdeckten Formen beachtet werden
• Gesetz der Symmetrie: Schaffung von starken Strukturen durch symmetrische Anordnung
• Gesetz der Erfahrung: Es erlaubt, nicht alles zeigen zu müssen, da man Vorkenntnisse der Zielgruppe voraussetzt
• Gesetz der guten Fortsetzung: Lässt zusammengehörende Elemente entlang einer Linie anordnen

Linktip: Übersicht Gestaltgesetze

Blicksteuerung durch optische Signale
Für das Screendesign ist es besonders wichtig, bestimmte Dinge auf dem Bildschirm hervorzuheben und die Aufmerksamkeit des Benutzers darauf zu lenken. Hierfür können optische Elemente wie z.B. ein schrittweiser Aufbau einzelner Abschnitte oder Bilder verwendet werden.

Farben und ihr Einsatz
Der Einsatz von Farben ermöglicht es, Informationen eine weitere Dimension hinzuzufügen. Farben suggerieren unterschwellig eine eigene Botschaft, lösen Gefühle aus und wirken suggestiv. Häufig werden sie von Menschen unbewusst wahrgenommen.

Die Aufgabe von Farbe ist, Inhalte zu visualisieren und Ziele zu unterstützen wie z.b.

• Wiedererkennbarkeit des Erscheinungsbildes
• Gute Lesbarkeit von Text und Bild
• Navigation und Benutzerführung durch systematischen Farbeinsatz
• Animation und Zielgruppenansprache

Aufgrund von verschiedenen Enflussfaktoren werden Farben subjektiv wahrgenommen...

• Biologische Ursachen
• Kulturelle Ursachen
• Individuelle Vorlieben
• Psychologische Ursachen

Bildschirm versus Papier (RGB und CMYK)
Bildschirmfarben setzen sich grundsätzlich anders zusammen als Farbpigmente für den Druck. Papierausdrucke sind daher nur in CMYK Farben möglich. Für die Wiedergabe einer Grafik auf einem Monitor ist der RGB Farbraum zuständig. Er beinhaltet die 3 Grundfarben, die von allen Grafikprogrammen unterstützt werden. Mehr Infos dazu: Allgemeines zur Farbenlehre

Merke: Durch den unterschiedlichen Farbraum sind Bilfschirmdarstellung und Druckergebnis in keinem Fall identisch.

Folgende Richtlinien sollten beim Einsatz von Farbe am Screen berücksichtigt werden...

• Augenfreundlich gestalten (Hintergrundflächen in strahlungsarmen Farben anlegen)
• Distanz erzeugen mit kalten Farben (z.B. für Hintergründe, warme Farben eignen sich für Schriften und Linien da sie Nähe signalisieren)
• Hell-Dunkel-Kontrast Text/Hintergrund (Optimierung der Textlesbarkeit)
• Aufmerksamkeit erzeugen (z.B. durch Farben wie Rot, Orange oder Gelb. Sollte nur gezielt angewendet werden !)
• Sparsamer Einsatz von Farben (Zu viel Farben lenken vom Inhalt ab)
• Orientierungshilfe (Gleiche Sachverhalte sollte durchgängig in der gleichen Farbe dargestellt werden)
• Farben derselben Wellenlänge meiden (Betrifft die Lesbarkeit. Es wird für das Auge dadurch schwierig, Dinge zu fokussieren)
• Begrenzte Anzahl von Farben verwenden (max. 4-5 Farben, die zueinander passen und für Harmonie sorgen)

Hiermit wäre das Kapitel Planung und Elemente des Screendesigns abgeschlossen.