Tag 2: Audios visualisieren mit SpareMin Headliner – AdvenTOOLender 2018

Herzlichen Willkommen zum zweiten Türchen des AdvenTOOLender! Schön, dass du mit dabei bist. An diesem Tag möchte ich dir das Tool „SpareMin Headliner“ vorstellen.  Mit ihm kannst du Audios für Online visualisieren. Warum das sinnvoll ist und wie das geht, erfährst du in diesem Artikel. Vorab sei schon gesagt: Ich liebe dieses Tool und es ist komplett kostenlos.

Beispiel: Sandra Müller und #VisualRadio

Für das Beispiel, das ich euch vorbereitet habe, möchte ich mich bei Radio-Journalistin Sandra Müller bedanken. Sie hat mir dafür einen Ton eingesprochen, in dem sie erklärt, wieso sie es so wichtig findet, dass Audios Online visualisiert werden. Außerdem hat sie mir ihr Foto zur Verfügung gestellt. Mit dem Tool kannst du also unter anderem so ein Audiogram bauen (sowohl Quadrat, als auch Hoch- und Querformat sind möglich):

Geeignete Themen

Alle Themen zu denen du ein Audio und mindestens ein Foto hast, eignen sich. Das kann entweder ein kurzer O-Ton wie im Beispiel oben sein. Es könnten sich aber auch mehrere Personen unterhalten, also eine Interview-Situation stattfinden. Das müsstest du nur optisch mit den Bildern und der Platzierung der Texte (möglicherweise in unterschiedlichen Farben) lösen. Weitere journalistische Themen-Ideen: Straßenumfragen mit Foto und Ton, Aussagen der Politiker zu einem Thema, Erklärung eines Polizisten zu einem Kriminalfall, Teaser-O-Ton aus einem Podcast.

Ungeeignete Themen

Sobald du keinen Ton hast oder sich das Ganze nicht bebildern lässt, funktioniert das Tool nicht. Ich würde dir auch nicht raten, zu lange Interview-Töne zu nutzen. Mit SpareMin Headliner lassen sich snackable Audiogramme für Social Media bauen. Das sollte also nicht den gesamten Podcast zeigen – auch wenn Töne bis zu 2 Stunden im Tool möglich sind.

Die Schritt-für-Schritt-Anleitung

Wie lässt sich so ein Audiogram mit dem Tool „SpareMin Headliner“ also bauen? Das zeige ich dir jetzt ganz genau.

Abonniere meinen YouTube-Kanal gerne, wenn du möchtest. Das ist total kostenlos. Vielen Dank für deine Unterstützung! ♥️

1.) Gehe auf die Homepage von SpareMin Headliner. Klicke oben rechts auf „Sign up“ und melde dich an. Nach dem du dort einen Account erstellt hast, kannst du die kommenden Male direkt „Login“ nutzen (ebenfalls oben rechts auf der Startseite).

Hier kannst du in der Übersicht auswählen – im Beispiel brauche wir „Audiogram Wizard“. Foto 1: Screenshot

2.) Danach kommst du zu einer Übersicht, die aussieht wie auf Foto 1. Für das, was wir vorhaben, benötigst du „Audiogram Wizard“. Das ist das linke, blaue Template.

3.) Dadurch öffnet sich eine neue Übersicht, die dir kurz erklärt, was du nun tun musst (siehe Foto 2). Klicke also dort auf „Choose File“ und wähle die Audiodatei aus, die du nutzen möchtest. Darunter stellst du die „Transcription Language“ ein, die ist in unserem Fall „German“. Das kann natürlich variieren, je nachdem, welche Sprache dein O-Ton hat. Sobald du damit fertig bist, klickst du unten auf den blauen „Next“-Button, um weiterzumachen.

Wähle dein Audio aus und stelle die „Transcription Language“ ein. Foto 2: Screenshot

