Design Guide
Reiter
Design guide
Viele zeitgemässe digitale Plattformen setzen auf frische und kontrastreiche Farben, ebenfalls sorgen diese mit einer harmonischen Aufteilung von Bild und Text für Klarheit und Struktur.
ILIAS, das Learning Management System der Uni Bern, sollen ebenfalls alle User aktiv abgeholt und mit einer eigenen Designlogik zielführend unterstützt werden. Vielleicht wissen Sie schon genau, was Sie machen möchten? Oder Sie möchten sich erst einmal einen Überblick über die Vorteile der neuen Gestaltung und Anordnung von Elementen verschaffen?
ILIAS, das Learning Management System der Uni Bern, sollen ebenfalls alle User aktiv abgeholt und mit einer eigenen Designlogik zielführend unterstützt werden. Vielleicht wissen Sie schon genau, was Sie machen möchten? Oder Sie möchten sich erst einmal einen Überblick über die Vorteile der neuen Gestaltung und Anordnung von Elementen verschaffen?
Mit diesem DESIGN GUIDE können Sie einen direkten Einstieg in die Gestaltung des neuen ILIAS 8 wagen.
Einen ersten Einblick erhalten Sie bereits auf dieser Seite. Weitere sehr hilfreiche Inhalte werden demnächst freigeschaltet und Sie direkt in ihrem Vorhaben unterstützen. Starten Sie gleich mit dem Speichern dieser Seite als Favorit und bleiben Sie gespannt!
ILIAS 8 Anleitung

