Seminar/Schulung Web-Animationen mit CSS & SVG
In diesem Seminar lernen Sie, wie Sie mit Hilfe von GIF, CSS und SVG Animationen erstellen und statische Grafiken entsprechend vorbereiten.
Kurzbeschreibung
Animationen und animierte Interaktionen sind längt fester Bestandteil moderner Websites. Web Designer und Frontend-Entwickler sollten daher wissen, wie Animationen aufgebaut sind, welche Technologien zur Verfügung stehen, mit welchen Kompatibilitätsproblemen zu rechnen ist, wie diese umgangen werden und wie komplexe Animationen mit geringem Aufwand erstellt werden können.
In diesem Seminar beschäftigen Sie sich mit den Technologien CSS und SVG, mit den Animationsmöglichkeiten beider Sprachen und mit der Kombination von CSS und SVG. Sie lernen welche Interaktionsmöglichkeiten es gibt, wie Schlüsselbild-Animationen (Keyframe-Animationen) aufgebaut sind und welche CSS-Animations-Eigenschaften es zu kennen gilt. Darüber hinaus erfahren Sie, was Sie in Photoshop, Illustrator, Sketch und Co. bei der Erstellung von Grafiken beachten sollten, damit diese später unkompliziert in SVG umgewandelt und animiert werden können.
Agenda
- GIF-Animationen erstellen und optimieren
- Die
transition
-Eigenschaften von CSS - CSS Transitions erstellen
@keyframes
& dieanimation
-Eigenschaften von CSS- CSS-Keyframe-Animationen erstellen
- Einzelbild-Animationen mit Keyframes
- Bewegungspfade mit CSS
motion-path
- SVG-Grafiken erstellen, optimieren und exportieren
- Der Aufbau eines SVG-Dokuments
- SVG-Grafiken umgestalten
- Die Interaktionsmöglichkeiten von SVG
- Responsive SVG-Grafiken
- SVG mit CSS animieren
- Tools und Hilfsmittel
- Verschiedene Praxisbeispiele
Für wen ist das Seminar gedacht?
Das Seminar richtet sich an Web-Designer mit soliden HTML und CSS-Kenntnissen. Es ist ein praxisorientierter Workshop mit Diskussionscharakter geplant. Die Übungen werden gemeinsam am Computer, bzw. an Beamer und Flipchart erarbeitet.
Dozent: Jonas Hellwig
Kunden-Feedback zu unseren Inhouse-Schulungen
Great course! I came with no background knowledge and what I learned in these 2 days was amazing! I can definitely recommend it!
Mai 2019, Joshua Barton, International Marketing, DKMS
Die Schulung ist hier sehr sehr gut angekommen und ich denke, dass wir durch die Schulung einige Abläufe verändern werden.
Januar 2015, Olaf Dröse, Teamleiter Entwicklung, REGIOCAST GmbH & Co. KG
Super lockerer Workshop mit einer tollen Balance zwischen Zuhören und selber Ausprobieren. Hat sehr viel Spaß gemacht!
November 2018, Jessica Lyschik, WordPress-Theme-Entwicklerin, selbstständig
Die Seminarinhalte über modernes »Responsive Webdesign - Konzept, Design, Projektleitung« waren sehr hilfreich und impulsgebend für eigene Web-Projekte. Durch die vielen neugewonnenen Erkenntnisse werde ich meinen herkömmlichen Workflow optimieren.
November 2019, Christian Schwarz, IT-Projektmanager, GKD Recklinghausen
Vielen Dank für das tolle Seminar. Hat mir viel gebracht. Für das Anwenden wäre noch so eine Art Prio-Liste cool.
November 2016, Thomas Mohr, Projekteiter HMI, UX, UI (SCA Part Of Atlas Copco Group)