Anmerkung: Gestern habe ich dir ja die Daten zur Verfügung gestellt, um Material zu haben, damit du das Ganze nachbauen kannst. Ich wollte dir – nicht böse gemeint – nicht einfach Foto und Audio von Sandra Müller geben. Deshalb habe ich dir selbst einen Ton eingesprochen und ein Bild von mir ausgewählt. Damit kannst du jetzt weiterarbeiten, wenn du möchtest – natürlich kannst du auch deine eigenen Medien nehmen: AdvenTOOLender SpareMin Headliner Material 

4.) Dann öffnet sich die „Clip Audio“-Funktion. Hier kannst du die Länge deines Audios bearbeiten. Bei mir war es so, dass ich die etwa 55 Sekunden O-Ton komplett nutzen wollte. Deshalb habe ich hier keine Einstellungen vorgenommen. Das Coole an dieser Funktion ist aber, dass du rechts die sozialen Medien angezeigt bekommst und siehst, ob dein Ton die passende Länge dafür hat. Je nachdem, wo du das Audiogram also am Ende ausspielen möchtest, kannst du checken, ob das Ganze optimal passt. Zur Orientierung:

  • Instagram-Stories: max. 15 Sekunden,
  • Instagram-Feed: max. 60 Sekunden,
  • Twitter: max. 2.20 Minuten
  • Snapchat: max. 10 Sekunden

5.) Klicke wieder auf den blauen „Next“-Button und gelange so zur „Choose aspect ratio“-Seite. Hier kannst du einstellen, ob dein Audiogram ein Quadrat-, Quer- oder Hochkant-Format haben soll. In unserem Beispiel ist es das Quadrat.

Hier kannst du die Wellenform bestimmen und das Hintergrundbild hochladen. Foto 3: Screenshot

6.) Durch den erneuten Klick auf den „Next“-Button, können wir die letzten Voreinstellungen treffen, bevor wir in den Editor für eine detailliertere Bearbeitung gelangen. Du kannst entscheiden, wie die Form der Audiowelle aussehen soll – in unserem Beispiel ist das „Wide Round Bars“. Die Farbe ist schwarz. Du fügst außerdem das Hintergrundbild hinzu. Das hatte ich im Quadrat schon vorbereiten und dort beispielsweise den Namen von Sandra Müller und ihren Job-Titel hinzugefügt. Dieser Vorarbeitsschritt ist sehr sinnvoll und macht dir das Ganze leichter. Die Audio-Welle kannst du mit gedrückter Maus auf der rechten Seite so positionieren, dass sie zu deinem Bild passt. Wenn du die Einstellungen fertig hast, drückst du auf den „Create Project“-Button.

Im Editor machst du den Feinschliff deines Audiograms. Foto 4: Screenshot

7.) In dem Editor, der sich jetzt geöffnet hast (siehe Foto 4), kannst du die letzten Schritte anpassen, bevor du dir dein Audiogram downloaden kannst. Du siehst auf den unterschiedlichen Spuren, wo sich dein Audio und dein Bild („Media“) befindet. Du könntest auch noch Texte und weitere Bilder hinzufügen. Das ist in unserem Beispiel hier aber nicht der Fall. Oben links siehst du den vom Tool vortranskribierten Text. Damit musst du gleich noch am meisten arbeiten. Vorher treffen wir aber noch weitere Einstellungen. Klicke dafür oben links im „Transcript“-Reiter auf „Style“.

