Das Layout und der Aufbau von digitalen und interaktiven Medien sollten die relevanten Informationen so darstellen, dass sie kognitiv leicht erfasst und behalten werden können. Die Prinzipien gelten aber gleichermassen für unterschiedliche digitale und interaktive Informationsprodukte wie Webseiten, Lernplattformen, LernApps oder Präsentationsfolien.
Das Ziel von digitalen Designprinzipen ist, dass Informationen leicht erfasst werden sollen und die interaktiven Elemente und die Navigation intuitiv sind.
Bei digitalen und interaktiven Projekten ist eine gute Planung essentiell. Beispielsweise die Navigation, verlinkte Medien, Abläufe oder auch Quizze sollten logisch aufgebaut werden, damit die Informationen verstanden werden und einen zusätzlichen Nutzen erbringen.
2. Spezifische Designprinzipien im digitalen oder interaktiven Kontext
Generell gelten auch innerhalb eines digitalen oder interaktiven Kontexts die grundlegenden Prinzipien. Folgend werden spezifische oder ergänzende Prinzipen aufgeführt, die helfen sollen, ein digitales und/oder interaktives Produkt wirkungsvoll zu gestalten.
A) Benutzeroberfläche
Zu Beginn des Designprozesses muss meistens ein Seitenverhältnis gewählt werden. Dies hängt aber von der Software und dem Endgerät ab. Je nach dem für welche Anwendung und welches Device, empfiehlt sich ein anderes Format. (Konzeptfrage: Mit welchem Gerät wird die Anwendung genutzt? Laptop? Web?).
Generell ist es empfehlenswert, das Standard-Querformat16:9 zu nutzen. Es ist ein längliches Format, das beim Gestalten herausfordernd sein kann. Der grosse Vorteil ist, dass z.B. exportiere Folien (von PowerPoint) ohne Änderung in einen Film integriert werden können. Ein Slidecast oder Screencast ist somit schneller und effizienter hergestellt, weil das Format schon stimmt. Bilder (z.B. interaktiv) können in ein Videoformat eingebettet werden. Bei einer Webanwendung werden Bilder im Querformat 16:9 vollständig und ohne zu scrollen angezeigt.
Soll das Design ausschliesslich für Smartphones sein, ist das Hochformat von Vorteil.
Für Anwendungen, die sich einem Gerät anpassen, ist die Skalierbarkeit der Benutzeroberfläche und den einzelnen Elementen (inkl. neue Anordnung) und die Erweiterbarkeit (sog. Responsive Design) von Bedeutung. In der Regel übernimmt eine Software die Anpassung. Dennoch empfiehlt es sich, schon im Designprozess regelmässig auf allen Geräten Tests durchzuführen.
Bei der Webanwendung können Elemente dynamisch sein (die Grösse und Position der Elemente oder auch Textgrösse ist anhängig von der Grösse des Browserfensters). Dies erschwert einerseits den Designprozess - andererseits ermöglicht es eine uneingeschränkte Anwendung bei verschiedenen Internet-Browsern und Geräten.
Falls ein Interaktionskonzept vorliegt empfiehlt sich, eine genügend lange Testphase einzuplanen.
Sieht das Konzept vor, viele Ressourcen und grossen Datenmengen (z.B. qualitative und lange Videos) einzubinden, ist es wichtig, vorab die Performance der Plattform, der Webapplikation, der Webseite etc. zu prüfen. Allenfalls empfiehlt es sich, die Daten zu reduzieren oder extern zu speichern. Siehe auch Medien nutzen und teilen.
C) Navigation und Struktur
Benutzerführung und Navigation sind im digitalen Bereich und bei Lerneinheiten von grosser Bedeutung. Je besser durch die Einheiten geführt wird (z.B. zusammenhänge Bereiche verlinkt sind), desto einfacher ist das Lernen und Verstehen.
Navigationskonzept, Struktur und Hierarchie des Inhaltes sind vorab zu definieren, damit die Interaktion im digitalen Raum intuitiv und nicht hinderlich ist. Kontraproduktiv heisst zum Beispiel: Verlinkungen funktionieren nicht, es werden auf irreführende Inhalte verwiesen oder die Navigation oder Buttons sind so angeordnet, dass sie nicht ersichtlich sind.
Auch bei interaktiven Medienproduktion wie Bilder (z.B. Lernlandkarte), interaktiven Videos (z.B. H5P) und Audiodateien ist ein roter Faden Voraussetzung für eine lernfreundliche Bedienung.
D) Vorteile von interaktiven Elementen
Klickbare Elemente wie verknüpfteBilder, Icons, Grafiken, Textelemente, Videos oder Audios fördert die aktive Teilnahme der Nutzer:innen. Sie wechseln von einer passiven Rolle zum bestimmenden Anwender:in.
Eine interaktive Benutzersteuerung ermöglicht den Anwender:innen selbst zu bestimmen, welche Inhalte, in welcher Reihenfolge sie konsumieren möchten. Eine individuelle Navigation bedeutet den Nutzer:innen die Entscheidung zu überlassen, ob und welche Informationen gelesen werden.
Die Anwendung von Animations- und Bewegungseffekten überrascht und erhöht die Aufmerksamkeit. Animierte Interaktionen und spielerische Anwendungen können als ansprechender und unterhaltsamer empfunden werden (z.T. und auch motivierender). Zu viele bewegte Elemente sind jedoch kontraproduktiv.
Animationen bei PowerPoint sind, sofern sie aufbauend und kohärent eingesetzt werden, empfehlenswert. Der Inhalt erscheint nach und nach und die/der Betrachter:in kann gezielt durch komplexe Inhalte geführt werden.
Wenn Inhalte gleichzeitig aus mehreren verschiedenen Medienarten bestehen, sollten folgende Kombinationen vermieden werden: Viel Text und gleichzeitige Sprache (oder Audioaufnahme). Dies führt zu einer kognitiven Überlastung. Deshalb sollte weder bei Präsentationen noch bei (Erklär)Videos etc. Text und Gesprochenes gleichzeitig gezeigt werden.
Hingegen eignen sich auditive und visuelle Medien als Kombination sehr gut. Studien belegen, dass mündliche Informationen leichter erfasst werden können, wenn sie bildlich unterstützt werden.
4. Kohärenzprinzip
Das Kohärenzprinzip besagt, dass unnötige Elemente und Ablenkungen vermieden werden sollen. Visuelle Elemente sollen auf das Wesentliche beschränkt werden. Eine Reduktion an animierten und interaktiven Elementen ist ebenfalls sinnvoll - je weniger bewegte Elemente, desto mehr fallen sie auf. Mehr zum Kohärenzprinzip
5. Signalisierungsprinzip: räumliche und zeitliche Nähe
Die Herausforderung ist, dem/der Anwender:in zu zeigen, worauf er/sie genau achten soll. Die
wichtigen Informationen, die zusammengehören, sollten räumlich und zeitlich nahe präsentiert werden, um Zusammenhänge zu verdeutlichen und diese möglichst leicht erfassen zu können.
Räumliche Nähe bezieht sich auf die geringe räumliche Entfernung zwischen Elementen in einem Layout. Inhalte, die zusammengehören, sollten räumlich als zusammengehörig wahrgenommen werden können.
Zeitliche Nähe bezieht sich auf aufeinanderfolgenden Elemente. Wenn Inhalte in einer zeitlichen Abfolge präsentiert werden (z. B. in einer PowerPoint Präsentation oder einer Diashow), sollten sie so angeordnet sein, dass der Zusammenhang leicht erkennbar wird. Elemente, die zeitlich zusammengehören, sollten also auch zeitlich nahe präsentiert werden. Diese Prinzipien tragen dazu bei, dass visuelle Botschaften klar und verständlich sind, indem sie die kognitive Verarbeitung erleichtern.
Räumliche und zeitliche Nähe anhand des Beispiels Comic.
Bild und Text sind weder räumlich noch zeitlich Nah nebeneinander. Das Erfassen der Information wird so erschwert.
Das Vermeiden von gleicher Information in verschiedenen Darstellungsformen fördert das einfachere Erfassen eines Videos, Präsentation oder interaktiven Elements. Wenn aber zu viele redundante Elemente vorhanden sind, kann dies zu einer kognitiven Überlastung führen. Es besteht die Schwierigkeit das Wesentliche zu erkennen. Wenn redundante Informationen mehrfach rezipiert werden, wird das Gehirn überflüssig stark in Anspruch genommen.
