Differences
This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision | ||
| howto:design-artefakte [2024/10/27 20:52] – sophie | howto:design-artefakte [2025/05/31 20:08] (current) – sophie | ||
|---|---|---|---|
| Line 1: | Line 1: | ||
| ====== Design-Artefakte ====== | ====== Design-Artefakte ====== | ||
| + | |||
| + | ===== Deadline ===== | ||
| + | |||
| + | Alles hier genannte muss 2 Wochen vor Beginn des ersten Vortrags bereitstehen und dem VOC übergeben sein. | ||
| + | Ausnahme: Intros von Vorträgen deren Titel sich in dieser Zeit nochmal geändert haben. | ||
| + | Ist 2 Wochen vor dem ersten Vortrag nichts eingegangen wird das VOC benötigte Artefakte selbst erstellen und selbst erstelltes verwenden. | ||
| + | |||
| ===== Lizenz ===== | ===== Lizenz ===== | ||
| Die Designartefakte müssen unter der selben Lizenz wie die Veranstaltungsinhalte stehen. Bei Audio ist sicherzustellen, | Die Designartefakte müssen unter der selben Lizenz wie die Veranstaltungsinhalte stehen. Bei Audio ist sicherzustellen, | ||
| Line 11: | Line 18: | ||
| | StreamLogo | | StreamLogo | ||
| | ComposeBackground | | ComposeBackground | ||
| - | | Intro | Introvideo mit Daten über den Vortrag | + | | Intro | Introvideo mit Daten über den Vortrag |
| | Outro | Abspannvideo mit Infos über Konferenz | | Outro | Abspannvideo mit Infos über Konferenz | ||
| | Lowerthird | Einblendungen im Video | Pixelgrafik mit Transparenz | | Lowerthird | Einblendungen im Video | Pixelgrafik mit Transparenz | ||
| Line 19: | Line 26: | ||
| ===== Styleguide ===== | ===== Styleguide ===== | ||
| - | 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. | + | 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. |
| ==== Streamingwebseite ==== | ==== Streamingwebseite ==== | ||
| Line 27: | Line 35: | ||
| * einfach einen PR eröffnen wenn fertig | * einfach einen PR eröffnen wenn fertig | ||
| * vielfältige CSS Anpassungen und Custom HTML möglich | * vielfältige CSS Anpassungen und Custom HTML möglich | ||
| + | |||
| ===== Pauseloop ===== | ===== Pauseloop ===== | ||
| + | |||
| ==== Video ==== | ==== Video ==== | ||
| Seamless loopendes Video, das als Endlosschleife zwischen Vorträgen in der Pause in den Livestream geschickt wird. | Seamless loopendes Video, das als Endlosschleife zwischen Vorträgen in der Pause in den Livestream geschickt wird. | ||
| * Videoformat: | * Videoformat: | ||
| * Audioformat: | * Audioformat: | ||
| + | |||
| ==== Audio ==== | ==== Audio ==== | ||
| Musik, die in Pausen in den Livestream eingespielt wird. | Musik, die in Pausen in den Livestream eingespielt wird. | ||
| * Audioformat: | * Audioformat: | ||
| + | |||
| ===== Streamlogo ===== | ===== Streamlogo ===== | ||
| Line 43: | Line 55: | ||
| * kann individuell pro Raum sein | * kann individuell pro Raum sein | ||
| * kann zusätzlich auch für den Slides-Only-Stream individuell sein | * kann zusätzlich auch für den Slides-Only-Stream individuell sein | ||
| + | |||
| ===== ComposeBackground | ===== ComposeBackground | ||
| Line 52: | Line 65: | ||
| * grün ist wo der hintergrund durchkommt, blau/rot sind die drübergelegten Kamerabilder/ | * grün ist wo der hintergrund durchkommt, blau/rot sind die drübergelegten Kamerabilder/ | ||
| * individuell pro Raum | * individuell pro Raum | ||
| + | |||
| ==== Side by Side ==== | ==== Side by Side ==== | ||
| - | {{:howto:sidebyside.png? | + | {{:howto:side-by-side.svg? |
| ==== Lecture Mode ==== | ==== Lecture Mode ==== | ||
| - | {{:howto:lecturemode.png? | + | {{:howto:lecture.svg? |
| Line 73: | Line 87: | ||
| * Achtung! schedule.xml ändert sich während der Veranstaltung regelmäßig, | * Achtung! schedule.xml ändert sich während der Veranstaltung regelmäßig, | ||
| * Software: https:// | * Software: https:// | ||
| - | * Designquelle: | + | |
| - | ==== statisches PNG ==== | + | |
| + | ==== Designquellen ==== | ||
| + | |||
| + | === statisches PNG === | ||
| * nur noch Text drüberlegen und gut ist | * nur noch Text drüberlegen und gut ist | ||
| * simpel | * simpel | ||
| * einfach | * einfach | ||
| * kann überall laufen um auf abruf neue intros zu generieren | * kann überall laufen um auf abruf neue intros zu generieren | ||
| - | ==== svg ==== | + | |
| + | |||
| + | === svg === | ||
| * simpel | * simpel | ||
| * gibt im intro/outro generator funktionen für einfache 2D-Animationen | * gibt im intro/outro generator funktionen für einfache 2D-Animationen | ||
| * kann überall laufen um auf abruf neue intros zu generieren | * kann überall laufen um auf abruf neue intros zu generieren | ||
| - | ==== blender | + | |
| + | |||
| + | === blender === | ||
| * aufwändigere animationen | * aufwändigere animationen | ||
| * lange Renderdauer | * lange Renderdauer | ||
| * braucht GPU und Hardware, die nicht immer aufm Event vorhanden ist | * braucht GPU und Hardware, die nicht immer aufm Event vorhanden ist | ||
| - | ==== apple motion | + | * auf kurze Renderzeiten achten. Wenige Minuten pro Intro sind akzeptabel, mehrere Stunden pro Intro nicht. |
| - | * Braucht einen mac | + | |
| - | * Status der Automatisierung | + | |
| - | ==== after effects | + | === apple motion === |
| - | * Windows | + | Generierte Intros mit Apple Motion sind möglich. Hierzu ist ein Mac mit installiertem |
| + | |||
| + | |||
| + | === after effects === | ||
| + | * MacOS und Windows | ||
| * Status der Automatisierung unklar | * Status der Automatisierung unklar | ||
| Line 102: | Line 127: | ||
| * alternativ aus einem statischen png ein Video machen | * alternativ aus einem statischen png ein Video machen | ||
| * Video/ | * Video/ | ||
| + | |||
| ===== Lowerthird ===== | ===== Lowerthird ===== | ||
| Line 108: | Line 134: | ||
| * Dateinamen: siehe https:// | * Dateinamen: siehe https:// | ||
| - | ===== Infobeamer ===== | + | |
| - | Infoscreen, der zwischen | + | ===== Infobeamer ===== |
| - | * Vielfältige Designelemente möglich, im Rahmen dessen was die Lua- und Rendering-API von Info-Beamer erlaubt. | + | Zwischen |
| - | * https:// | + | |
| - | * verschiedene Hintergründe | + | Alternativ können wir auch andere Inhalte anbieten, wie z. B. nur eine quasi-statische Auflistung der zukünftigen Vorträge oder [[https:// |
| - | * Fahrplaninfos | + | |
| - | * Konferenzinfos | + | 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). |
| - | * Social Media | + | |
| - | * (Sponsoren) | + | |
| - | * Animationsvideos für Wechsel zwischen Inhaltsbereichen | + | ==== Mögliche Designelemente ==== |
| - | * 2-3s | + | |
| - | * Wir brauchen alle Designelemente einzeln als Bilder, auch Logos, Schriften etc. | + | |
| + | * 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 | ||
| + | * Hintergrundbild | ||
| + | * Konferenz-Schriftart | ||
| + | * Farben (Hex, `#RRGGBB`) | ||
| + | |||
| + | Folgende Elemente sind optional, können bei Bedarf und Verfügbarkeit verwendet werden: | ||
| + | * verschiedene Hintergründe | ||
| + | * Fahrplaninfos | ||
| + | * Konferenzinfos | ||
| + | * Social Media | ||
| + | * Sponsoren | ||
| + | * Animationsvideos für Wechsel zwischen Inhaltsbereichen | ||
| + | * Schriften für: | ||
| + | | ||
| + | * Talk-Titel | ||
| + | * Konferenztag | ||
| + | * Uhrzeit | ||
| + | * Track-Name | ||
| + | * Mastodon-Displayname | ||
| + | * Mastodon-Username/ | ||
| + | * Toot-Text | ||
| + | * Scroller (mit Toot-Content) | ||
| + | * Freitextfelder | ||