8.) Im „Style“-Bereich (siehe Foto 5) geht es jetzt um die Schrift, die den transkribierten O-Ton auf deinem Audiogram anzeigt. Entweder nutzt die auf der rechten Seite eine vorgefertige Art oder klickst auf den „Costum“-Reiter. Hier kannst du die Schriftart, Farbe und Co. einstellen. Ich habe die „Open Sans“ genommen, Farbe Schwarz, die Hintergrundfarbe entfernt und das Ganze gefettet. Du entfernst die Hintergrundfarbe, in dem du auf „Background“ und „Text Highlight Color“ klickst und jeweils den Regler in der unteren Linie bis nach ganz links ziehst. So wird sie transparent. Das machen wir alles unter „Costum“. Im „Animations“-Reiter daneben, kannst du einstellen, ob du diesen Karaoke-Stil möchtest. Ich habe ihn genutzt und dafür einen Rosa-Ton (#fd7b8a) als Farbe gewählt. Auf der linken Seite siehst du ja dein Audiogram. Hier kannst du die Textbox so ziehen und platzieren, wie du die Position und Breite der angezeigten Schrift gerne hättest. Das ist bisschen fummelig. Klicke am Ende auf „Save“ und gelange dadurch zurück zum Editor.

Im „Styles“-Bereich kannst du die Schrift des gezeigten Textes anpassen. Foto 5: Screenshot

9.) Im Editor musst du jetzt wieder oben links in den Transcription-Bereich. Jetzt geht es aber um den dargestellten, transkripierten Text und wann er im Audiogram abläuft. Das ist jetzt die meiste Arbeit. Lies erstmal über den Text, ändere Rechtschreibungs- und Zeichensetzungsfehler. Dafür klickst du einfach in die einzelnen Textfelder, wo sich ja bereits ein vortranskribierter Text befindet. Danach schaust du dir an, wie das Ganze auf der rechten Seite auf dem Audiogram aussieht. Gegebenenfalls musst du bei „Styles“ (siehe Schritt 8) noch einmal Anpassungen vornehmen. Jetzt entscheidest du, wie viel Text in welchem der Felder stehen soll. Manchmal stehen zu wenig Worte darin, bei manchen zu viele. Du passt hier also an, wann, wie viel Text gezeigt wird. Das siehst du im Video alles noch einmal genauer. Du kannst jederzeit dein Audiogram auf der rechten Seite abspielen und überprüfen, ob dir die Art, wie die Worte angezeigt werden, passt.

10.) Solltest du dich für den Karaoke-Stil entschieden haben, fällt dir beim Abspielen des Audiograms auf, dass das Gesagte im Audio, nicht auf die Schnelligkeit des Textes passt. Im Transcription-Fenster stehen am linken Rand die Zeiten, wann das Ganze abgespielt wird. Da musst du jetzt das Audio anhören und dann die Daten ändern. Manches muss erst später oder früher dran sein. Zu dem Ganzen gehört der Trick, dass du manchmal die Werte im nächsten Textfeld ändern musst (oberer Wert) um deinen gewünschten Wert im Textfeld davor ändern zu können. Ganz genau siehst du das aber im Video.

11.) Solltest du alle Einstellungen getroffen haben und dir gefällt dein Audiogram: Klicke rechts auf den „Export“-Button. Nach einiger Zeit (der Vorgang dauert etwas) kannst du es downloaden. Benenne dein Projekt abschließend noch, damit du es in deiner SpareMin-Headliner-Bibliothek wiederfindest. Dafür klickst du auf „Untitled Project“, das über dem Transcription-Bereich steht.

Weitere Beispiele

MDR SACHSEN-ANHALT-Kollege Julien Bremer hat dieses Beispiel gebaut um auf die Podcast-Folge „Neues vom Krügelplatz“ mit Interview-Gast Michael Oenning, Trainer beim 1. FC Magdeburg, zu teasen. Den gesamten Podcast kannst du dir hier anhören: „Das große Michael-Oenning-Interview

Außerdem hatten wir Margot Käßmann zu Gast im Landesfunkhaus in Magdeburg. Für den MDR SACHSEN-ANHALT habe ich mit ihr über „Glaube und Sachsen-Anhalt“ gesprochen. Eine ihrer Antworten habe ich als Audiogram mit SpareMin Headliner dargestellt. Das gesamte Interview findest du hier: „Sachsen-Anhalt und der christliche Glaube“


