Zum Inhalt

Das gefällt.

Social Media

Was das Design für Social Media angeht, verhält es sich großteils wie im echten Leben. Die meisten Gestaltungsvorgaben, die offline gelten, werden auch online weitergetragen. 

Profilbild/Logo Kopieren Sie den Link zu diesem Element

Dies ist einer der wenigen Fälle, in denen die Flagge aus dem Logo herausgelöst und alleine verwendet wird. Auch der Safe Space weicht – aufgrund des außerordentlich kleinen Formats – von den Regeln ab und ist für diesen Sonderfall separat definiert.

 

Branded Hashtag
Zusätzlich zu dem Branded Hashtag #feelaustria soll auch der Hashtag #lebensgefühl eingesetzt werden. Das Lebensgefühl soll als Synonym für Österreich stehen und soll daher auch laufend über die Social Media Postings bzw. den Content generell transportiert werden und etabliert werden.

Auf Instagram, Facebook, YouTube und Pinterest ist es möglich den Hashtag mit Umlaut zu verwenden: #lebensgefühl
Auf TikTok ist es aktuell nur möglich den Hashtag so zu verwenden: #lebensgefuehl

Farbwelt Kopieren Sie den Link zu diesem Element

Aus dem analogen Leben gegriffen – beziehungsweise aus dessen Design System – werden ebenso die Farbdefinitionen. Allerdings beschränken sich die primären Farben auf Weiß und Rot. Schwarz kommt auf Social Media nicht zum Einsatz. Kommt es zu den sekundären Farben, kann dagegen aus dem Vollen geschöpft werden.

Gesamte Farbwelt erkunden

Pantone: White
C: 0 M: 0 Y: 0 K: 0
R: 255 G: 255 B: 255
HEX: #ffffff

  • Hintergrund
  • Headlines
  • Sublines
  • Fließtexte (Social Media)

Pantone: 485C
C: 0 M: 100 Y: 100 K: 0
R: 220 G: 0 B: 0
HEX: #dc0000

  • Logo-Flagge
  • Vibe
  • Headlines
  • Sublines
  • CTA-Buttons (Banner)

P̶a̶n̶t̶o̶n̶e̶:̶ ̶B̶l̶a̶c̶k̶ ̶
C̶:̶ ̶4̶0̶ ̶M̶:̶ ̶4̶0̶ ̶Y̶:̶ ̶4̶0̶ ̶K̶:̶ ̶1̶0̶0̶ ̶
R̶:̶ ̶0̶ ̶G̶:̶ ̶0̶ ̶B̶:̶ ̶0̶ ̶
H̶E̶X̶:̶ ̶#̶0̶0̶0̶0̶0̶0̶

Schwarz kommt auf Social Media nie vor

  • Z̶w̶i̶s̶c̶h̶e̶n̶h̶e̶a̶d̶l̶i̶n̶e̶s̶
  • F̶l̶i̶e̶ß̶t̶e̶x̶t̶e̶ ̶(̶E̶d̶i̶t̶o̶r̶i̶a̶l̶)̶
  • U̶R̶L̶
  • Karten
  • Infografiken
  • Editorial Illustrationen
  • farbige Textboxen für Social Media (nur Farbversionen 4 und 5)
  • GIFs (Social Media)

In Standard-Werbemitteln finden diese Farben keine Verwendung.

Schriften Kopieren Sie den Link zu diesem Element

Online haben die gleichen Schriftfamilien das Sagen wie offline. In lateinischen Sprachen ist auch hier die Alaska hierarchisch höhergestellt, darunter unterstützt die Nunito. In anderen Sprachen verschieben sich die schriftlichen Machtverhältnisse.

Gesamte Typographie erkunden

Alaska Contrast Medium

  • Headline

Alaska Medium

  • Subline
  • Headline in Textbox (Social Media)
  • Headline ohne Textbox (Social Media)
  • Fließtexte (Social Media)
     

Alaska Regular

  • Untertitel

Nunito Sans Regular

  • Bildcredits

Schriftfamilien Hierachien

Zahlen
Bei Carousels gibt es manchmal eine Aufzählung. Diese Zahlen sind der einzige Einsatz von Alaska Bold. Der Bold-Schnitt wird nie für ganze Wörter oder Sätze verwendet. Einzelne Zahlen sind die einzige Ausnahme!

Vibe Kopieren Sie den Link zu diesem Element

Auch auf den sozialen Medien setzt sich der Vibe fort. Wann, wo und wie genau, ist bereits vordefiniert.

Gesamten Vibe erkunden

Illustrationen Kopieren Sie den Link zu diesem Element

Um Inserts oder bildliche Inhalte zu verstärken, können Illustrationen eingesetzt werden. Dabei gilt es allerdings sparsam umzugehen, um Auge und Aufmerksamkeit der Betrachtenden nicht zu überfordern.

Gesamte Illustrationen erkunden

Partner Integration Kopieren Sie den Link zu diesem Element

