(english version not ready yet)

Für Euch als Vortragende gibt es mehrere Möglichkeiten, Euren talk zu halten * live * prerecorded Das anschließende Q&A findet aber immer live statt, macht also das Prerecording für Euch etwas komplizierter, da ihr zwei Setups baut.

• Wir bevorzugen 3:4 Präsentationen, weil die im Video noch ein wenig größer sind, was praktisch is für kleinere Screens
• Bitte (insbesondere bei 16:9 Folien) keine wichtigen Details in die untere rechte Ecke plazieren (Beispielbild von 2019)
  • Das Kamerabild wird in der Regel leicht mit den Folien überlappt.
  • wenn Ihr Logos, etc. dort positioniert habt, dann wäre es gut, wenn ihr es nach links oder oben verschiebt. Wenn das nicht geht, werden wir diese Ansicht nicht nutzen.

Wenn ihr Eure Folien noch nach dem Event-Motto optisch gestalten wollen solltet: Das Design ist leichtherzig, verspielt und ein wenig schebs.

1. Welche Schriftarten?
   1. Überschriften: Ubuntu (semibold) https://design.ubuntu.com/font/
   2. Fließtext: Roboto (regular) https://fonts.google.com/specimen/Roboto?preview.text_type=custom&preview.text=reboot2respawn
2. Design-Farben
   1. Dark Theme:
      1. Hintergund: dunkelviolett: 1f0229
      2. Akzent-grün: fe7900
      3. Akzent-orange: FE7900
      4. Schrift: weiß
   2. Light-Theme
      1. hintergrund: weiß
      2. Akzent-grün: 009951
      3. Akzent-pink: d10069
      4. Font-grün: 00292d
3. Hier ein fertiger Folienmaster
   1. Wir haben eine Präferenz für Folien in 4:3 (Grund: siehe oben, Folienmaster 3:4 wird bald nachgereicht)
      1. divoc-2r2_masterslides_4-3.odp
      2. divoc-2r2_masterslides_4-3.pptx
      3. divoc-2r2_masterslides.odp
      4. divoc-2r2_masterslides.pptx
      5. 
      6. 

1. OBS-Designvorschlag (gern nehmen wir aber auch mehrere syncron laufende Vollbild-Videos von Speakerinnen-Kamera(s) und Folienaufzeichnung , die wir dann selbst „pseudolive“ abmischen)
   1. OBS 4:3-Folien
   2. OBS 16:9-Folien
2. Mehr Desing-Elemente zum mit rumspielen gibt es ganz unten auf dieser Page!

Wenn ihr “optimale Qualität”, auch bei evtl. wackeligem Internet-Upstream möchtet für Euren Content, dann bietet sich “Vorproduktion/Voraufzeichung” an. Dabei reicht ihr ein entweder

1. ein komplett produziertes Video inkl. Layout und ggf. Bildregie (Folien, Vortragende). Layout-Vorschläge: Siehe unten
2. oder separate Videos für “Präsentations-Recording” plus ein oder mehrere “Speaker:in/:innen”-Videos.
   1. Diese Videos müssen dann jedoch vom Timing syncron sein!
   2. ohne jedes Layout. wir machen dann daraus mit unseren Designelementen die Bildregie. So eine “Quasi-Live-Bildregie” mit den Videos aus der Konserve.
3. Format für die Videos: 1080p25, 16:9, Bitrate 4-10MBit/s (max), Codec: bekommen wir gewandelt, h.264 in mp4 oder webm bevorzugt.
4. Zum Aufzeichnen von Videos gibt es viele Möglichkeiten, nutzt das was Euch womit ihr selbst gut zurechtkommt, wir können lediglich Dinge empfehlen. z.b.
   1. „Kevin“ für den Webbrowser vom c3voc https://kevin.c3voc.de/
      1. hat die Option „Record?“ („zusätzlich aufzeichnen“), das funktioniert auch „semi-offline“ und wenn niemand zuschaut. Am Ende der „Übertragung“ werdet ihr nach Klick auf „Stop Recording“, wo die Datei aus dem RAM auf die lokale Platte gespeichert werden soll.
      2. Das funktioniert auch mit mehreren Browserinstanzen gleichzeitg (Notfalls: verschiedene Browser nutzen, falls sich Aufzeichnung von Bildschirm und Videokamera blockieren sollte, Chrome/-ium hat sich bewährt.)
      3. Es geht auch mit dem Mobilelefon für die Speakerinnen-Kamera. Bildqualität ist dann meist überragend, ihr sollte nur das Handy irgendwo/-wie festklemmen, damit die Zusehenden nicht seekrank werden.

