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 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 & die animation-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-Animationen & SMIL
- 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
Jonas Hellwig arbeitet als Web Designer, Video-Trainer, Fachbuchautor und Dozent in Berlin. Neben Responsive Design hat er sich auf WordPress, Photoshop und Workflow-Optimierungen im Web Design spezialisiert und ist Gründer der Agentur kulturbanause
® (
kulturbanause.de). Auf
blog.kulturbanause.de veröffentlicht er interessante Artikel, Tipps und Tutorials zum Thema Web Design. Jonas Hellwig ist regelmäßig als Sprecher auf Veranstaltungen zum Thema Web Design anzutreffen und unterstützt Web-Agenturen und Unternehmen bei der Planung und bei der technischen Umsetzung von Web-Projekten.
Kunden-Feedback zu unseren Inhouse-Schulungen
Das war so ein tolles Seminar. Einfach nur klasse. Vielen Vielen Dank !!!
Oktober 2015, Detlef Heese, Geschäftsleitung & Diplom Designer, Hasegold GmbH
Jonas ist extrem schnell in der Auffassung unserer Knackpunkte, fachlich versiert in der Lösung und pragmatisch in der Umsetzung gewesen. Design und Konzept vereint in einer Person und zudem ein super Erklärbär – die perfekte Mischung für uns. Lieber Jonas, die Empfehlung von www.vergleich.de ist dir garantiert – vielen Dank für die super Workshop-Tage.
Mai 2015, Kingyi Yu, Leiterin Marketing & Projektmanagement, Vergleich.de Gesellschaft für Verbraucherinformation mbH
Top Dozent mit sehr umfangreichem Know-how. Ich habe sehr viel gelernt. Danke!
November 2016, Tatiana Teusch, Entwicklerin, GDV e.V.
Das Responsive-Training fanden wir klasse präsentiert und sehr praxisbezogen. Trotz der Themen-Agenda ist Jonas immer wieder auf individuelle und Projekt-bezogene Fragen eingegangen. Besonders gefallen hat uns die gut verständliche Zusammenführung der beiden Welten Design und Programmierung. Im Anschluss haben wir gleich unser erstes Projekt zu 100% durchziehen können.
Dezember 2014, Mathias Weber, Senior Project Manager, AP Design GmbH
Ich bin mit großen Erwartungen zu diesem Seminar gekommen und diese wurden auch voll erfüllt. Trotz des komplexen Themas war es ein sehr kurzweiliges Vergnügen Jonas Hellwig zuzuhören. Die Themenschwerpunkte wurde verständlich erklärt und ich konnte jede Menge neues Wissen daraus mit nach Hause nehmen. Sollte es für mich wieder Bedarf für eine Weiterbildung geben so wird kulturbanause.de sicherlich die erste Adresse sein an welcher ich anfragen werde.
November 2016, Jörg Aderhold, JAderBass webdesign
Öffentliche Schulungen für Frontend-Developer
Alle öffentlichen Schulungen anzeigen