Video Transkript
Erfahrung der Benutzer Teil 2
7m 54s
0:08
Sobald du ein Verständnis und einen Überblich über das hast, was der User mit deinem UCI machen
0:12
soll oder darf, musst du die richtigen Buttons dazu einfügen, damit er das überhaupt machen kann.
0:18
Aber wirf bitte nicht einfach alle Buttons irgendwie zufällig auf den Bildschirm. Es gibt eine Menge
0:23
Designprinzipien, die du im Hinterkopf behalten sollst, bevor du mit dem Layout jeder einzelnen
0:28
UCI Seite beginnst. Und nochmals, manche dieser Sachen mögen dem Einen schon bekannt
0:34
vorkommen, werden aber gerne beim Designen von UCIs übersehen.
0:39
Starte damit, über die grundlegende Psychologie des Users nachzudenken. In den meisten
0:44
westlichen Ländern liest man von oben nach unten und von links nach rechts. Das heißt, dass wir
0:49
instinktiv wichtigere Sachen weiter links oder weiter oben platzieren.
0:53
Wenn du beispielsweise Page Navigation Buttons verwendest, sollten die wichtigsten Seiten
0:58
entweder links oder oben sein. Alle anderen erst danach.
1:02
Aus der gleichen Psychologie folgt, dass wenn wir mit etwas fertig sind, am rechten unteren Bildrand
1:07
ankommen. Das ist ein guter Platz für einen „next“ oder „weiter“ Button.
1:12
Natürlich sind das keine Regeln – du kannst ein Layout machen, wie du willst, aber wenn es
1:17
entgegen der Logik der User designt ist, müssen diese jedes Mal drüber nachdenken und
1:22
probieren. Wahrscheinlich ist das Wichtigste Einheitlichkeit.
1:27
Nachdem du dich für eine Navigationsmethode entschieden hast, solltest du diese im kompletten
1:31
UCI durchziehen. Du willst auf keinen Fall ein horizontales Menü auf einer Seite haben und ein
1:36
vertikales auf einer anderen. Oder, wenn sich die Größe oder Reihenfolge der Seiten immer ändert.
1:42
Einheitlichkeit in deinem Design gibt dem User die beste Chance erfolgreich durch dein UCI zu
1:47
navigieren. Es gibt auch verschiedene Wege, wichtige Dinge hervorzuheben.
1:51
Stellen wir uns nochmals den Audioplayer vor. Es gibt eine Menge Buttons, die man drücken kann,
1:56
aber der Start-Knopf ist wahrscheinlich der wichtigste. Die Größe und wo der Button platziert wird,
2:02
hilft dem User herauszufinden, dass dies die wichtigste Funktion auf dieser Seite ist.
2:06
Du kannst auch einen Abstand verwenden, um die Wichtigkeit hervorzuheben.
2:10
In diesem Beispiel ist der Start-Knopf gleich groß wie alle anderen. Aber, weil wir einen weißen
2:14
Rahmen um ihn verwenden, wird uns signalisiert, dass er wichtiger als die anderen ist.
2:19
Viele Designer haben Angst davor, etwas Abstand einzufügen, weil sie denken, sie müssen die
2:23
Seite möglichst füllen. Aber etwas Leerraum kann oft sehr hilfreich sein.
2:27
Es teilt Objekte, die nicht zusammengehören und zeigt die Wichtigkeit anderer. Und, es hilft dabei,
2:33
das Design simpel und verständlich wirken zu lassen.
2:35
Aber noch einmal, Einheitlichkeit im Style ist wichtig.
2:39
Wenn du dem User beibringst, dass ein wichtiger Button so aussieht, sollte das für andere Buttons
2:43
auf anderen Seiten auch gelten.
2:46
Ein weiteres Werkzeug in unserer Palette ist die Farbe.
2:49
Farbe ist nicht nur dafür da, um Sachen hübsch zu machen. Farbe kann auch verschiedene Gefühle
2:54
und Emotionen kommunizieren.
2:56
Beispielsweise wird oft rote Farbe mit extrem wichtigen Emotionen, wie Panik und Gefahr oder
3:01
einem Not-Aus assoziiert.
3:04
Grün, auf der anderen Seite ist ruhiger und wird oft mit Start verbunden.
3:09
Die verschiedenen Farben von Buttons geben dem User einen sofortigen Eindruck,
3:13
was der Button macht – .
3:17
Das heißt auch, dass wenn dein UCI komplettes rot ist, stresst du den User immens.
3:22
Es gibt sogar eine Menge Studien, die sich mit Farben befassen. Aber das sind zu viele, um sie hier
3:27
im Video unterbringen zu können.
3:29
Aber wenn du an den grundlegenden Farbkreis denkst, gibt es einen einfachen Weg, Farben zu
3:33
finden, die zusammen gut ausschauen.
3:36
Komplementärfarben sind Farben, die immer an den gegenüberliegenden Seiten am Farbkreis liegen.
3:41
Das sind Kombinationen, wie rot und grün, violett und gelb oder blau und orange.
3:46
Komplementärfarben sind toll, weil sie zueinander den größtmöglichen Kontrast haben, was eine
3:50
tolle Möglichkeit ist, unterschiedliches hervorzuheben.
3:54
Aber wenn man diese Komplementärfarben zu häufig verwendet, kann das Ergebnis schrill wirken
3:58
und der Enduser wird sich unwohl fühlen.
4:00
Andere Farbvorlagen verwenden beispielsweise semi-komplementäre Farben.
4:05
Es ist auch wichtig, im Hinterkopf zu behalten, was der Unterschied zwischen warmen und kalten
4:10
Farben ist und welchen Einfluss er auf den User hat.
4:13
Wenn du an Farben im Design denkst, musst du natürlich auch die offiziellen Farben deines
4:17
Auftraggebers berücksichtigen. Wenn deren Logo kornblumenblau ist, wirst du wahrscheinlich
4:22
kornblumenblau als Hauptfarbe im UCI verwenden.
4:25
Größere Firmen haben oft Stil Guidelines, welche spezifizieren, welche Farbe wie mit ihrem Logo
4:30
verwendet werden darf. Das solltest du natürlich beachten, bevor du deren Logo versehentlich
4:35
mit den Farben ihrer Konkurrenz vermischst.
4:38
Aber natürlich sollst du dich nicht komplett nur auf Farben verlassen. Berücksichtige, dass viele
4:42
Leute farbenblind sind und die willst du natürlich nicht im Regen stehen lassen.
4:47
Es gibt sogar einige kostenfreie Farbenblind-Simulatoren im Internet, wo man einen Screenshot des
4:52
UCIs raufladen und dann wie farbenblinde anschauen kann.
4:58
Farben sind also wichtig, sollten aber nicht das einzige Werkzeug sein, das verwendet wird. Mit
5:02
dieser Erkenntnis sollten wir auch beachten, dass verschiedene Menschen unterschiedlich lernen.
5:08
Manche lernen am besten durch lesen, andere durch Bilder und wieder andere durch räumliche
5:13
Assoziationen. Wenn du also die Möglichkeit hast, dies in deinem Design zu berücksichtigen, ist
5:18
es sicher den Aufwand wert, wenn du dich mit diesem Thema etwas mehr befasst.
5:22
In Q-SYS können Icons und Beschriftungen zu jedem Button hinzugefügt werden, was eine gute
5:27
Möglichkeit bietet, gleich zwei verschiedene Lerntypen auf einmal zu erreichen.
5:31
Es gibt einen weiteren extrem wichtigen Punkt, wenn es um das Bauen des UCIs geht: Rückmeldung.
5:37
Aber um Himmelswillen, bitte keine akustische Rückmeldung. Ich denke da eher an eine visuelle
5:42
Rückmeldung, die der Bildschirm gibt, um deine Eingabe zu bestätigen. Manche Rückmeldungen
5:48
sind offensichtlich: zum Beispiel, wenn du einen
5:51
Navigation Button anklickst, wird die neue Seite angezeigt.
5:54
Viele Buttons stellen eine Rückmeldung schon von Haus aus zur Verfügung – zum Beispiel ändert ein
5:59
Toggle Button seine Farbe, wenn er gedrückt wird. Ein Start oder Play Button leuchtet solange,
6:04
wie der Audioplayer spielt. Aber manche Buttons geben dem User eventuell nicht das Feedback,
6:09
das sie erwarten.
6:10
Wenn du beispielsweise nur einfache “lauter” und “leiser” Buttons zur Verfügung stellst, weiß der
6:14
User irgendwann nicht mehr, wo auf welcher Gain Stufe er derzeit umgeht. Eine Anzeige hierzu gäbe
6:19
Rückmeldung.
6:22
Wenn der User einen Snapshot lädt, der Änderungen im Hintergrund oder auf einer anderen
6:26
Seite hervorruft, solltest du dem Benutzer irgendeinen Indikator geben,
6:30
damit er weiß, dass der neue Snapshot geladen wurde.
6:34
Jeden visuellen Hinweis, den du dem User geben kannst, dass seine Änderungen erfolgreich waren,
6:38
stärkt sein Selbstvertrauen im Umgang mit dem System.
6:41
Abschließend – vergiss nicht, dein UCI zu testen! Aber nicht nur du – frage andere Leute, ob sie es für
6:47
dich testen können, damit du ein Gefühl bekommst wie intuitiv es ist. Wahrscheinlich kannst du eine
6:53
Menge lernen, wenn du anderen Leute zusiehst, wenn sie sich in der Bedienung schwer tun, oder wo
6:58
sie hin navigieren, um gewisse Funktionen zu suchen.
7:01
Lerne von ihnen anstatt ihnen zu lernen, wie das System zu bedienen ist. Gib ihnen eine Aufgabe und
7:06
schaue, ob sie in der Lage sind, diese selbständig zu erfüllen. Falls nicht, ist das ein Zeichen, dass du
7:12
eventuell nochmals etwas Zeit in dein Design investieren sollst.
7:15
Verliebe dich also nicht zu früh in dein eigenes Design. Nur weil es dir gefällt, heißt das noch lange
7:20
nicht, dass es auch für jemand anders brauchbar ist. Und wenn du einen Grafikdesigner beauftragst,
7:25
der zusätzlich etwas Flair in dein UCI bringen soll, stelle sicher, dass dein UCI vorher komplett
7:31
getestet und voll funktionsfähig ist, bevor Grafiken designt werden, die dann schwer zu tauschen sind.
7:37
Hoffentlich gibt euch das eine gute Basis an Dingen, die ihr im Hinterkopf behalten sollt, wenn ihr
7:42
eure UCIs designt. Eure ganze Arbeit kann umsonst sein, wenn der Endkunde nicht weiß, wie das
7:47
System zu bedienen ist. Vielen Dank fürs Zusehen!
Lektion Beschreibung
Erfahrung der Benutzer Teil 2
7m 54s
Coming soon!
Hilfreiche Tipps und Definitionen
Erfahrung der Benutzer Teil 2
7m 54s
Coming soon!
Downloads und Links
Erfahrung der Benutzer Teil 2
7m 54s