Alles, was die den Umsatz eines Unternehmens um 10%-20% steigern kann ist nicht nur unverzichtbar, sondern ein Muss. Für Top-Einzelhändler, deren kombinierter Markenwert 1 Billion Dollar übersteigtbedeutet das nicht nur die Verwendung des richtigen Logos. Jedes Detail an jedem Kundenkontaktpunkt muss die Marke unterstützen und vermitteln.
Wenn Unternehmen ihre Marken überprüfen, ist ein oft übersehenes Element der Online-Video-Player (OVP). Die meisten Unternehmen verwenden heute Videoplayer auf ihren Webseiten und in ihren Anwendungen, aber viele verwenden noch immer keine gebrandeten Player. Vielleicht verwendet das Unternehmen einen kostenlosen Player, oder es wusste einfach nicht, dass sein OVP über Branding-Funktionen verfügt. In jedem Fall untergraben generische Player die Markenkonsistenz und können das Unternehmen möglicherweise Einnahmen kosten.
Wenn Sie sich nicht sicher sind, ob Ihr Anbieter gebrandete Player anbietet, nehmen Sie sich einen Moment Zeit, um die Elemente zu überprüfen, die auf jeder Plattform anpassbar sein sollten.
VIDEO-PLAYER-ELEMENTE MIT MARKENZEICHEN
Die heutigen Online-Videoplayer basieren auf HTML5, d. h. sie können technisch genauso angepasst werden wie jedes andere Webobjekt. Für Branding-Zwecke fallen diese Elemente jedoch im Allgemeinen in die folgenden vier Kategorien.
- Farben. Farbe mag zwar eines der ersten Markenelemente sein, an das wir denken, aber der Videoplayer ist vielleicht einer der letzten Orte, an denen wir sie einsetzen. Alles, von der Wiedergabetaste über die Lautstärkeregelung bis hin zum Fortschrittsbalken, kann an die Farben Ihrer Marke angepasst werden.
- Schriftarten. Abgesehen von Comic Sans denken die meisten von uns wahrscheinlich nie über Typografie nach. Aber selbst wenn wir den Unterschied zwischen Helvetica und Arial nicht erkennen können, würde es uns allen auffallen, wenn das "M" von McDonald's plötzlich in Times New Roman erscheint. Das Gleiche gilt für den Laufzeit- und Hover-Text Ihres Players - eine falsche Schriftart könnte das Markenerlebnis stören.
- Ikonen. Neben den Logos ist die Ikonografie ein weiterer wichtiger Aspekt der visuellen Markenbildung. Einige Marken bevorzugen geschwungene Linien, andere wollen gerade Kanten. Einige wollen zarte Linien, andere fette, schwere Linien. Wie Farben und Schriftarten können auch die Wiedergabetaste, die Lautstärkeregelung und alle anderen Bedienelemente des Players mit verschiedenen Symbolen angepasst werden.
- Bedienelemente. Für einige Marken könnten die Player-Steuerelemente selbst die falsche Botschaft vermitteln. Zu viele Bedienelemente könnten bei einer minimalistischen Marke für Unordnung sorgen, während einige Player-Layouts für Betrachter in anderen Ländern fremd wirken könnten. Deshalb ist es wichtig, dass Sie sowohl die Sichtbarkeit als auch die Position der Steuerelemente Ihres Videoplayers anpassen können.
WIE MAN EINEN VIDEOPLAYER BRANDMARKT
Videoplayer können auf verschiedene Weise an Ihre Marke angepasst werden. Ihr Webentwickler könnte zum Beispiel einige schnelle Inline-Bearbeitungen am CSS der Webseite vornehmen. Dies ist jedoch nicht der beste Ansatz, da diese Änderungen nur für eine Seite und den darauf gehosteten Player gelten würden.
Um Ihre Marken-Videoplayer besser kontrollieren zu können, müssen Sie sie von Ihrer Videoplattform aus verwalten. Dafür gibt es vor allem drei Möglichkeiten.
Branded Player-Elemente |
OOTB-Plattform-Optionen |
Stil-Blätter |
Stylesheets + Skripte |
Farben |
Jede |
Jede |
Jede |
Schriftarten |
Keine |
Jede |
Jede |
Icons |
Begrenzt |
Jede |
Jede |
Steuerelemente (Sichtbarkeit/Platzierung) |
Begrenzt |
Begrenzt |
Jede |
SOFORT EINSATZBEREITE PLATTFORMOPTIONEN
Die besten Videoplattformen für Einzelhändler sollten in ihren Schnittstellen mehrere Optionen zur einfachen Anpassung Ihres Videoplayers bieten. Bei Brightcove können Sie zum Beispiel Folgendes schnell anpassen:
Element |
Farben |
Icon Form |
Kontrolle Position |
Kontrolle der Sichtbarkeit |
Play-Taste |
✔ |
✔ |
✔ |
|
Kontrollleiste |
✔ |
|||
Qualitätsselektor |
✔ |
✔ |
||
Vorwärts-/Rückwärtssuchen |
✔ |
✔ |
||
Wiedergaberate |
✔ |
✔ |
||
Vollbildschirm |
✔ |
✔ |
||
Schieberegler für die Lautstärke |
✔ |
✔ |
||
Daumennagel suchen |
✔ |
|||
Bild-im-Bild-Darstellung |
✔ |
✔ |
||
Soziales Teilen |
✔ |
✔ |
Im Gegensatz zu einigen technischen Lösungen, die voreingestellte Paletten anbieten, können Sie bei den meisten Videoplattformen die Farben mit den Hex-, HSV- oder RGB-Werten Ihrer Marke vollständig anpassen. Allerdings verfügen sie in der Regel nicht über sofort einsetzbare Optionen zur Änderung der Schriftarten ihrer Player.
JSON EDITOR
Einige Plattformen enthalten einen JSON-Editor, mit dem Sie den Playercode direkt bearbeiten können. Dies ist zwar in der Regel die Domäne erfahrener Entwickler, aber es gibt einige einfache Anpassungen, die jeder am Brightcove-Player vornehmen kann. (Wählen Sie im Playermodul von Brightcove einen zu bearbeitenden Player aus, und wählen Sie dann den JSON-Editor).
- Entfernen Sie die Kontrollleiste. Da Einzelhändler den Schwerpunkt auf ihre Produkte und nicht auf das Videoerlebnis legen wollen, möchten sie die Player-Steuerung oft vollständig entfernen. Dies ist besonders wertvoll für Homepage-Player oder andere Seiten, auf denen Sie Schleifenvideos wünschen, die die Aufmerksamkeit auf sich ziehen, ohne vom Kauf abzulenken. Sie müssen nur noch die Eigenschaft hinzufügen,
"control_bar": false
und alle Bedienelemente außer der Wiedergabetaste werden ausgeblendet.
- Gestalten Sie die Wiedergabetaste. Für Marken, die die Reaktion der Wiedergabeschaltfläche ändern möchten, wenn Sie den Mauszeiger darüber bewegen, bietet Brightcove zwei Optionen. Sie können einen Leuchteffekt um die Schaltfläche hinzufügen oder die Schaltfläche verdunkeln. Fügen Sie einfach eines der folgenden Objekte unter dem
play_button
Eigentum:"hover": "glow"
oder"hover": "darken"
.
Anmerkung: Achten Sie beim Hinzufügen von Eigenschaften in JSON darauf, diese und alle vorangehenden Objekte mit einem Komma (,) abzuschließen, es sei denn, es folgt direkt eine geschlossene Klammer (}). Um Wiedergabefehler zu vermeiden, akzeptiert der Editor keinen ungültigen Code und Sie können die Änderungen nicht speichern.
STYLE-BLÄTTER
Die meisten Websites verwenden Cascading Style Sheets (CSS), um Markenstandards festzulegen. Dabei handelt es sich im Wesentlichen um einfache Textdokumente, die einem bestimmten Format folgen, um Farben, Schriftarten und Symbole für alle Elemente auf einer Webseite anzupassen.
Gebrandete Videoplayer können auch über CSS verwaltet werden, insbesondere wenn Sie mehr Anpassungen vornehmen müssen, als die Plattform von Haus aus bietet. Wenn Sie jedoch kein Entwickler sind, sollten Sie sich mit einem solchen beraten, bevor Sie Änderungen vornehmen, da dies Kenntnisse der richtigen Syntax und Werte erfordert.
Zum Erstellen eines CSS-Dokuments benötigen Sie lediglich Notepad für Windows oder TextEdit für Mac.
- Erstellen Sie ein neues Dokument (bei TextEdit wählen Sie Format > Einfachen Text erstellen)
- Fügen Sie Ihre Selektoren, Eigenschaften und Werte hinzu
- Speichern als CSS-Datei (entweder durch Speichern der Datei mit der Erweiterung .css oder durch späteres Ändern des Dateinamens)
Der Brightcove-Player kann mit CSS angepasst werden, indem Sie zum Playermodul navigieren und dann Plugins > Stylesheets auswählen. Sie können Ihre Dokumente hier hochladen, und der Player wird an allen Stellen auf Ihrer Website entsprechend gekennzeichnet. Für diejenigen, die über keine Entwicklerressourcen verfügen, finden Sie im Folgenden einige einfache Anpassungen, die Sie selbst implementieren können.
PLAYER-SCHRIFTARTEN ÄNDERN
Der meiste Text in Videoplayern ist sehr klein (z. B. die Laufzeit, Hover-Text usw.). Nehmen Sie daher Änderungen mit Bedacht vor, und ziehen Sie einen UX-Spezialisten zu Rate, wenn Ihre Markenstandards die Lesbarkeit auf verschiedenen Plattformen nicht berücksichtigen. Um die Schriftarten im gesamten Player zu ändern, erstellen Sie ein CSS-Dokument, das nur die folgenden Angaben enthält:
.video-js {
font-family: ;
}
Nach font-family
und fügen Sie zwischen dem Doppelpunkt (:) und dem Semikolon (;) die Schriftart Ihrer Wahl ein. Denken Sie daran, dass die Browser unterschiedliche Schriftarten unterstützen und dass CSS mit einem Fallback-System ausgestattet ist. Verweisen Sie zumindest auf eine aktuelle Liste von gängige Web-Schriftartenund kopieren Sie die gewünschte Schriftart in die Anzeige. Wenn Sie zum Beispiel wirklich Comic Sans wollen, würde Ihr CSS-Dokument wie folgt aussehen:
.video-js {
font-family: Comic Sans MS, Comic Sans, cursive;
}
Die Standardbibliothek mit Schriftfamilien ist begrenzt, daher müssen Sie eine Klasse oder eine Quell-URL in das CSS-Dokument für benutzerdefinierte Schriftarten einfügen. Wenden Sie sich an Ihren Webentwickler, um sicherzustellen, dass Sie die Schriftart Ihrer Marke richtig referenzieren.
ALLE KONTROLLEN ENTFERNEN
Für Einzelhändler, die Web-Header-Player für Produktvideos in Endlosschleife erstellen möchten, reicht es nicht aus, die Kontroll- und Fortschrittsbalken zu entfernen. Sie wollen alles entfernen, auch die große Abspielschaltfläche. Dazu benötigen Sie nur ein weiteres einfaches CSS-Dokument.
.video-js .vjs-big-play-button {
display: none;
}
.video-js .vjs-control-bar {
display: none;
}
Vergewissern Sie sich außerdem, dass "Titel und Beschreibung anzeigen" auf der Registerkarte "Gestaltung" Ihres Players nicht ausgewählt ist. Andernfalls werden beide standardmäßig oben in Ihrem Player angezeigt.
SCHRIFTEN
Das Ändern von Farben und Schriftarten für Marken-Videoplayer ist relativ einfach, da Sie die vorhandenen Attribute bearbeiten und nicht deren Funktion ändern oder neue hinzufügen. Um das Layout eines Videoplayers vollständig zu ändern, müssen Sie Skripts verwenden.
Während die Erstellung von CSS-Dokumenten relativ einfach sein kann, ist Javascript nicht etwas, das Sie ohne Entwicklungserfahrung oder Unterstützung manipulieren können. Wenn Sie über die entsprechenden internen Ressourcen verfügen, lesen Sie unsere Support-Dokumentation zur Player-Anpassung um loszulegen. Sie können auch eine Verbindung zu unseren Brightcove Global Services Team für direkten Support kontaktieren.