1. Abgabefrist 30.03. abends, gern aber auch früher, damit es noch Chancen für Korrekturen gibt.
2. Transfer:
   1. Entweder gibt ihr uns per Mail eine URL zum Download.
   2. Oder ihr nutzt unsere Upload-Freigabe (https://sf.nadeshda.org/u/d/9b1c60f3e27c42e587d9/) mit einem sinnvollen Dateinamen (also „Welcher Talk, plus ggf. Versionierung im Dateinamen, bei mehreren Uploads, also bitte nicht „Divoc-talk–version.mp4“) ====== Q&A und Live-Remote-Streaming-Setup ====== Wir möchten eine gute Stream-Qualität produzieren und es Euch dabei trotzdem so einfach wie möglich machen. Diverse Techniken (offene und proprietäre) haben wir uns angeschaut, simple und sehr ausgefeilte. (Hier könnte eine lange Liste stehen mit Vor- und Nachteilen, die wir Euch jetzt ersparen.) ===== Architektur ===== Nach einigen Testläufen sieht das vorgeschlagene Setup wie folgt aus: - Von den Vortragenden zur Regie: OBS-Ninja - Rückkanal und Notfall-Kommunkation bei Störungen: Mumble ==== Mumble Audiochat ==== Zuerst zum Rückkanal von der Regie und der Moderation: Mumble ist ein quelloffener Voicechat, der gute Audioqualität bietet, niedrige Bandbreiten braucht und sich bei Netzstörungen sicher wiederverbindet. ==== OBS-Ninja Desktop/Videoshare ==== Eurer Content zur Regie: OBS-Ninja ist ein Browser-Streaming, das keine Installation einer App benötigt sondern lediglich einen aktuellen Browser (Chromium/Chrome bevorzugt). ===== Ablauf ===== Vom Ablauf her wollen wir vor dem Divoc einen Testlauf machen und werden Euch zwecks Terminabsprache kontaktieren. Grundsätzlich bitten wir Euch ca. 20 Minuten vor dem gesetzten Termin (Testlauf als auch Event selbst) - via Mumble-Client in einen vereinbarten Raum (Lobby) zu kommen - ein Regieengel holt Euch dort ab und “bringt” Euch “in einen Saal” - Dort bekommt ihr zwei URLs für Euren Browser - URL für Camera-Share: Diesem Browser gebt ihr Zugriff auf Webcam und Mikrofon. Das Browserfenster könnt ihr dann minimieren. - URL für Slide/Desktop-Share - Dort wählt ihr entweder das Fenster mit der Applikation aus, die ihr für Eure Präsentationsfolien nutzen wollt oder den Komplettbildschirm. - Falls ihr mehrere Vortragende seid oder mehrere Kameras habt, z.B. wenn noch was unter einer Dokumentenkamera gebastelt wird, gibt es so viele URLs bis alle Teilnehmenden und alle Kameras versorgt sind. - Wenn die Technik richtig funktioniert - Wir warten gemeinsames auf den Slotbeginn laut Fahrplan - Die Herald:in wird Euren Talk anmoderieren, evtl. wechselt ihr auch dabei im Dialog schon ein paar Worte. Herald:in und Regie werden per Mumble zu hören sein (kein Bild). - Ihr haltet einfach Euren Talk, die Bildmischung zwischen den Bildquellen (Folien/Speaker) macht die Regie - Bei jeweils 10min und 5min Restzeit bekommt ihr eine entsprechende kurze Ansage von der Regie über Mumble - Im Anschluss an Euren Talk übernimmt die Herald:in wieder und wird das Q&A mit dem Signalangel machen. Ein “Saalmikro” wird es nicht geben. Die Fragen müssen also per IRC&Co online kommen. ==== Ein paar Tipps an dieser Stelle ==== Die meisten Betriebsysteme haben mindestens eine Möglichkeit die Aufnahmen eurer Webcam anzuzeigen. Schaut Euch also vor Eurem Talk einmal das Bild der Kamera an und stellt fest, ob ihr damit zufrieden seid. Beachtet die Lichtverhältnisse, die zum Zeitpunkt Eures Talks herschen werden. Ein Kameracheck mittags um 12 Uhr mit Tageslicht ist nicht aussagekräftig, wenn der Talk erst abends um 22 Uhr stattfindet. Eventuell lohnt es sich du noch eine Lampe umzustellen, um das Licht zu verbessern. Passt aber auf, dass ihr nicht überbelichtet und ihr so zu einem einfarbiger Fleck werdet. Gestaltet den Hintergrund möglichst neutral und vermeidet persönliche Gegenstände wie Photos, deinen Geburtstagskalender, Sextoys oder eine freie Sichtlinie in das Fenster deiner Nachbarn. Je “langweiliger” der Hintergrund ist, desto besser. Die Vortragsweise ist dieses Jahr deutlich anders als in den letzten Jahren. Es gibt keine direkten Zuschauer im Saal und somit auch kein sofortiges Feedback aus dem Publikum. Gestaltet Eure Talks persönlicher indem ihr Wackelaugen, Euer Lieblingsstofftier oder eine Quietscheente auf/an/um/hinter die Kamera setzt. Dadurch schaut ihr den Zuschauern im Stream öfters ins Gesicht und habt gleichzeitig “reale” Zuschauer, was häufig das Vortragen erleichtert. * Wenn ihr Folien mit “Video+Ton-Einspielern” habt: Chrome/Chromium ist der einzige Browser, der (unseres Wissens nach) derzeit zuverlässig Audio “vom Desktop” senden kann. Zudem ist es ein Browser, dem es zumindest teilweise gelingt, die Videokompression in vorhandene Hardware, wie z.B. CPU-Einheiten oder Grafikkarte, auszulagern. Das verbessert die Bildqualität erheblich * Bitte verzichtet auf Musik in Einspielern, selbst wenn diese GEMAfrei sein sollte. Wir wollen Tracks auch auf Youtube veröffentlichen und die Content-ID-strikes dort sind unberechenbar. Das führt eventuell dazu, dass Eure Videos dort irgendwie “unsichtbar” werden, obwohl ihr eigentlich völlig unschuldig daran seid * Mikrofon & Audio Setup verdienen Eure Aufmerksamkeit: Kopfhörer sind unbedingte Voraussetzung, egal ob große Headsets oder kleine Ohrstecker * ein Ansteck-Mikrofon verbessert den Sound, Headsets sind noch besser! Das Mikrofon im Laptop wird vermutlich keinen guten Dienst leisten, da beim Videostreaming oft die Lüfter hochdrehen und dieser Lärm im Audiostream landet. Außerdem gibt es bei weit entfernten Mikrofonen oft “hallenden” Sound wegen Reflektionen an Wänden und Fenstern. * Licht ist wichtig: Macht so viel Licht, dass ihr gerade noch Euren Laptop sehen könnt. Webcams sind, verglichen mit den in Telefonen üblichen Kameras, erstaunlich lichtschwach * Fingerabdrücke auf der Kameralinse vorher beseitigen. Dabei hilft ein Brillenputztuch * Redshift (oft in Verbindung mit “Nightmode”) sieht in Präsentationen nicht gut aus * Messenger-Popups, Browser-Notifications, usw. im Stream sind noch peinlicher als ein klingelndes Telefon. Am peinlichsten sind jedoch Popups von von unregistrierter Shareware * ein zweiter Monitor am Rechner (Laptop) hilft extrem, wenn ihr Eure Präsentation auf einem dedizierten Monitor haltet und nur diesen dann freigebt * Wenn ihr ein ausgefeiltes Kamera-Setup oder gar selbst ein Studio betreiben solltet: Im OBS-Ninja könnt ihr auch die Virtual-Webcam als Quelle angeben. Oder einen HDMI-Grabber, an dem eine Videokamera hängt. Leuten mit einem OBS-Setup können wir auch eine RTMP-Zieladresse geben. Der Rückkanal bleibt aber auch in diesem Fall der Mumble-Audiochat. * Aufgezeichnete Talks (Pre-Recording) und nur “Q&A-Live” ist durchaus eine Option, wenn ihr Euch nicht sicher seid, dass die Internet-Bandbreite ausreicht und stabil genug ist. Entweder als “Live on Tape”-Aufzeichnung vorab von einem Ort mit besserer Anbindung oder ihr nehmt selbst, z.B. mit OBS auf. Entsprechene Folienlayouts für Splitscreen-Ansichten wird es in den nächsten 2-3 Tagen geben. ====== Software-Installation / Erläuterungen der Tools ====== ===== Mumble VoiceChat ===== Zur Erinnerung: Den Mumble-Voicechat braucht ihr für die Kommunikation vor und während Eures Talks, also zur Regie oder damit ihr den Herald und andere Mit-Vortragende hören könnt. ==== Mumble auf Windows installieren ==== Als Windows user: Geht zu www.mumble.info und klickt auf die grüne Schaltfläche. Nun könnt ihr die für Euer Betriebssystem passende Datei herunterladen. Ist die Datei erfolgreich heruntergeladen, muss sie im Dateimanager aufgerufen und mit einem Doppelklick gestartet werden. Nun öffnet sich der Installationsassistent. Klickt auf die Schaltfläche “Weiter” um die Installation zu starten. Bestätige die Geschäftsbedingungen und klicke auf die Schaltfläche “Weiter”. Hier kann ein Installationspfad ausgewählt werden. Falls ihr diesen ersetzt habt oder ihn nicht ändern möchtet, bestätigt mit einem Klick auf die Schaltfläche “Weiter”. Die anderen Einstellungen müssen nicht verändert werden. Um die Installation abzuschließen, klicke auf die Schaltfläche “Installieren”. Danach wird eine Erfolgsmeldung angezeigt und ihr könnt Mumble gleich starten. ==== Mumble auf MacOS ==== Die aktuelle Version von Mumble hat noch kein Sicherheitszertifikat von Apple erhalten. Daher könnt ihr entweder die Warnung zur Kenntnis nehmen und diese trotzdem von www.mumble.info herunterladen. Nach erfolgreichem Download öffne die Datei mit DiskImageMounter. Zieht das Icon Mumble.app in den Ordner Anwendungen/Applications. Öffnet die Datei auf keinen Fall mit einem Doppelklick sondern ausschließlich mit einem Rechtsklick. Ein Doppelklick führt zu folgender Fehlermeldung: Geht in “Finder” und öffnet die Anwendung Mumble mit Rechtsklick. Ein weiteres Dialogfenster weist auf das fehlende Sicherheitszertifikat hin. Bestätigt mit “Öffnen”. Falls ihr doch noch weitere Probleme habt, meldet Euch bitte bei Eurem Speaker-Support unter divoc-r2r@hamburg.freifunk.net ===== Mumble einrichten (/part nicht final/) ===== ==== Mumble Server ‘mumble.freifunk.net’ hinzufügen ==== Nach der erfolgreichen Installation könnt ihr nun dem Mumbleserver beitreten. Die Divoc nutzt hierfür den Mumble-Server von freifunk.net. Beim Starten von Mumble öffnet sich das Fenster “Server verbinden”. Falls dem wider Erwarten nicht so ist, kann es nachträglich mittels einem Klick auf die Erdkugel oben links geöffnet werden. Im Fenster “Server verbinden” könnt ihr den Freifunk Mumble-Server entweder hinzufügen oder diesen aus der Liste auswählen und Euch direkt damit verbinden. Um sich erstmalig mit dem Freifunk Mumble-Server zu verbinden klickt auf die Schaltfläche “Server hinzufügen”. Gebt mumble.freifunk.net als Adresse/Server an. Der Port ist standardmäßig 64738. Wählt einen echten Namen oder Nickname als Benutzernamen. Bestätigt die Eingaben mit einem Kllick auf “OK”. ==== Mumble Settings ==== Bitte geht einmal durch den “Audio-Assistenten”, diesen findet ihr unter “Konfiguration” und dann “Audio-Assistent” Durch die Dialoge bitte mit “Weiter” durchgehen, ggf. das richtige Audio-Gerät anwählen (hier im Beispiel das USB Headset, um sicherzugehen) Auf dem folgenden Audio-Pegel-Schirm kann man am Regler noch Änderungen vornehmen für die automatische Sprachaktivierung, der vorgeschlagene Wert passt jedoch meist. Wichtig: “Text zu Sprache” MUSS abgeschaltet werden (mittlere Option) Dann noch zweimal mit Weiter bestätigen, wobei ihr die Statistik-Übertragung deaktivieren könnt. ===== OBS NINJA ===== Um Euren Vortrag auf die Divoc-Bühne zu bringen nutzen wir OBS Ninja. Dies ist eine Live-Streaming Software die rein im Browser funktioniert und somit keine zusätzliche Softwareinstallation benötigt. Fragt Euren Speaker-Kontakt nach einem persönlichen Invite-Link. Falls ihr noch keinen erhalten habt, könnt ihr Euch via E-Mail an divoc-r2r@hamburg.freifunk.net wenden oder einen eigenen Raum ausprobieren. Bitte beachtet, dass ihr zwei Fenster, bzw. Tabs, von OBS-Ninja braucht, um sowohl die Webcam zu nutzen als auch den Bildschirm zu teilen. OBS-Ninja läuft aktuell am besten in Chromium/Chrome. ==== Einen Invite-Link verwenden ==== Kopiert den Link in die Adresszeile eures Browsers und gebt das Passwort ein. Gebt Bildschirm und Webcam frei. ==== Einen Raum eröffnen ==== Geht auf die VOC-OBS-Ninja-Seite OBS-Ninja und startet mit der Auswahl/Freigabe von Screenshare und Kamera. ==== Webcam einrichten ==== Um die Kamera freizugeben muss nun die korrekte Kamera ausgewählt und im Browser freigegeben werden. Nun gibt es ein kleines Vorschaubild in dem die Ansicht kontrolliert werden kann. Die sonstigen Einstellungen sollten den zuvor gewählten Einstellungen im Browser entsprechen. Beginnt den Stream mit einem Klick auf den Startbutton. ==== Bildschirm freigeben ==== Wählt den gewünschten Bildschirm aus und gebt diesen im Browser frei. Bestätigt die Auswahl und startet die Übertragung mit dem Share Button. Unter MacOS muss in Firefox die Bildschrimfreigabe erstmalig bestätigt werden. Danach muss Firefox noch einmal neu gestartet werden. Alternativ kann der Bildschirm auch aus einem laufenden Stream freigegeben werden. Dazu muss unten auf die Bildschirmfreigabeschaltfläche geklickt werden. Die Speakeransicht wird dann geteilt und in der rechten Hälft kann ein Fenster oder Bildschirm ausgewählt werden, der gestreamt werden soll. Wenn nur ein Fenster ausgewählt wird, ist eine Übertragung des Tons unmöglich! Der Ton kann in firefox generell bei der Bildschirmübertragung nicht übertragen werden. In anderen Browsern muss ein zusätzliches Häkchen gesetzt werden um die Audioübertragung zu starten. ==== Bedienelemente ==== Es gibt unter dem Videobild Bedienelemente die die Übertragung steuern. Links ist eine Sprechblase die ein Chatfenster öffnet. Der Chat ist für alle Teilnehmer sichtbar. Daneben ist ein Lautsprechersysmbol, mit dem die Übertragung von Tönen aus anderen Programmen gestoppt werden kann. Das 3. Symbol von links ist ein Mikrofon mit dem das eigene Mikro ausgeschaltet werden kann. Daneben befindet sich ein Auge mit dem die Übertragung schwarz geschaltet wird, so dass der eigene Bildschrim bzw. die Webcam nicht mehr zu sehen sind. Das Zahnrad öffnet die Streameinstellungen in denen z.B. andere Mikrofone ausgewählt werden können oder ein anderer Bildschrim zur Übertragung. Ganz rechts ist ein rotes Telefon mit dem der Anruf/Stream beendet wird. ====== Backup Video ======= Leider hat nicht jeder immer eine 100% zuverlässige Internetverbindung. Im rc3 ist es mehrfach vorgekommen, dass Speaker während ihres Vortrags aus dem Meeting fallen, das VOC mit DDOS zu kämpfen hat und weiter Unannehmlichkeiten. Seit der aktuellen Version ist es in OBS Ninja möglich ein lokales Recording anzufertigen. Dadurch können Talks mit technischen Schwierigkeiten noch im Nachhinein vollständig auf media.ccc.de landen. Um das lokale Recording zu aktivieren muss der Betreuende Engel im Controlroom auf den Button „record remote“ klicken. Beim Speaker startet dann ein „Download“. Dies ist kein Download aus dem Internet, sondern das Speichern der aktuell laufenden Aufzeichnung. Je nach Browser muss der Speaker noch einen Speicherort auswählen und auf Datei speichern klicken. Wenn die Aufzeichnung durch den Engel beendet wird, ist die Datei beim Speaker gespeichert. Diese würden wir bitten, die Datei erstmal aufzubewahren, damit sie im Notfall noch nachgefordert werden kann. Firefox: Datei speichern auswählen, einen sinnvollen Dateinamen einfügen und an einem Ort speichern, der auch nach dem Event noch wiederzufinden ist. Chrome: Chrome beginnt einen automatischen Download. Eventuell gibt es ein Pop-Up-Fenster in dem der Download gestattet werden muss. Der Download ist danach am unteren Bildschirmrand zu sehen. Edge: Der Download startet automatisch und wird am unteren Bildschirmrand angezeigt. ====== Selbst testen ====== Hier könnt ihr selbst Eure Bildqualität beurteilen, auch in Abhängigkeit von der gewählten Maximalauflösung und Eurer nutzbaren Internetbandbreite. Probiert es selbst aus mit unterschiedlichen Settings, vorzugsweise mit zwei getrennten PCs an unterschiedlichen Internetanschlüssen, da das genutzte Protokoll webRTC sonst (idealerweise) gar nicht “durch’s Internet” geht, sondern lokal bleibt, was Einflüsse von z.B. verfügbarer Upload-Bandbreite nicht zeigt. Bitte probiert das Backup-Recording aus, falls ihr dazu die Möglichkeit habt. * Speaker Webcam * Source: https://obs.ninja/?room=R2Rtest&hash=3513&password=test Hier können die Webcam und die Folien freigegeben werden * Controlroom: https://obs.ninja/?director=R2Rtest&password=test Hier sollten Bild und Ton von Webcam und Folien ankommen ===== Test-Session / technische Stellprobe ===== Wir werden Eure Setups im Vorfeld mit Euch testen. Dabei geht es vor allem um die optimalen Einstellungen von Bild- und Audioqualität. Euren Talk müsst ihr dafür also noch nicht(!) fertig haben! Bitte kontaktiert uns kurzfristig per Mail an divoc-r2r@hamburg.freifunk.net wann wir gemeinsam vor dem 26.03. einen Testlauf starten können. Eventuell trefft ihr uns auch zufällig auf dem Mumble-Server https://mumble.freifunk.net, wenn ihr dort im Raum „R2R-DiVOC-Lobby“ vorbeikommt. Es mag aber sein, dass dort niemand ist oder ihr nicht bemerkt werdet. Unangekündigt ist also vermutlich “Warten” angesagt. In den nächsten Tagen melden wir uns nochmal mit konkreten Slots/Sprechzeiten. === Designelemente === Hier gibt es Design-Elemente mit denen ihr spielen könnt * ein Senderlogo in bunt als PNG: * * Senderlogo in transparent-weiß als PNG: * * bunte und weiß/transparente Senderlogos gemeinsam in einer SVG: * * Bunny mit Wiese * * Carrot-Hut ohne Bunny * * Sidebar mit Hut und Logo * * Sidebar ohne Firlefanz * * freche Farbfläche grün * * freche Farbfläche orange * * freche Farbfläche pink * * weitere Artworks (und mehr Hasen…) https://di.c3voc.de/hiddenservice:artwork