Mithilfe des Imagescene Generators können Bilder in dynamische Szenen verwandelt werden.
Beispielsweise können hierdurch Kurs- oder Themenbanner im Lernmanagementsystem Moodle mit dezenten Animationen erzeugt werden.
Der generierte SVG-Code kann jedoch auch in anderen digitalen Szenarien eingesetzt werden.
Der Imagescene Generator befindet sich derzeit noch in einer Beta-Phase.
Die grundlegenden Funktionen sind weitestgehend stabil, während für die nächsten Schritte noch visuelle sowie funktionelle Anpassungen vorgesehen sind.
Informationen zur Nutzung
Der Imagescene Generator wird mit offenem Quelltext entwickelt und ist unter der
GNU GPL 3.0
lizensiert. Je nach Verwendung kann das Nutzen einer Creative Commons Lizenz passender sein, sodass das Tool ebenso unter der
CC-BY-SA 4.0 DE
Lizenz steht. In diesem Fall entfällt die Weitergabe des Copyright-Hinweises durch die Autorennennung.
Der Quellcode, weitere Informationen zur Lizensierung sowie Möglichkeiten zur Mitwirkung
sind über das Tool-Repository auf Github zu erreichen.
Bildszene erstellen
Um eine Bildszene zu erstellen, wird eine lokale Datei oder die URL zu einer Bilddatei benötigt.
Es kann außerdem ein Codeschnipsel verwendet werden, der die URL zu einem Bild beinhaltet.
Beispielsweise kann bei der Arbeit in Moodle
ein Bild in den dortigen Editor eingefügt und der gesamte, hierdurch erzeugte Code für den Imagescene Generator genutzt werden.
Der Vorteil bei der Verwendung eines Codeschnipsels ist, dass vorhandene Werte für das Seitenverhältnis sowie für den Alt-Tag nach Möglichkeit automatisch übernommen werden. ✨
Generator
Lokale Bilddatei als DataURI verarbeiten:
Mithilfe von DataURIs können Bilder in Text umgewandelt werden.
Mit zunehmender Bildgröße kann die erzeugte Buchstabenfolge schnell umfangreich sowie unübersichtlich werden,
wodurch es sich anbieten kann, anstelle der Umwandlung lokaler Dateien mit Bildadressen zu arbeiten.
Breite und Höhe beziehen sich auf die Ausgangsmaße des verwendeten Bildes. Entscheidend ist das Seitenverhältnis, sodass die Einheit nicht beachtet werden muss.
ist eine Vorlage von
Die Verwendung einer alternativen Bildbeschreibung ist optional, wird jedoch aus Gründen der Barrierefreiheit empfohlen.
Erweiterte Anpassungen
CSS-Regeln werden in dieser Form angegeben: eigenschaft1: wert1; eigenschaft2: wert2; usw...
Zur Übersichtlichkeit können Eigenschaften auch in einer neuen Zeile beginnen.
Das Einfügen von individuellem CSS ist eine experimentelle Funktion.
Verschachtelte Regeln, doppelte Anführungszeichen usw. werden möglicherweise noch nicht unterstützt.
Ergebnis
Vorschau:
Weiterführende Gedanken
Die Aufbereitung eines Bildes in Form von dezenten, dynamischen Animationen scheint im ersten Moment keinen funktionellen Mehrwert zu haben.
Beim Untersuchen beispielsweise des Hauptmenüs moderner Videospiele oder der Startseite verschiedener Streamingdienste wird deutlich,
dass das Wegfallen der dortigen Bewegungen, die meist dezent im Hintergrund ablaufen, erhebliche Auswirkungen auf die "Atmosphäre" zur Folge hätte.
Der Imagescene Generator soll weder solche Videospiele noch entsprechende Streamingdienste imitieren,
jedoch die Wirkweisen der beschriebenen Dynamik im Hintergrund aufgreifen.
Mit diesem Gedanken können beispielsweise im Bildungsbereich Einstiegsseiten für neue Themen oder einzelne, digitale Lernorte
als motivierende Szenen aufbereitet werden, ohne vom eigentlichen Lerngegenstand abzulenken.
Die konkrete "Geburtsstunde" dieser Idee wurde auf Mastodon mit vielfältigen Impulsen aus der Community angereichert,
wodurch ein großer Dank an alle Personen geht, die hieran beteiligt waren oder die dies bei der Nutzung oder Mitentwicklung des Projekts sein werden.
Neben Verbesserungen im Code werden nach und nach weitere Vorlagen für generierte Bildszenen bereitgestellt.
Außerdem ist eine Lösung angedacht, wie neue Vorlagen aus der Community einfacher integriert werden können.
Viel Spaß beim Generieren und Nutzen der dynamischen Bildszenen!
