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 & 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 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

Jonas HellwigJonas Hellwig arbeitet als Web Designer, Video-Trainer, Fachbuchautor und Dozent in Berlin. Neben UX/UI-, Frontend- & Responsive Design hat er sich auf Workflow-Optimierungen im Design-Prozess 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 Fachveranstaltungen anzutreffen und unterstützt mit Seminaren und Workshops Unternehmen bei der Planung, der Gestaltung und der technischen Umsetzung von Website-Projekten.

Kunden-Feedback zu unseren Inhouse-Schulungen

Das spannende Seminar mit Jonas Hellwig hat uns viele neue Impulse gegeben. An dieser Stelle noch einmal ein herzliches Dankeschön an Jonas nach Berlin!

Dezember 2014, Venne Media – Quelle

Danke für die 2 Tage Input und Inspiration. Der Funke ist innerhalb kurzer Zeit übergesprungen. Ich gehe mit einem positiven + energiegeladenen Eindruck in den Arbeitsalltag zurück und freue mich, die neuen Erkenntnisse in die neuen Projekte mit integrieren zu können.

Dezember 2019, Rebekka Petri, Mediendesignerin, iWelt AG

Das war ein tip-top Workshop mit dem @_kulturbanause heute. Ich würde ihn gern als Missionar zu allen Kunden dieser Welt schicken :)

August 2013, Carsten Fischer, triplesense Reply GmbH – Quelle

Es war ein sehr interessantes, inspirierendes und gut erklärtes Seminar. Habe viel gelernt. Vielen Dank!

Dezember 2019, Katja Mainzer, Projektleiterin Design, 3st kommunikation GmbH

Inzwischen haben wir die Schulung in unserem Entwicklermeeting ausgewertet. Alle Beteiligten haben sie als sehr gut eingestuft. Die Grundlagen am Anfang waren für uns alle »erhellend« und notwendig, der Stoff wurde sehr gut vermittelt und die Beispiele waren aus unserer Sicht gut gewählt.

Mai 2019, Peter Magdowski, Abteilungsleiter Entwicklung, Com In GmbH & Co. KG


Öffentliche Schulungen für Frontend-Developer

Themenverwandete Schulungsthemen

Unsere Agentur in Berlin realisiert vom durchgestylten One-Pager bis zur funktionalen Konzern-Website Projekte mit sehr unterschiedlichem Umfang. Wir haben u.a. mit folgenden Kunden erfolgreich zusammengearbeitet: