Präsentationen mit Sozi

Mit Sozi lassen sich SVG-Dateien (InkScape) so erweitern, dass sie in aktuellen Browsern als interaktive und animierte Präsentationen angezeigt werden.
Die Präsentation blättert dabei nicht wie bei Powerpoint einfach durch einzelne Folien sondern entspricht mehr wie bei Prezi einem Poster, das man mit einem zoomfähigen Fernglas aus unterschiedlichen Blickwinkeln betrachtet.
Sozi hat mal als InkScape-Erweiterung angefangen, arbeitet inzwischen aber als eigenständiges Programm und läuft unter Windows, MacOS und Linux. Vom Autor wurde die Version 17.06 vor wenigen Wochen freigegeben. Leider bezieht sich die Anleitung auf der Homepage größtenteils immer noch auf die Version 13, als Sozi noch eine InkScape-Extension war.
Die Hinweise auf dieser Seite sind das Ergebnis einer langen Recherche im Netz, ergänzt durch Versuch und Irrtum.

Bisheriges Fazit: sehr lohnenswert!





Quick&Dirty Zugang (Windows)

So erstellen Sie in wenigen Schritten Ihre erste (einfache) Präsentation:

  • Laden Sie die aktuelle Version von Sozi und packen Sie sie auf einem beliebigen Laufwerk (auch USB-Stick) aus. Sozi ist portable und muss nicht installiert werden.
  • Erzeugen Sie eine neue SVG-Datei (InkScape → Datei → Neu).
  • Speichern Sie diese Datei unter dem Namen ›praesi01.svg‹ in einem neuen Ordner.
  • Starten Sie Sozi.exe und öffnen Sie dort die Datei ›praesi01.svg‹. Die Datei ist jetzt in in InkScape und Sozi gleichzeitig geöffnet und Ihre (leere) Präsentation ist bereits fertig!
  • Starten Sie Firefox, Opera oder Chrome und laden Sie (Strg-O) die von Sozi automatisch erzeugte Datei ›praesi01.sozi.html‹. Sie finden sie im gleichen Ordner wie die SVG-Datei. Angezeigt wird ein leerer Bildschirm.
  • Schalten Sie um zum InkScape-Fenster, erzeugen Sie einige Objekte und speichern(!) Sie die Datei.
  • Wenn Sie zurück nach Sozi schalten, sollten Ihre Objekte dort bereits angezeigt werden.
  • Fügen Sie in Sozi (mit ›+‹ links unten) einige Frames zur Timeline hinzu und verändern Sie jeweils die Ansicht - einfach mit der Maus verschieben, drehen oder zoomen. Wenn Sie dabei die Tasten Strg, Alt und Shift drücken, wird der Ausschnitt in der Bewegung horizontal/vertikal eingeschränkt, gezoomt oder rotiert.
  • Schalten Sie zurück zu Ihrem Browser und laden Sie die HTML-Datei neu.
  • Blättern Sie mit den Cursortasten durch Ihre Präsentation.
  • Wiederholen Sie die letzten vier Schritte.
  • Betrachten Sie Ihre Präsentation im Browser. (Ich empfehle, den Link mit Rechtsklick in einem neuen Tab oder Fenster zu öffnen, denn die von Sozi generierte Datei erzeugt sehr viele Einträge in der Browser-History. Nach Betrachten der Präsentation kommt man durch einfaches Schließen des neuen Tabs zurück auf die aufrufende Seite.)
  • Hier ein mögliches Ergebnis .





Bedienung

Hier eine kurze Zusammenfassung der Oberfläche von Sozi.

Timeline