Für die Einbindung von Partnern auf Social Media-Werbemitteln gibt es unterschiedliche Richtlinien, um ein harmonisches Gesamtbild zu erzielen.

Link Posting - Externe Ausspielung Kopieren Sie den Link zu diesem Element

Diese Vorlage wird für die externe Ausspielung verwendet. Das Logo kann mit schwarzer, aber auch mit weißer Schrift verwenden werden.

Motion Kopieren Sie den Link zu diesem Element

Grundsätzlich gelten für Social Media die gleichen Regeln wie für alle Bewegtbilder, es gibt aber noch ein paar Besonderheiten, die es zu beachten gilt.

Gesamtes Motion Design erkunden

Cornerbug Kopieren Sie den Link zu diesem Element

  • Bei reinen 16:9 YouTube Content-Videos ist kein Cornerbug nötig.
  • Für 9:16-Social-Media-Videoformate wird ebenfalls kein Cornerbug stehen bleiben, weil es entweder beschnitten oder vom Interface gestört wird. Für diese Fälle empfehlen wir die Vibe-Animation.
  • Im Social-Media-Bereich gibt es ohnehin immer einen Cornerbug: nämlich das Profilbild. Somit ist bei ausgespielten Ads das Profilbild der Cornerbug.

Textinserts Kopieren Sie den Link zu diesem Element

Je nach Hintergrund können Inserts weiß oder rot gesetzt werden. Bei der Platzierung kann man sich gerne von den verschiedenen Möglichkeiten der 16:9-Version inspirieren lassen. Die Textgröße ist frei wählbar und sollte an das jeweilige Werbemittel angepasst werden und gut lesbar sein.

Die Rasterspalten müssen in Social-Media-Videos nicht berücksichtigt werden. Der Safe Space muss natürlich dennoch bedacht werden – 250 px zum oberen und unteren Bildrand.

Untertitel Kopieren Sie den Link zu diesem Element

Untertitel können sowohl über Canva oder Adobe Programme, als auch direkt in der jeweiligen App z.B. YouTube, Instagram oder TikTok hinzugefügt werden.
Instagram oder Tiktok haben verschiedene Layouts für ihre Untertitel zur Verfügung. Wir verwenden immer dieselben Einstellungen, um eine Durchgängigkeit zu gewährleisten.
Bitte immer drüberschauen, damit sich keine Fehler einschleichen.

Bei YouTube gibt es mehrere Möglichkeiten wie Untertitel hinzugefügt werden können: selbst schreiben, SRT-Datei, transkribieren, oder automatisch.

Bei Instagram nur diese Schriftart verwenden. Entweder rot oder weiß. Hinterlegungen werden nie verwendet.

Bei TikTok nur die Classic Schriftart verwenden. Bevorzugt in weiß. Sollte das die Lesbarkeit behindern, kann eine graue Hinterlegung verwendet werden.

Die Untertitel können alleine in Weiß stehen. Sollte das die Lesbarkeit behindern, kann eine graue
Hinterlegung (Abstufung 5) in halbtransparent verwendet werden. Als Schriftgröße wird 33pt bzw. 44 px verwendet.

Meta (FB & IG) Kopieren Sie den Link zu diesem Element

Textbox und Bildcredits Kopieren Sie den Link zu diesem Element

Es gibt einen Rahmen (hier grau eingezeichnet). Text steht in Textboxen, die sich an diesem Rahmen ausrichten und nie darüber hinaus stehen. Die Bildcredits stehen außerhalb dieses Rahmens.

Bildcredits können in allen 4 Ecken platziert sein. Vorzugsweise nicht in der Ecke, in der die Headline platziert ist.

Textboxen dürfen überall entlang des safe spaces flexibel positioniert werden. Textboxen kommen immer in Kombination mit dem Vibe vor. Entweder die erste oder letzte Zeile ist leer. Dort ist Platz, damit sich die Box mit dem Vibe überschneiden kann. Die Breite der Box richtet sich nach der Textlänge bzw. nach den Umbruch Möglichkeiten.

 

Carousel Kopieren Sie den Link zu diesem Element

Bei Carousels gibt es einen Vibe, der sich durchzieht. Dazwischen verschwindet er immer wieder und taucht wieder auf. Die Vibe Stärke ist immer gleich dick.

  • Falls das 1. Bild ruhig genug ist, kann die Headline auch ohne Hintergrund platziert werden.
     
  • Die Headline ist je nach Lesbarkeit weiß oder rot.
     
  • Die Farbe der Schriftbox wird danach abgestimmt, welche Farben im Bild vorherrschend sind.

 

  • Sollte der Carouseltext sehr kurz sein (z.B. Ortsbezeichnungen) und der obere Bildteil bei allen Bildern ruhig genug sein, können auch die Folgebilder ohne Textbox gesetzt werden.
     
  • Hier sieht man zwei unterschiedliche Umsetzungsarten für das selbe Posting. Beides ist möglich und kann je nach Bildauswahl gewählt werden.

