- YouTube, das 2005 als Idee für eine Video-Dating-Website startete, hat sich heute zu einer Medienplattform entwickelt, die täglich von Milliarden Menschen weltweit besucht wird, um verschiedenste Inhalte anzusehen
- Das ikonische rote YouTube-Logo stand lange Zeit für die Markenidentität, doch kürzlich wurden ein weicheres Rot und ein unerwarteter Magenta-Farbverlauf eingeführt
- Das ist eine kleine, aber bedeutsame Veränderung und ein Beispiel dafür, wie YouTube seine Marke zum 20-jährigen Jubiläum frisch hält
Warum die Veränderung?
- Das interne Art-Direction- und Design-Team von YouTube wollte das seit 20 Jahren verwendete Rot weiterentwickeln
- Bei der Untersuchung, welche bestehenden Elemente nicht mehr zeitgemäß waren, kam das Team zu dem Schluss, dass die Farbe zu den wichtigsten Verbesserungsfeldern gehört
- Die neue Farbe wurde so angepasst, dass sie die Markenidentität bewahrt und zugleich moderner und zugänglicher ist
Probleme mit dem bisherigen Rot
- Das frühere Rot (reines RGB-Rot) stach in der UI zu stark hervor und führte zu Problemen bei der Farbkonsistenz, etwa weil es auf manchen Bildschirmen orange wirkte
- Auf einigen Displays, etwa Fernsehern, verursachte es Burn-in-Effekte, wodurch dauerhafte Spuren auf dem Bildschirm entstehen konnten
- Weil Rot so intensiv ist, wurde darauf hingewiesen, dass es bei falscher Verwendung zu Ermüdung in der User Experience führen kann
Einführung des neuen Rots und des Farbverlaufs
- Das Rot wurde in Richtung eines leicht kühleren Farbtons angepasst, um technische Probleme wie Screen Burn-in und Farbverzerrungen zu verringern
- Unter Wahrung des YouTube-Erbes wurde der Ton mit Blick auf Zugänglichkeit und eine moderne Anmutung weicher und lebendiger gestaltet
- Es wurde eine Strategie festgelegt, Rot nur in den entscheidenden Momenten einzusetzen, in denen YouTubes Kernidentität sichtbar werden soll, um die visuelle Wirkung zu maximieren
- Hinzu kam ein Farbverlauf, der Rot und Magenta verbindet und dem Erscheinungsbild mehr visuelle Lebendigkeit verleiht
- Er wurde neu auf Logo, Produkt-Icons, Fortschrittsbalken (
progress bar), Like-/Subscribe-Buttons, Premium-Badges und Live-Ringen angewendet
Designstrategie und Anwendungsbeispiele
- Mit intensivem Rot nur dann, wenn es nötig ist sollte die Markenidentität erhalten und zugleich Ermüdung bei Nutzern vermieden werden
- In Zusammenarbeit mit verschiedenen Teams wurde ausgelotet, wo sich die neue Farbe und der Farbverlauf einsetzen lassen, und Konsistenz über die gesamte Produktoberfläche hinweg sichergestellt
- In detaillierten Abstimmungen mit Designern, Direktoren und Ingenieuren wurde geprüft, wie der Farbverlauf auf großen Bildschirmen wirkt und ob er die Anforderungen an die Barrierefreiheit erfüllt
- Wichtigen Aktionen wie dem Subscribe- oder Like-Button wurden die Markenfarben zugewiesen, während andere Standardzustände monochrom blieben, um die Informationsvermittlung klar zu halten
Motion Design und Markenidentität
- Da YouTube eine Video-Plattform ist, war es wichtig, mit Motion Aufmerksamkeit zu erzeugen und zugleich funktionale Orientierung zu geben
- Zusammen mit dem Farbupdate wurde in der Startup-Animation ein Effekt ergänzt, bei dem das Logo ein- und auszoomt und der Farbverlauf betont wird
- Der Fortschrittsbalken (
progress bar) wurde schlanker und schneller gestaltet, um ein moderneres Gefühl und visuelle Freude zu vermitteln
- Auch bei Topic-Channel-Icons mit Magenta-Farbverlauf wurden kleine Animationen eingeführt, um Markenkonsistenz und Lebendigkeit zu stärken
- Während bei einer Volltonfarbe nur Formveränderungen möglich sind, lässt sich mit einem Farbverlauf schon durch subtile Bewegung die Atmosphäre steuern
- Damit Nutzer sich durch Motion nicht belastet fühlen, verfolgte YouTube das Prinzip der „richtigen Menge Zucker“ – unterhaltsam, aber nicht übertrieben
Berücksichtigung der Barrierefreiheit
- Um ausreichenden Textkontrast zu gewährleisten, wurden Helligkeit und Ton von Rot und Magenta in mehreren Abstufungen definiert und je nach Größe der UI-Elemente und Einsatzsituation optimal angewendet
- Es wurde darauf geachtet, Informationen nicht allein über Farbe zu vermitteln; wichtige Buttons nutzen die Markenfarbe, während Standardzustände monochrom bleiben
- Für leistungsschwächere Geräte wurde ein adaptives Framework eingeführt, das Motion begrenzt oder deren Intensität je nach Bildschirmgröße anpasst
- Die Bewegung wurde nach Möglichkeit so reduziert, dass die visuelle Belastung gering bleibt, und es wurde so gestaltet, dass Animationen bei Bedarf deaktiviert werden können
Fazit
- Das neue Rot und der Farbverlauf sind zentrale Elemente von YouTubes Markenentwicklung zum 20-jährigen Jubiläum
- Das Ergebnis bewahrt die besondere Kraft von Rot und verbessert zugleich technische, gestalterische und Accessibility-Aspekte
- Durch den passenden Einsatz von Motion und Farbverlauf trägt das Update dazu bei, dass YouTube als Plattform unterhaltsamer und menschlicher wirkt
- Es ist ein Beispiel dafür, wie YouTube sich kontinuierlich verändert und wie Nutzer die Weiterentwicklung der Marke intuitiv wahrnehmen können
2 Kommentare
Als am Ende des Artikels der ganze Bildschirm magentafarben wurde, haben mir richtig die Augen wehgetan..
Ich persönlich hatte bei dem Magenta-Farbverlauf in der Fortschrittsleiste irgendwie das Gefühl, als wäre etwas mit dem Bildschirm nicht in Ordnung. Interessant ist, dass ich dieses Gefühl ausgerechnet auf einem Google Pixel hatte.