Die einzelnen Frames werden wie bei einem Video-Schnitt-Programm zu einer Timeline zusammengefasst und von links nach rechts nacheinander angezeigt. Jeder neue Frame verlängert die Timeline und wird hinter dem gerade ausgewählten Frame eingefügt - genau genommen wird der letzte ausgewählte Frame verdoppelt.
Die Reihenfolge der Frames kann nachträglich leicht verändert werden, indem man einen oder mehrere (wie bei Windows-Explorer mit Strg & Shift) Frames auswählt und dann auf einen der beiden kleinen Pfeile des Zielframes klickt (Auswahl vor/hinter Frame Nr. ### einfügen). Die Pfeile erscheinen, wenn der Mauscursor über einer Frame-Nr. schwebt. Im Prinzip funktioniert die Änderung wie Ausschneiden/Einfügen bei anderen Windows-Programmen, allerdings mithilfe einer sozi-internen Zwischenablage.
Zumindest bei komplexeren Präsentationen macht es Sinn, wenn jeder Frame einen sprechenden Namen bekommt, denn der taucht ggf. in einer Übersicht auf.

Übergänge

Für die Präsentation lässt sich bei jedem einzelnen Frame festlegen, wie lange der Übergang vom letzten Frame dauern und ob bzw. wann eine automatische Weiterschaltung zum nächsten Frame erfolgen soll. Weitere Optionen betreffen den zeitlichen Verlauf des Wechsels, wenn man von einem Bereich des Posters in den nächsten schwenkt. Man hat die Wahl zwischen linear, parabel- und hyperbelförmig. Die Option Step end bewirkt eine einstellbare Verzögerung nach dem auslösenden Mausklick.

Automatische Aktualisierung

Wenn Sozi im Hintergrund läuft, wird nach jedem Speichern der InkScape-Datei die Präsentation automatisch aktualisiert, sobald der Focus zwischen InkScape und dem Browser wechselt. Der Browser muss nach jeder Sozi-Aktualisierung die Seite neu laden, sonst bekommt er die Änderungen nicht mit.

Falls die automatische Aktualisierung mal nicht funktioniert, kann sie mit entsprechenden Icons oder den Tastenkombinationen [Strg-S] (speichern) bzw. [F5] (SVG neu einlesen) auch händisch ausgelöst werden.

Text

Fließtext in InkScape muss entweder in normalen Text oder in einen Pfad umgewandelt werden. Die letzte Option ist schneller und hat zusätzlich den Vorteil, dass auch extravagante Schriften genutzt werden können. Man muss dabei natürlich darauf achten, den Originaltext vor der Umwandlung zu sichern, um später mal Änderungen vornehmen zu können.
Eine einfache Lösung ist, die Originale auf eine eigene (versteckte) Ebene zu verbannen, von der Sie bei Bedarf immer wieder zurückgeholt werden können.

Hardware-Voraussetzungen

Sozi benötigt für flüssiges Arbeiten ziemlich aktuelle Hardware und ausreichend Speicher. Die Erstellung einer eher technischen Präsentation mit ca. 100 Frames und ca. 1 MB Größe kam mit 4 GB Arbeitsspeicher häufig ins Stocken. So konnte es nach einer Änderung des Bildausschnitts in einem Sozi-Frame bis zu 30 Sekunden dauern, bevor sich die nächste Aktion starten ließ. Unter Windows-7-64Bit und mit 8 GB Arbeitsspeicher traten derartige Verzögerungen deutlich weniger und auch nur viel kürzer auf.

Tastaturbefehle

Während der Präsentation reagiert die von Sozi erzeugte HTML-Datei auf eine ganze Reihe von Tastaturbefehlen:

  • Pfeil-rechts, Pfeil-runter, Bild-runter, Leertaste: Nächste Folie.
  • Pfeil-links, Pfeil-rauf, Bild-rauf: Letzte Folie.
  • Pos 1: Erste Folie
  • Ende: Letzte Folie
  • Hält man die Shift-Taste gedrückt, erfolgt der Folienwechsel ohne Zeitverzögerung.
  • ›t‹: Folienübersicht anzeigen/ausblenden. Man kann Frames von dieser Übersicht ausschließen.
  • ›.‹: Mit dem Punkt kann man die Präsentation aus- und wieder einblenden.

Maussteuerung

Auch mit der Maus lässt sich eine Präsentation sehr gut steuern:

  • Linksklick: Nächste Folie.
  • Rechtsklick: Vorherige Folie.
  • Mittelklick (Mausrad): Folienübersicht anzeigen/ausblenden.
  • Mausrad: In die Präsentation herein- oder herauszoomen.
  • Shift-Mausrad: Die Präsentation drehen.





Pixelbilder

Das Poster, über das hinweg der Sozi-Flug stattfindet, kann natürlich auch Pixelbilder wie Jpeg, Tiff oder PNG enthalten. Diese können entweder direkt in InkScape importiert werden oder per Link.

Die erste Methode hat den Vorteil, dass die Präsentation aus einer Datei besteht, während die zweite Methode zu kleineren Html-Dateien führt. Wo Licht ist, ist auch Schatten, denn die Html-Datei mit integriertem Bild wird dadurch deutlich größer, während man bei der zweiten Methode beim Kopieren der Präsentation darauf achten muss, dass man alle Bilder mitkopiert.

Animierte GIFs können ebenfalls in einer Präsentation genutzt werden, allerdings nur, wenn Sie als verlinktes Objekt eingefügt werden! Wenn man sie direkt einbettet, werden sie zwar angezeigt, laufen aber nicht.

Beispiel  anschauen (mit Mausklick starten)
Seite 31 aus Otto Multhaupts ›Die Moderne Elektrizität‹ aus 1901. Die Animation besteht aus 11 Frames und wurde in wenigen Minuten zusammengeschoben. Das Bild (8 MB) wurde durch Referenz eingebaut, was die erzeugte Htm-Datei erfreulich klein hält (~ 70 KByte).





Layers & Animationen

Bis hierher ist der Umgang mit Sozi einfach und intuitiv und man kommt schnell zu ansprechenden Ergebnissen. Verzwickter wird die Sache, wenn Teile der Präsentation animiert werden sollen, denn dann kommen Ebenen ins Spiel. Der Animationseffekt entsteht einfach dadurch, dass man beim Übergang zum nächsten Frame ein(ig)e Ebene(n) aus einem anderen Blickwinkel betrachtet als (die) andere(n). Dadurch scheinen sich die Ebenen bzw. die Objekte auf ihnen gegeneinander zu bewegen.

Einfache Animationen

Wenn die SVG-Datei Ebenen enthält, können diese einzeln hinzugefügt werden. Links neben der Timeline gibt es dafür einen Button. Die Namen der Ebenen werden aus der InkScape-Datei übernommen, für jede Ebene bekommt jeder Frame einen eigenen Button. Über diese Buttons kann für jeden Frame festgelegt werden, welche Ebene von der beabsichtigten Manipulation betroffen ist und welche nicht.
Normalerweise sind alle Buttons des aktuellen Frames ausgewählt (aktiv), d.h. Einträge im Eigenschaftsbereich (rechts oben im Editor) gelten für alle Ebenen dieses Frames.
Bei Animationen wählt man (nur) die Ebene mit dem zu animierenden Element aus und verändert sie.

Die Beispiele zeigen mehrere einfache Animationen. Auf der CD finden Sie im gleichen Ordner auch die InkScape- und Sozi-Dateien und können damit experimentieren.

Beispiel-1  anschauen (mit Mausklick starten)
Auf den beiden Ebenen ›plane‹ und ›background‹ befinden sich ein kleines Flugzeug und eine Skyline. Die ganze Animation besteht aus genau zwei Frames:

  • Frame-1 zeigt die Skyline und rechts daneben (außerhalb der Anzeige) das Flugzeug, so wie die Szene in InkScape erzeugt worden ist. Man kann das in Firefox leicht kontrollieren, indem man mit der Maus den Bildausschnit nach links verschiebt oder herauszoomt.
  • Frame-2 enthält die gleichen Inhalte, allerdings wurde (nur) die Ebene ›plane‹ so weit nach links verschoben, dass das Flugzeug schließlich links aus dem Sichtfeld verschwunden ist. (Ebene ›plane‹ in Frame-2 angeklickt, bevor verschoben wurde.) Als Dauer für den Wechsel nach Frame-2 wurden 6 Sekunden eingestellt.

Beispiel-2  anschauen (mit Mausklick starten)
Wieder befinden sich auf den beiden Ebenen ›plane‹ und ›background‹ ein kleines Flugzeug und eine Skyline. Diesmal besteht die Animation aus drei Frames:

  • Frame-1 zeigt das Flugzeug (größer als im Beispiel-1) über einem Teil (rechts) des Hintergrunds.
  • Frame-2 enthält die gleichen Inhalte, allerdings wurde (nur) die Ebene ›background‹ so weit nach rechts verschoben, dass das Flugzeug schließlich über dem linken Teil des Hintergrunds schwebt. Als Dauer für den Wechsel nach Frame-2 wurden 10 Sekunden eingestellt.
  • In Frame-3 schließlich wurde (nur) die Ebene ›plane‹ so weit nach links verschoben, dass das Flugzeug vollständig verschwindet. Damit Frame-3 automatisch im Anschluss nach Frame-2 aufgerufen wird, wurde in Frame-2 der Timeout aktiviert (nicht das Häkchen, sonder die blaue Einfärbung!), Als Dauer wurden 6 Sekunden festgelegt.
    Die Ebene wurde beim Verschieben nach links auch ein wenig nach unten verschoben.

In der Präsentation startet das Flugzeug nach dem ersten Mausklick und der Hintergrund gleitet unter dem Flieger nach rechts. Kurz bevor der Flieger den linken Rand der Skyline erreicht, bleibt diese stehen und der Flieger selbst bewegt sich aus dem Bild nach links heraus und scheint dabei zu landen.

Animationen mit Outline-Elementen

Einfache Animationen gelingen so noch ganz gut, komplexere Bewegungsabläufe führen aber schnell zu Problemen. Vor allem, wenn man während der Arbeit mit Sozi noch Änderungen an der SVG-Datei durchführt, geraten die Ebenen gern durcheinander. Hat eine sorgsam ausgeknobelte Choreographie gerade noch funktioniert, kann nach einer nur kleinen Änderung an der SVG-Datei plötzlich alles aus dem Ruder laufen. Die Lösung für dieses Problem sind so genannte Outline-Elemente, mit deren Hilfe einzelne Ebenen sehr genau ausgerichtet werden können.

Beispiel-3  anschauen
Auf den beiden Ebenen ›plane‹ und ›background‹ befinden sich ein Hubschrauber und eine Skyline. Diesmal besteht die Animation aus zwei Frames:

  • Frame-1 zeigt den Hubschrauber rechts oben im Bild. Der Blick auf die Szene wird durch das Rechteck mit der Kennung ›Blick_01‹ festgelegt (Sozi passt die Anzeige so an, dass das Rechteck genau in den sichtbaren Bereich passt. Die Zeichnung wird dabei mit verschoben, skaliert und gedreht.).
  • Frame-2 enthält die gleichen Inhalte, allerdings wurde der Blick auf den Hubschrauber in Ebene ›plane‹ durch das Rechteck mit der Kennung ›Blick_02‹ festgelegt. Das Rechteck wurde so verschoben, dass der Hubschrauber genau auf dem Förderturm steht. Zusätzlich wurde das Rechteck so gedreht, dass die Kufen des Hubschraubers etwa parallel zu seiner unteren Kante verlaufen. Als Dauer für den Wechsel nach Frame-2 wurden 6 Sekunden eingestellt mit der Option ›Ease out‹, was die Bewegung zum Ende hin verlangsamt.

In der Präsentation startet der Hubschrauber nach dem ersten Mausklick und sinkt immer langsamer auf den Landeplatz zu. Dabei dreht sich der Hubschrauber so, dass - zumindest die vordere - Kante sauber auf dem Turm landet.

Beispiel-4  anschauen
Entstanden aus Beispiel-3. Diesmal besteht die Animation wieder aus drei Frames:

  • Frame-1 zeigt wie zuvor den Hubschrauber rechts oben im Bild. Der Blick auf die Szene wird durch das Rechteck mit der Kennung ›Blick_01‹ festgelegt (Sozi passt die Anzeige so an, dass das Rechteck genau in den sichtbaren Bereich passt. Die Zeichnung wird dabei mit verschoben, skaliert und gedreht.).
  • Frame-2 aus Beispiel-3 wurde verdoppelt und es wurde ein neues Rechteck mit der Kennung ›Blick_01b‹ festgelegt. Das Rechteck wurde als Duplikat von ›Blick_02‹ erzeugt und so gedreht, dass es die gleiche Orientierung hat wie ›Blick_01‹ und den Hubschrauber kurz vor der Landung zeigt. Als Dauer für den Wechsel nach Frame-2 wurden wieder 6 Sekunden eingestellt.
  • Frame-3 enthält die gleichen Inhalte, allerdings wurde der Blick auf den Hubschrauber in Ebene ›plane‹ durch das Rechteck mit der Kennung ›Blick_02‹ festgelegt. Das Rechteck wurde so verschoben, dass der Hubschrauber genau auf dem Förderturm steht. Zusätzlich wurde das Rechteck so gedreht, dass die Kufen des Hubschraubers etwa parallel zu seiner unteren Kante verlaufen. Als Dauer für den Wechsel nach Frame-3 wurden 3 Sekunden eingestellt mit der Option ›Ease out‹, was die Bewegung zum Ende hin verlangsamt.

In der Präsentation startet der Hubschrauber nach dem ersten Mausklick und sinkt mit konstanter Geschwindigkeit auf den Landeplatz zu. Kurz vor der Landung verlangsamt sich die Geschwindigkeit und erst jetzt dreht sich der Hubschrauber so, dass - zumindest die vordere - Kante sauber auf dem Turm landet.

Beispiel-5  anschauen
Zwei Frames:

  • Frame-1 zeigt vier Hubschrauber auf vier Ebenen und den Landeplatz auf einer fünften Ebene. Der Blick auf die Szene wird durch das Rechteck mit der Kennung ›base‹ festgelegt (für alle fünf Ebenen).
  • Frame-2 enthält die gleichen Inhalte, allerdings wurde der Blick für jeden Hubschrauber in einer eigenen Ebene durch das Rechteck mit der Kennung ›heli-#‹ festgelegt. Alle vier Rechtecke wurden so verschoben, dass der zugehörige Hubschrauber dabei aus dem ‘Blickfeld’ verschwindet. Als Dauer für den Wechsel nach Frame-2 wurde eine Zeitspanne von 4 Sekunden eingestellt.

In der Präsentation starten alle Hubschrauber nach dem ersten Mausklick in verschiedene Richtungen und verschwinden aus dem Blickfeld.

Beispiel-6  anschauen
Wie Beispiel-5. Zusätzlich wurde die Größe der beiden Rechtecke mit der Kennung ›heli-1‹ und ›heli-4‹ verändert. ›heli-1‹ wurde stark vergrößert, ›heli-4‹ wurde verkleinert.

In der Präsentation starten wieder alle Hubschrauber nach dem ersten Mausklick in verschiedene Richtungen und verschwinden aus dem Blickfeld. Hubschrauber-1 scheint dabei nach hinten zu verschwinden und wird immer kleiner, während Hubschrauber-4 scheinbar auf die ‘Kamera’ zufliegt und immer größer wird.|b2|

Beispiel-7  anschauen
Wie Beispiel-6. Das Rechteck mit der Kennung ›heli-4‹ wurde noch einmal deutlich verkleinert. Zusätzlich wurde eine Spirale mit der Kennung ›schlange‹ unter ›Pfad-ID‹ für die Ebene ›heli-1‹ eingebaut.

In der Präsentation starten wieder alle Hubschrauber nach dem ersten Mausklick in verschiedene Richtungen und verschwinden aus dem Blickfeld. Hubschrauber-1 scheint sich wieder nach hinten zu bewegen, scheint aber Motorprobleme zu haben, während Hubschrauber-4 so nah kommt, dass man sich beinahe unwillkürlich ducken möchte.

Jede kleine Änderung an der Schlange hatte übrigens zur Folge, dass die Pfad-ID der Ebene ›heli-1‹ in Sozi gelöscht wurde! Auch das Outline Element ›heli-4‹ blieb zwar in Sozi erhalten, musste aber jedesmal ›neu aktiviert‹ werden.







Man kann einzelne Ebenen in der Timeline ausblenden (links unten temporär unsichtbar schalten). Dieses Ausblenden gilt allerdings nur im Sozi-Editor und hat keinerlei Auswirkungen auf die spätere Präsentation.

Das regelt man über die Deckkraft bzw. Transparenz (rechts oben im Eigenschaftsbereich). Ab Version 15 kann Sozi die Deckkraft/Transparenz jeder Ebene in jedem einzelnen Frame gezielt festlegen. Dadurch kann man z.B. eine Ebene ein- oder ausblenden oder auch einfach nur ein- oder ausschalten - je nach Dauer des Wechsels zwischen den beiden Frames.

Um eine einzelne (oder mehrere) Ebene(n) innerhalb eines Frames auszuwählen, klickt man einfach mit der Maus auf den entsprechenden Button. Wichtig ist dabei, das nur die gewünschte(n) Ebene(n) links in der Auflistung ebenfalls ausgewählt ist (sind). Ausgewählte Ebenen sind blau hinterlegt, nicht ausgewählte schwarz.

Einzelne Ebenen der SVG-Datei können in jedem Frame auch für sich verschoben, gedreht oder gezoomt werden, wobei die anderen Ebenen sich nicht verändern (müssen). Auf diese Weise kann man Teile der Zeichnung vor einem festen Hintergrund animieren.

Ich habe mit folgender Vorgehensweise Erfolg gehabt:

  • Zunächst habe ich in Sozi ein festes Seitenverhältnis für die Präsentation festgelegt, z.B. 4:3, 5:3, 16:9 etc., je nach Beamer.
  • Dann habe ich in der SVG-Datei ein Rechteck mit genau diesem Seitenverhältnis erzeugt und an irgendeiner Ecke abgelegt (dünner schwarzer Rand, keine Füllung).
  • Von dem Rechteck ›in der Ecke‹ wird ein Klon erzeugt und (unter Beibehaltung des Seitenverhältnisses) so vergrößert, dass er genau die Elemente umfasst, die im ersten Frame erscheinen sollen. Dann bekommt dieser Klon (über Objekteigenschaften im Feld ›Kennung‹) einen eindeutigen Namen zugewiesen, z.B. ›Blick_01G‹ (›G‹ für Grundebene, Klick auf ›Setzen‹ nicht vergessen).

Wenn Sie sich jetzt fragen, warum ein Klon und nicht ein Duplikat von dem Originalrahmen gemacht werden muss - es ist egal, beides funktioniert gleich gut. Die Klon-Methode hat aber den Vorteil, dass man jederzeit das Original unsichtbar stellen kann - und alle Klone sind dann ebenfalls nicht mehr sichtbar.

In Sozi wird dieser Name beim ersten Frame im Feld ‘Outline Element ID’ eingetragen, nachdem die Schaltfläche ›Element automatisch auswählen‹ deaktiviert wurde. Wenn man nun auf das Icon ›An SVG-Element anpassen‹ klickt, wird im Anzeigefenster von Sozi genau der Bildausschnitt angezeigt, der durch den Rahmen mit dem Namen ›Blick_01G‹ abgedeckt wird.

Die SVG-Datei wird (in Sozi) dabei automatisch so verschoben, gedreht und gezoomt, dass sie genauer in den Anzeigerahmen passt, als hätte man sie nach Augenmaß dort eingepasst.
Achtung: Das Drehen funktioniert nur, wenn das Outline-Element ein Rechteck ist - Pfade funktionieren zwar beim Verschieben und Zoomen aber nicht beim Drehen!

Wenn man jetzt noch für diesen Frame die Schaltfläche ›Element verstecken‹ aktiviert, passt alles perfekt und der Referenzrahmen ist nicht mehr sichtbar.

(Wenn sich ein Referenzrahmen einfach nicht verstecken lassen will, kontrollieren Sie mal, ob nicht an gleicher Stelle noch ein weiterer Rahmen liegt ...) Ein Klick auf den Button ›Nicht sichtbare Elemente entfernen‹ sorgt dann ggf. dafür, dass nur noch die Sachen angezeigt werden, die innerhalb des Referenzrahmens liegen. Die Form des Referenzelements spielt keine Rolle, wirksam wird immer das umschließende Rechteck.

Die Vorteile dieser komplizierten Vorgehensweise gegenüber händischem Einpassen werden erst ersichtlich, wenn man komplexere Präsentationen plant:

  • der Referenzrahmen ist Teil der SVG-Datei und wird mit ihr gespeichert,
  • der Referenzrahmen kann mit (Alt-)Cursortasten bei entsprechender Vergrößerung wesentlich genauer positioniert werden als der Bildausschnitt in Sozi,
  • die Lage des Rahmens relativ zur Zeichnung liegt fest (kann ggf. sogar gesperrt werden),
  • weitere Referenzrahmen ‘Blick_02G’ etc. können leicht erzeugt und ebenfalls exakt ausgerichtet werden.
  • Falls die Referenzrahmen stören, ändert man einfach beim Original Füllung und Kontur auf ‘nichts’ und schon sind auch alle Klone temporär verschwunden.
  • Referenzrahmen lassen sich auch auf Unterebenen der gerade bearbeiteten Ebene anlegen. Die Unterebenen tauchen in Sozi nicht auf, machen aber alle Aktionen mit, die man mit der jeweiligen Mutterebene veranstaltet. Die Unterebenen kann man in InkScape jederzeit aus- und wieder einblenden.

Der Hauptvorteil zeigt sich aber bei der Erstellung von Präsentationen mit animierten Elementen:

  • Diese Elemente werden auf eigenen Ebenen angeordnet.
  • Zusätzlich werden auf den gleichen Ebenen (bzw. auf Unterebenen dieser Ebenen) weitere Klone des o.a. Rechtecks mit der Kennung ›Blick_01M‹, ›Blick_02M‹ usw. so angeordnet, dass beim Einpassen des betreffenden Rahmens in das Anzeigefeld von Sozi der gewünschte Effekt eintritt.
    (Man blickt durch den jeweiligen Rahmen gezielt auf einen Bereich der ausgewählten Ebene und verliert dadurch Objekte aus dem Blick bzw. man betrachtet sie aus verschiedenen Blickwinkeln näher.)

Auf diese Weise ist es kein Problem, mehrere Objekte auf dem gleichen Hintergrund sich in unterschiedlichen Richtungen bewegen zu lassen und dabei auch noch ihre Größe zu verändern.

Ändert man nach (während) der Erstellung der Präsentation etwas an der SVG-Vorlage, geraten die Ebenen sehr leicht ›aus dem Takt‹, das heißt, sie sind manchmal mehr oder weniger gegeneinander verschoben. Mit Hilfe der Referenzelemente kann man die Ordnung aber sehr schnell wieder herstellen.

Hier ein etwas komplexeres Beispiel . (Wenn Sie den Link in einem neuen Tab oder Fenster öffnen, kommen Sie leichter an diese Stelle zurück.)

Es zeigt neun animierte Objekte. Klicken Sie mit der Maus, nutzen Sie die Pfeiltasten, ...

Bei komplexeren Animationen besteht die Gefahr, dass man die Übersicht über die Referenzrahmen verliert.

Abhilfe schaffen hier eine ausführliche Choreografie und die Verlagerung der Referenzrahmen auf passende Unterebenen.

Schwierig wird es, wenn man in einen Bereich reinzoomen will, in dem Ebenen bereits gegeneinander verschoben wurden.

Wenn man dazu einen einzelnen Referenzrahmen benutzt, verschieben sich leider die Ebenen gegeneinander und laufen nicht mehr synchron.

Es hilft, wenn man zum Reinzoomen für jede Ebene einen eigenen Referenzrahmen nimmt, wobei die ›Zoomrahmen‹ dabei natürlich die richtige Größe haben müssen, sonst passt die Größe nicht mehr zueinander.

Also: einfach einen Referenzrahmen für den gesamten Frame zuweisen und wie gewünscht ranzoomen. Dann von dem benutzten Referenzrahmen eine Kopie ziehen (Strg-D) und diese Kopie als neuen Referenzrahmen der Ebene zuweisen, die beim Ranzoomen aus der Flucht gelaufen ist und nachjustieren - fertig!

Hier ein Beispiel aus der Abteilung ›Interaktive Arbeitsblätter Mathematik‹ (Winkelmessung animiert).

Referenzrahmen können nicht ausgeblendet werden, dann funktionieren sie nicht mehr.