Was genau ist Screendesign?

Der Bildschirm, hier Screen, ist im Internet die wichtigste Schnittstelle. Sie übernimmt den Transport inhaltlicher Botschaften zu den Usern.

Was ist Screendesign?

Screen Design beschreibt das Design und bearbeiten von grafischen Benutzeroberflächen. Das Screendesign umfasst eine Vielzahl von Anwendungen, bei denen Bildschirme oder Displays als Teil der Mensch-Maschine Interaktion eingesetzt werden können. Das Screendesign ist von den Funktionen einer grafischen Benutzeroberfläche zu unterscheiden. Die technische Umsetzung ist nicht Bestandteil des Screendesigns.

Gutes Screendesign verfolgt nicht bloß ästhetische Ziele in der Gestaltung des Layouts von Anwendungen, sondern auch funktionale Aspekte. Somit lässt sich Screendesign nur schwer vom Interfacedesign trennen.

Was ist Screendesign?

Allgemeine Informationen

Unter Screendesign versteht man die Konzeption und Erstellung der grafischen Benutzeroberfläche (GUI). Von entscheidender Bedeutung ist die Anordnung der Elemente für den Nutzer, die auf dem Bildschirm zu sehen sind. Dies betrifft in erster Linie das Layout. Das Konzept der Informationsarchitektur wird ausführlich präsentiert. Die Position von Elementen wie Navigation, Text, Überschriften sowie Unterüberschriften, Bilder, Videos, Symbole und andere Inhalte der Benutzeroberfläche ist ein wichtiger Faktor. Das Screendesign beschäftigt sich daher mit der Zusammensetzung der verschiedenen Elemente und Inhalte und deren Darstellung auf der jeweiligen Oberfläche. Und das ist was Screendesign letztendlich darstellt.

Verwendung von Screen Design

Screen Design wird nicht nur für Websites, mobile Websites oder Apps für Smartphones eingesetzt, sondern auch in vielen anderen Anwendungen oder Geräten, bei denen die Benutzerinteraktion auf unterschiedlichen Bildschirmgrößen im Mittelpunkt steht. Diese verschiedenen Formate oder Geräte stellen für Screendesigner eine Herausforderung dar, da die Inhalte auf verschiedenen Bildschirmen dargestellt werden. Das bedeutet auch, dass bestimmte Einschränkungen des Layouts berücksichtigt und genutzt werden müssen.

Die Merkmale und möglichen Interaktionsmuster sollten durch die grafischen Eigenschaften des Mediums oder der Vorrichtung unterstützt werden. Gleichzeitig muss der Gesamteindruck der Bildschirmdarstellung bestimmte ästhetische Anforderungen erfüllen. So sollten beispielsweise die Elemente auf den Bildschirmen die richtigen Proportionen haben, die eine ästhetische Wirkung auf den Betrachter oder Benutzer haben. Diese Ästhetik wiederum ist mit der Benutzeroberfläche verbunden und steht in direktem Zusammenhang mit Aspekten wie Webdesign, Usability oder User Experience.

Funktionsarten

Screen Designer arbeiten in der Regel mit Programmierern und Webdesignern zusammen, um die Funktionen von Display-Anwendungen durch Design zu unterstützen. Sie müssen den Anforderungen des Screen Designs entsprechen und auch psychologische und technische Faktoren berücksichtigen. Schließlich sind Bildschirme immer Teil der verwendeten Programmier- oder Markup-Sprache. Benutzer stehen im Screendesign immer am Anfang eines Prozesses. Die Gestaltung des Bildschirms sollte auf der Grundlage der Zielgruppe erfolgen. Barrierefreie Screendesigns sind daher anders konzipiert als Screendesigns für mobile Geräte. Displays für Kinder enthalten andere Gestaltungselemente als solche für Erwachsene.

Im Laufe des Designprozesses spielen auch Aspekte wie Corporate Design oder die technische Umsetzung mit HTML, PHP und insbesondere CSS eine wichtige Rolle. Letzteres ist natürlich abhängig vom Anwendungsbereich und der verwendeten Sprache. Screen Designer erstellen daher oft einen Style Guide, der die Muster der Interaktion und des visuellen Designs zusammenfasst und dokumentiert. Zweck eines Style Guides ist die konsequente Umsetzung der unterschiedlichen Anforderungen an die verschiedenen Ausgabegeräte, Zielgruppen und Benutzeroberflächen.

Inhalt der Style Guides

Style Guides können aus den folgenden Faktoren bestehen:

  • Informationen oder Seitenarchitektur
  • Allgemeines Layout (bei Websites wäre dies die Strukturierung von Ausgabevorlagen)
  • Grundlegende Bedienungsanleitung
  • Detaillierte Spezifikation der Bildschirmmasken
  • Zuordnungen von Funktionen zu Bildschirmen (Menü, Navigation, Inhalt)
  • Zuordnung von Funktionen zu Interaktionsstilen (Steuerung mit Maus, Tastatur oder Kontextmenü)
  • Typografisches Konzept (Schriftart, Schriftgröße, Textlayout)
  • Farbschema (Farbe der Schrift-, Hintergrund- und Bildschirmmasken)
  • Stil von Fenstern, Popups, Infografiken, Symbolen, Schaltflächen und Animationen
  • Definition von Formaten für Zahlen, Daten oder Adressinformationen
  • Entwurfsmuster (Vorlage) für nachfolgende Inhalte

Typischerweise werden im Style Guide Beispiele erstellt, die dem Kunden einen konkreten ersten Eindruck von der grafischen Benutzeroberfläche vermitteln.

 

Bedeutung für die Benutzerfreundlichkeit

Screendesign geht Hand in Hand mit technischen, psychologischen und natürlich praktischen Aspekten einer Benutzeroberfläche. Im Vorfeld müssen die Zielgruppe, das Ziel der UI und der Rahmen, in dem sie existiert, berücksichtigt werden. Ob Website, mobile Website oder Softwareanwendung, das Screendesign ist nicht nur wichtiger als der erste Eindruck einer Anwendung, sondern ein Schlüsselfaktor für die grafischen Eigenschaften der gesamten Benutzeroberfläche. Daher spielt das Screendesign eine besonders wichtige Rolle in den Bereichen Usability, User Experience und Interaktion zwischen Mensch und Maschine. Das Screendesign kann die Konversion einer Website oder einer App erheblich beeinflussen.

CMS
Drupal
Joomla
Magento
ModX
Squarespace
TYPO3
Weebly
Wix
Wordpress

Tools
Ajax
Angular
CoffeeScript
CSS
Grunt
Gulp
JavaScript
NodeJS
Python
React
Sass
Vue.js

Datenbanken
MongoDB
MySQL
PostScript

E-Commerce
Konversions-Rate
WooCommerce

SEO
CRM
ERP
Google PageRank

Webdesign
Formfaktoren
Full Service Agentur
Gutes Webdesign
Screendesign

Sonstiges
Open Source

Bei Fragen schreiben Sie uns!