PREVIEW: Kursbeispiel in ILIAS 8 · · · Einführungstext mit Modulkacheln und Materialliste
Prinzipien
Setze Inhalte
ins Zentrum
Der Fokus einer Person soll auf dem Inhalt sein, nicht auf der Bedienung des Systems.
Helfe Nutzenden ohne grosse Ablenkung zu arbeiten und zum Ziel zu kommen. Stelle Möglichkeiten zur Verfügung, um Inhalte ins Zentrum zu rücken, ohne selber aufdringlich zu sein und vom Inhalt abzulenken.
Helfe Nutzenden ohne grosse Ablenkung zu arbeiten und zum Ziel zu kommen. Stelle Möglichkeiten zur Verfügung, um Inhalte ins Zentrum zu rücken, ohne selber aufdringlich zu sein und vom Inhalt abzulenken.
Design-Prinzipien sind
ein Set an Überlegungen, welche die Basis für ein gutes Design bilden.
Sie helfen Entscheidungen zu treffen, die für das visuelle Design und die Interaktionen wegweisend sind.
Sie unterstützen dabei, Werte auf sinnhafte Weise zu erleben und weiterzutragen.
Definiere Schwerpunkte
Die Aufmerksamkeit einer Person soll sinnvoll gelenkt werden, damit sie sich effektiv mit etwas auseinandersetzen kann.
Um die Aufmerksamkeit zu erlangen, biete starke Farben und grosse Schriften. Vermeide Unordnung und überladene Ansichten. Berücksichtige unterschiedliche Wahrnehmungen: Guter Farbkontrast hilft Text trotz verschiedenen Hintergründen gut lesbar zu halten. Farbe wird verwendet, um Dinge darzustellen, die zusammengehören bzw. um Dinge voneinander klarer abzugrenzen.
Um die Aufmerksamkeit zu erlangen, biete starke Farben und grosse Schriften. Vermeide Unordnung und überladene Ansichten. Berücksichtige unterschiedliche Wahrnehmungen: Guter Farbkontrast hilft Text trotz verschiedenen Hintergründen gut lesbar zu halten. Farbe wird verwendet, um Dinge darzustellen, die zusammengehören bzw. um Dinge voneinander klarer abzugrenzen.
Sei konsequent
Einheitliche Benutzeroberflächen hilft der Person, ein besseres Verständnis für die Sturktur und das Funktionieren zu erhalten.
Was gleiches bedeutet, soll gleich dargestellt werden. Stelle Möglichkeiten und Funktionen bereit, bei denen klar ist, wie sie eingesetzt werden können, damit Nutzende diese konsequent umsetzen. Wiederholungen sind hilfreich.
Was gleiches bedeutet, soll gleich dargestellt werden. Stelle Möglichkeiten und Funktionen bereit, bei denen klar ist, wie sie eingesetzt werden können, damit Nutzende diese konsequent umsetzen. Wiederholungen sind hilfreich.
Sorge für Klarheit
Je grösser die Anzahl und Komplexität der Auswahlmöglichkeiten ist, desto mehr Zeit benötigt die Person, um eine Entscheidung zu treffen.
Zeige Nutzenden eine minimierte Anzahl an Auswahlmöglichkeiten, ohne sie zu überwältigen. Biete wenige Auswahlmöglichkeiten an, die sich aber gut miteinander kombinieren lassen.
Zeige Nutzenden eine minimierte Anzahl an Auswahlmöglichkeiten, ohne sie zu überwältigen. Biete wenige Auswahlmöglichkeiten an, die sich aber gut miteinander kombinieren lassen.
Befähige alle
Eine Person, unabhängig von ihrer Disziplin, ihrem Alter, ihrem Qualifikationsniveau oder ihren Einschränkungen, soll mit der Benutzeroberfläche arbeiten können.
Ermögliche so vielen Nutzenden wie möglich, die bereitgestellten Inhalte zu nutzen und die dargestellten Inhalte zu verstehen.
Ermögliche so vielen Nutzenden wie möglich, die bereitgestellten Inhalte zu nutzen und die dargestellten Inhalte zu verstehen.
Für IHR Vorhaben
1
Strukturieren
Vorhaben strukturieren – Studierende informieren
Warum strukturieren
Der Bereich „Strukturieren“ berichtet, in einem gut sortierten Seitenaufbau, über ihr Vorhaben. Ihre Studierende sehen wann welche Präsenzveranstaltung stattfindet, welche Aufgaben in einer asynchronen Veranstaltung auf sie zukommen oder in welchem Thema Gruppenarbeiten vorgesehen sind. Mit einer „visuellen Struktur“ ermöglichen sie nicht nur eine abrufbare Informationsseite, sondern sie reduzieren dadurch ihre administrativen Tätigkeiten.
Direkt strukturieren
Komprimieren sie grosse Textmengen in lesbare Textabschnitte.
- Nutzen sie 1-2 Sätze als Einleitung für längere Textabschnitte, diese sorgen beim Scrollen für eine verständliche Sortierung.
Priorisieren sie mit klar formulierten Überschriften ihr Vorhaben.
- Gut benannte Akkordeons, in 2-3 Spaltenlayouts, werden schneller erfasst und fokussiert.
· · Tipp · ·
Gut abgeholte Studierende sind zufriedener und können sich mehr auf ihre Inhalte konzentrieren.
2
Vorbereiten
Vorher informieren – Administration reduzieren
Warum vorbereiten
Der Bereich „Vorbereiten“ berichtet über ihr eigenes Vorhaben und stattet ihre Studierende mit den wichtigsten Informationen aus. Gleichzeitig soll dieser Bereich sie selbst administrativ unterstützen. Je mehr sie hier platzieren und ihre Studierende abholen, um so weniger werden sie Fragen zur Veranstaltung, Prüfung, Termine etc. beantworten.
Jetzt vorbereiten
Verwenden sie kurze und knackige Beschreibungen.
- Auflistungspunkte können dabei helfen und sorgen gleichzeitig für eine schnelle Lesbarkeit
Trennen sie sichtbar Aufgaben und Lehrveranstaltungsinhalte voneinander.
- Eine grafische Unterscheidung unterstützt in der Adressierung von Inhalten, verwenden sie bspw. Icons oder Farben in der Kachel.
· · Tipp · ·
Gut informierte Studierende sind motivierter und bereiten sich besser auf ihre Lehrveranstaltung vor.
3
Aktivieren
Klar anweisen – zur Handlung auffordern
Warum aktivieren
Der Bereich „Aktivieren“ unterstützt Sie in der Zusammenstellung Ihrer konkreten Inhalte. Ihre Studierenden bekommen einen guten Einblick in die bevorstehenden Aufgaben und werden gleichzeitig motiviert eigentverantwortlich alles durchzuarbeiten. Visuell aktivierende ILIAS-Kursräume führen und inspirieren die Studierenden ohne zusätzlichen Aufwand, wie bspw. an terminierte Abgaben zu erinnern oder prüfungsrelevante Vorbereitung einzuplanen.
Sofort aktivieren
Ich bin ein Tipp für die Anregeung/Motivation (Inspiration, Emotionen).
- Ich bin eine Blindtext, das dur ch das Original ersetzt wird.
Ich bin ein Tipp für die Handlung > Aktion/Aufgabe (Material, Folien, Button, Link).
- Ich bin eine Blindtext, das dur ch das Original ersetzt wird.
Ich bin ein Tipp für die Vertiefung > Info/Hinweise (Linksammlung, ...)
- Ich bin eine Blindtext, das dur ch das Original ersetzt wird.
· · Tipp · ·
Gut beauftrage Studierende sind aktiver und neugierig auf das Feedback was von ihnen kommt.
Demokurs & Konsorten

Für Ihr Vorhaben · · · COMING SOON
VERWENDUNG
in Arbeit
Dieser Bereich unterstützt Sie direkt in ihren Lehrinhalten und in ihrem Vorhaben.
Layout
in Arbeit
Dieser Bereich erklärt Ihnen die einzelnen Seitenelemente und deren Bedeutung.
Prinzipien
Dieser Bereich informiert Sie über die Design Prinzipien von ILIAS 8.