Mehr zum Thema: Audios im Internet

Sandra Müller gibt gemeinsam mit Katharina Thoms immer wieder Seminare zum Thema #VisualRadio und #RadiofürdieAugen bei der ARD.ZDF.medienakademie. Mehr Infos findest du hier: „Seminare VisualRadio

In einem separaten YouTube-Video habe ich mich vor einiger Zeit mit dem Thema beschäftigt, wie Töne Online am besten integriert werden können. Hier zeige ich dir weitere Ideen, was neben dem Audiogram noch möglich ist:

Und auch das Tool „SoundCite JS“, das ich dir am 9. Tag des AdvenTOOLender vorgestellt habe, integriert Audios auf eine besondere Weise in den Text:

Türchen 9: SoundCite JS für Audios im Text – AdvenTOOLender 2018

Und mit „TapeWrite“ vom 22. Türchen können Audios mit Slider-Elementen visualisiert werden:

Türchen 22: „TapeWrite“: Audios mit Slider-Elementen visualisieren – AdvenTOOLender 2018 


Mehr vom AdvenTOOLender

Türchen 24: Mit „MyAdvent.net“ einen Adventskalender erstellen – AdvenTOOLender 2018

Türchen 23: Interaktive Videos mit „Ekostudio“ erstellen – AdvenTOOLender 2018

Türchen 21: Mit „Datawrapper“ Daten visualisieren | #ddj – AdvenTOOLender 2018

Türchen 20: Mit „Interview JS“ einen Chatbot erstellen – AdvenTOOLender 2018

Türchen 19: Mit „Story Spheres“ 360°-Bilder mit Audios verknüpfen – AdvenTOOLender 2018

Türchen 18: „Timescape“ für Storytelling auf interaktiver Karte – AdvenTOOLender 2018

Türchen 17: Interaktive (Insta-) Stories & Umfragen mit Apester – AdvenTOOLender 2018

Türchen 16: Stories erzählen mit „Wakelet“ und Social Media – AdvenTOOLender 2018

Türchen 15: Interaktiven Zeitstrahl mit „Timeline JS“ erstellen – AdvenTOOLender 2018

Türchen 14: Mit „Brackify“ Umfrage-Battles erstellen – AdvenTOOLender 2018

Türchen 13: „Account Analysis“ für Twitter-Daten – AdvenTOOLender 2018

Türchen 12: News-Quiz erstellen mit Genial.ly – AdvenTOOLender 2018

Türchen 11: Genial.ly für interaktive Bilder – AdvenTOOLender 2018

Türchen 10: Wortwolken als Design-Option und Analyse-Tool – AdvenTOOLender 2018

Türchen 9: SoundCite JS für Audios im Text (Inline) – AdvenTOOLender 2018

Türchen 8: Interaktiver Daten-Zeitstrahl mit StoryLine JS – AdvenTOOLender 2018

Türchen 7: Storrito für Instagram-Stories vom PC – AdvenTOOLender 2018

Türchen 6: „Steller“ für Fotoalben mit Story – AdvenTOOLender 2018

Türchen 5: Mit Canva schnell schöne Designs erstellen – AdvenTOOLender 2018

Türchen 4: Gifs erstellen mit dem Data Gif Maker – AdvenTOOLender 2018

Türchen 3: Vorher-Nachher-Bilder mit Juxtapose JS – AdvenTOOLender 2018

Türchen 1: Interaktive Grafiken mit Infogram – AdvenTOOLender 2018


Du hast noch Fragen zu SpareMin Headliner, Feedback zum AdvenTOOLender oder ein bestimmtes Tool, das ich neben der Adventskalender-Aktion Schritt-für-Schritt erklären soll? Immer her damit! Entweder als Kommentar unter diesen Blog-Eintrag, per E-Mail (johanna.daher@gmx.de), via Kontaktformular oder über die sozialen Kanäle.