howto:design-artefakte

Design-Artefakte

Die Designartefakte müssen unter der selben Lizenz wie die Veranstaltungsinhalte stehen. Bei Audio ist sicherzustellen, dass die Materalien nicht bei einer Verwertungsgesellschaft registriert sind (“GEMA-Frei”)

Artefakt Kurzbeschreibung Bereitstellung
Logo Konferenzlogo Pixel (png) oder Vektorgrafik (svg)
Styleguide Styleguide für Webseiten CSS, Fonts, etc
Pauseloop Videoloop und Musik für die Pause im Stream Video- und Musikdatei
StreamLogo Overlay mit Logo für den Livestream (für jeden Raum) Pixelgrafik mit Transparenz
ComposeBackground Hintergründe für die Composemodes in voctomix Pixelgrafik
Intro Introvideo mit Daten über den Vortrag Video mit Audio
Outro Abspannvideo mit Infos über Konferenz Video mit Audio
Lowerthird Einblendungen im Video Pixelgrafik mit Transparenz
Infobeamer Hintergründe für Infobeamer Einstellungen Pixelgrafik mit Transparenz

Der Styleguide wird für die Streamingwesbeite und die Grundeinstellungen im Infobeamer benötigt. Wir brauchen neben den Farben auch die Fonts und sofern vorhanden, CSS-Datein und Beispielbilder. Bitte keine Fonts die Kostenpflichtig sind.

Die Webseite, auf der Livestreams für die Dauer der Veranstaltung abgerufen werden können: https://streaming.media.ccc.de

Seamless loopendes Video, das als Endlosschleife zwischen Vorträgen in der Pause in den Livestream geschickt wird.

  • Videoformat: 1920×1080 pixel, 25 FPS, h264 oder mpeg2
  • Audioformat: Keins. Pausenmusik ist vom loopenden Video unabhängig

Musik, die in Pausen in den Livestream eingespielt wird.

  • Audioformat: alles was ffmpeg lesen kann, wav, flac, aac, mp2, mp3

Overlay für Livestream. Kleines halbtransparentes Logo oben in einer Ecke

  • Videoformat: statisches PNG, alpha channel ist zu empfehlen, 1920x1080px
  • kann individuell pro Raum sein
  • kann zusätzlich auch für den Slides-Only-Stream individuell sein

Der Videomischer Voctomix setzt aus Slides und Kamera zusammengesetzte Bilder zusammen, Slides in groß, Kamera klein daneben.

  • Format: statische PNGs, 1920x1080px
  • einzelne Dateien für
    • Lecture Mode
    • Side by Side
    • grün ist wo der hintergrund durchkommt, blau/rot sind die drübergelegten Kamerabilder/Slides
  • individuell pro Raum

Kurze Videos, die an den Anfang jedes Talks gesetzt werden. Darin sind als Textelemente mindestens die Vortragenden und der Titel des Vortrags genannt.

  • Dauer: zwischen 5 und 10 Sekunden
  • Videoformat: 1920×1080 pixel, 25 FPS, h264 oder mpeg2
  • Audioformat: optional, 48kHz, aac oder mp2
  • Datenquelle: schedule.xml
  • Dateiname: event id aus schedule.xml, eine Vdeodatei pro Vortrag
  • Achtung! schedule.xml ändert sich während der Veranstaltung regelmäßig, es müssen also auch während der Veranstaltung noch intros neu erstellt werden können
  • Designquelle: mehrere Möglichkeiten, sucht euch eine aus. Die erste und zweite sind am wenigsten aufwändig
  • nur noch Text drüberlegen und gut ist
  • simpel
  • einfach
  • kann überall laufen um auf abruf neue intros zu generieren
  • simpel
  • gibt im intro/outro generator funktionen für einfache 2D-Animationen
  • kann überall laufen um auf abruf neue intros zu generieren
  • aufwändigere animationen
  • lange Renderdauer
  • braucht GPU und Hardware, die nicht immer aufm Event vorhanden ist

Generierte Intros mit Apple Motion sind möglich. Hierzu ist ein Mac mit installiertem Apple Motion und Apple Compressor notwendig. Zusätzlich ist ffmpeg notwendig, dies kann im Zweifel über homebrew installiert werden.

Danach können mittels des intro-outro-generators automatisiert intros generiert werden. Eine Automatisierung für sonstige Inhalte (Bauchbinden, Outro, Pauseloop) ist nicht vorgesehen.

  • MacOS und Windows only
  • Status der Automatisierung unklar

5-10 Sekunden Abspann am Ende des Vortragsvideos. Platz für eventuelle Danksagungen und wenns unbedingt sein muss Logos von Sponsoren u.ä.

  • Üblicherweise ein Einheitsoutro, kann aber auch individuell pro Vortrag sein
  • kann aus selber rendering-pipeline wie die Intros fallen
  • alternativ aus einem statischen png ein Video machen
  • Video/Audioformat: siehe Intro

Englisch Lower Thirds. Eine Einblendung, die während der Vortrag läuft gezeigt werden kann. Aus den Nachrichten bekannt als das Band da unten wo Name und eine Info zur Persönlichkeit steht.

Zwischen Vorträgen wird im Vortragssaal eine Dauerschleife über info-beamer angezeigt. Üblicherweise enthält diese Dauerschleife Informationen zum nächsten Vortrag in diesem Raum, zu anderen Vorträgen im Event und eine Auswahl an Fediverse-Content, der zum Event-Hashtag passt. Üblicherweise wird dafür das info-beamer modul 'scheduled player' verwendet.

Alternativ können wir auch andere Inhalte anbieten, wie z. B. nur eine quasi-statische Auflistung der zukünftigen Vorträge oder User-Submittable Content. Kontaktiere deine VOC-Verantwortliche Person, um mehr Details zu bekommen.

Wenn gewünscht (und genug Hardware vorhanden), können wir auch andere Bildschirme im Gebäude bespielen. Wir benötigen dafür einen HDMI-Eingang und eine Stromversorgung (Steckdose, evtl. reicht auch USB).

  • Bilder müssen als Pixelgrafik (PNG) in der finalen Größe vorliegen.
  • Schriftarten als .ttf
  • Sofern nicht anders angegeben, ist die Ausgabe-Auflösung 1920x1080px (FullHD)
  • Alle Designelemente idealerweise einzeln, nicht in einem Bild zusammengebaut.

Als Minimalversion benötigen wir folgende Elemente:

  • Hintergrundbild
  • Konferenz-Schriftart
  • Farben (Hex, #RRGGBB)

Folgende Elemente sind optional, können bei Bedarf und Verfügbarkeit verwendet werden:

  • verschiedene Hintergründe für
    • Fahrplaninfos
    • Konferenzinfos
    • Social Media
    • Sponsoren
  • Animationsvideos für Wechsel zwischen Inhaltsbereichen (MP4 H.264, wir empfehlen nicht mehr als 3s)
  • Schriften für:
    • Raum-Name
    • Talk-Titel
    • Konferenztag
    • Uhrzeit
    • Track-Name
    • Mastodon-Displayname
    • Mastodon-Username/Toot-Zeit
    • Toot-Text
    • Scroller (mit Toot-Content)
    • Freitextfelder
  • howto/design-artefakte.txt
  • Last modified: 2024/11/08 14:11
  • by scientress