Bucketlist Kopieren Sie den Link zu diesem Element

Das Hintergrundbild für das Veranstaltungscarousel muss so ruhig wie möglich sein, wie zum Beispiel ein Close Up mit Tiefenunschärfe. Es muss so ruhig sein, dass man in der linken oberen Ecke die Headline ohne Textbox platzieren kann.
 

  • Die Fläche hat immer die Hälfte des Postings in der Breite.
     
  • Wenn sich nicht alle Veranstaltungen in einem Posting ausgehen, können gerne mehrere Teile daraus gemacht werden.
     
  • Jeder Bereich variiert farblich (je nach dem was gut zum verwendeten Bild passt).

Zwei Textboxen Kopieren Sie den Link zu diesem Element

Die Textbox mit Headline befindet sich immer unterhalb und die Textbox mit der Subline immer oberhalb des Vibes. Außerdem müssen die linke bzw. rechte Kante der beiden Farbboxen (je nachdem ob die Textbox links oder rechts im Bild am Safespace andockt) bündig sein.

Multipost Kopieren Sie den Link zu diesem Element

Wir lockern den Feed auf Instagram auf, indem es hin und wieder Postings gibt, wo eine Farbfläche (+Text) dominiert. In diesem Fall ist die Textbox immer so groß wie hier abgebildet. Es ist möglich das Bild aufzuteilen, um in einem zweiten, zugehörigen Posting doch noch einen Ausschnitt davon sichtbar zu machen. Der Vibe zieht sich weiter.
Falls das Bild das nicht zulässt, kann man auch zwei verschiedene zusammenpassende Bilder zum selben Thema nehmen, und nur der Vibe markiert subtil die Zusammengehörigkeit.

Stories Kopieren Sie den Link zu diesem Element

Vibe kann vorkommen, muss aber nicht immer. Der Vibe kann statisch sein, er kann sich aber auch als Video rein und wieder rausanimieren. Die schwarze Fläche ist ein Platzhalter für User Generated Content. Je ruhiger das verwendete Hintergrundbild ist, desto besser.





Texte
Schrift ist rot oder weiß
Lift-Effect kann nach bedarf eingesetzt werden
Sublines und Fließtexte sind immer linksbündig.
Die Headline kann linksbündig oder mittelachsig gesetzt werden.

Links / Tags / Hashtags
Gestaltung aus Instagram in der schwarz-pinken Darstellung

Text on the go
Falls spontan unterwegs in der Instagram App gestaltet werden muss, bitte ausschließlich die hier gezeigte Schriftart verwenden. Farben: rot oder weiß

Highlight Covers
80 % Transparenz der Sekundärfarben. Dahinter liegt ein Bild in schwarz weiß

Instagram Reels Kopieren Sie den Link zu diesem Element

Lieber öfter umbrechen, als zu nah an den safe space Rand zu kommen. Die Schrift kann in der Größe und Position (innerhalb des safe spaces) frei variieren.

Falls direkt in der Instagram App gestaltet werden soll, bitte ausschließlich die Schriftart „Classic“ in folgenden Farben verwenden.
Bevorzugt: Farben rot oder weiß ohne Hinterlegung. Safe spaces auch hier mitbedenken.

Pinterest Kopieren Sie den Link zu diesem Element

Idea Pin Kopieren Sie den Link zu diesem Element

Auf Pinterest werden hin und wieder auch Idea Pins eingesetzt. Ein Idea Pin besteht aus mehreren Slides und ermöglicht es mehr Informationen unterzubringen. Wichtig hier ist der Vibe, der sich über die einzelnen Slides weiterzieht.

YouTube Kopieren Sie den Link zu diesem Element

Die Texte in den Thumbnails sind bewusst groß, damit sie ideal lesbar sind in dieser kleinen Anwendung. Die Schrift und die Vibe-Stärke sind in allen Videos gleich groß. Das heißt, der Text muss kurz und knackig sein.

Bitte akzeptieren Sie die Marketing-Cookies um dieses Video anzusehen.

TikTok Kopieren Sie den Link zu diesem Element

  • Man kann die Schrift bei Bedarf mit einem Schatten hinterlegen. Man kann jedoch auch die Sekundärfarben flächig einsetzen, wenn man ein Intro/Typo-Teaser braucht.
  • Alternativ zu den Textboxen kann die Schrift auch direkt auf das Bewegtbild gesetzt werden. Entweder rot oder weiß.
  • Falls direkt in der TikTok App gestaltet werden soll, bitte ausschließlich die Schriftart „Classic“ verwenden.
  • Sollte die Lesbarkeit nicht gegeben sein, können die halbtransparenten Hinterlegungen verwendet werden.
  • Die weiße Standort-Darstellung ist immer zu bevorzugen. (Darstellung von Erwähnungen und Hashtags kann nicht verändert werden.)
Nächstes Kapitel

Motion

Zur Hauptnavigation