Dark Themes

Das kleine Schwarze ist nicht nur in der Modebranche schick und zeitlos. Auch das UX-/ UI-Design kann von einem Hauch Eleganz und Luxus profitieren. Auf das Interface bezogen, gewinnt dieses durch den Einsatz dunkler Farbspektren einen einzigartigen und starken Look, der bestenfalls durch aussagekräftige Bilder unterstützt wird.

Darüber hinaus erwecken gedeckte Farben aber auch das Gefühl der Nacht. Nicht umsonst greifen viele Anbieter aus dem Entertainment-Bereich auf eine solche Gestaltungsform zurück. Meist aus einer gewissen Distanz und im gedimmten Licht aufgenommen, passt sich so der Screen der Streaming-Plattform Netflix direkt der Umgebung an. Starke Kontraste in Helligkeit und Farbe werden vermieden und dem User wird signalisiert: jetzt lässt es sich entspannen.

Um die Augen beim nächsten Serienmarathon nicht zu belasten, greift auch Netflix auf dunkle Designs zurück

Bei dem einen Produkt matcht der dunkle Hintergrund ideal mit der Anwendung, bei dem anderen wirkt die Farbwahl eher aufgezwungen und aufdringlich. Zu wem passen also düstere Design und wer sollte lieber die Finger von solchen Patterns lassen?

Wann machen Dark Themes Sinn?

Designer*Innen, die sich aktiv für die dunkle Seite des UX / UI entscheiden, sollten selbstverständlich die ein oder andere Anforderung berücksichtigen, um mit ihrer gestalterischen Umsetzung nicht anzuecken oder den Produktcharakter zu verfälschen.

Wie bereits erwähnt, sollte der Markencharakter natürlich mit dem Interface übereinstimmten; was nicht heißt, dass Dark Theme Patterns ausschließlich zu Berliner Techno Labels und Escape Rooms passen. Vielmehr eignen sie sich besonders für minimalistische Anwendungen mit eher wenig Content. Das Design entwickelt sich dabei als eigenständiges Element in Sachen Emotionen und kann die User Experience in Richtung einer nachhaltigen Kundenbindung unterstützen.

Wann machen Dark Themes keinen Sinn?

Anwendungen hingegen, die ihren Nutzern sehr viel Content zur Verfügung stellen, sollten eher auf hellere Themes zurückgreifen. An dieser Stelle ist die Gefahr einer Überanstrengung der Augen durch die starke Kontrastierung von höchstwahrscheinlich weißem Text und dunklem Hintergrund einfach zu groß.

Für den Fall, dass das Corporate Design bereits vor dem Interface entwickelt wurde, hat dieses natürlich oberste Priorität. Wird so eine eher breite Farbpalette vorgegeben, ist es natürlich auch notwendig, die finale Anwendung diesen Anforderungen entsprechend zu gestalten.

Tipps

Zu den grundlegenden Gestaltungsmerkmalen zählen bei Dark Themes natürlich dunkle, gesättigte Farben und eine durchdachte Komposition des Contents. Was es dabei zu beachten gilt, lässt sich mit fünf einfachen Tipps zusammenfassen:

  • So schön ein sattes Tiefschwarz auch sein kann – eine zu hohe Kontrastierung führt zu einer Überanstrengung der Augen. Besser eignet sich ein dunkler Grauton als Hintergrundfarbe.
  • Und auch bei der Gestaltung des Contents ist in puncto Sättigung Vorsicht geboten. Die Lesbarkeit von Texten wird so nur unnötig erschwert und das Design wirkt schnell aufdringlich.
  • Schwarz auf Weiß ist bei der Gestaltung von Dark Themes nicht immer die beste Option. Tools wie Adobe Color können bei der Auswahl adäquater Farbspektren eine große Hilfe sein.
  • Abgesehen von der Farbwahl sollte auch die Hierarchie der Elemente möglichst einfach nachvollziehbar sein, da die Visualisierung vor einem dunklen Hintergrund möglicherweise Orientierungsprobleme verursachen könnte.
  • Weil Dark Themes nicht zwingend der bekannten Interface-Norm entsprechen, sollte dem Nutzer immer die Möglichkeit gegeben werden, zwischen dem Dark Mode und einer „standardisierten“ Ansicht zu wechseln.
Wie in der Fotografie unterstützen die richtigen Kontraste den ausdrucksstarken Charakter des Contents

Fazit

Die Umsetzung einer dunkel gehaltenen Benutzeroberfläche erfordert immer ein wenig Mut – dieser zahlt sich aber durch den Faktor Einzigartigkeit aus. Nichtsdestotrotz lohnt es sich immer, vor dem Launch einer Anwendung User Tests durchzuführen und somit sicherzustellen, dass das gewählte Design auch mit dem ästhetischen Bewusstsein der User übereinstimmt.