SVG – flexible Webgrafiken erstellen, exportieren und animieren

Ein Seminar mit Jonas Hellwig (kulturbanause)

Allgemeine Informationen

  • Datum: 13.12.2017
  • Beginn: 09:30 Uhr
  • Ende: 17:30 Uhr
  • Veranstaltungsort: Haus der Wissenschaft, Bremen
  • Teilnahmegebühr: 375,00 € zzgl. 19 % MwSt. (446,25 € brutto)
    Beachten Sie unser attraktives Rabattsystem für Seminare!
  • In den Seminargebühren ist die Verpflegung enthalten.
  • Direkt zum Anmeldeformular

Kurzbeschreibung

Das vektorbasierte Webgrafikformat SVG hat in der letzten Zeit enorm an Popularität gewonnen. SVGs können ohne Qualitätsverlust skaliert werden, sehen auf jedem Display scharf aus und können darüber hinaus animiert oder mit Interaktionselementen versehen werden. In diesem Seminar lernen Sie anhand in sich abgeschlossener Übungen die Möglichkeiten von SVG kennen.

Zunächst erfahren Sie, wie SVG-­Grafiken mit Hilfe von Adobe Illustrator (oder Photoshop) erstellt werden und was Sie bereits bei der Gestaltung der Grafik beachten sollten. Anschließend lernen Sie die verschiedenen Exporteinstellungen kennen und erfahren, wie Browserkompatibilität, Bildqualität und Dateigröße entscheidend beeinflusst werden können. Auch verschiedene Plugins und Tools zur Optimierung der SVGs werden vorgestellt.

Im zweiten Teil des Seminars lernen Sie, wie SVG-­Dokumente aufgebaut sind und wie der SVG-Code manipuliert werden kann. Sie werden Mouse-­Over-­Effekte erstellen, die Grafiken umgestalten oder Breakpoints hinzufügen, um unterschiedliche Grafiken für unterschiedliche Displaygrößen zu erstellen. Neben den nativen Möglichkeiten von SVG existieren dazu auch diverse CSS-­Eigenschaften.

Der letzte Teil des Seminars beschäftigt sich mit dem Thema SVG-­Animation. Auch hier existiert eine native SVG-Syntax mit der beispielsweise Elemente an Pfaden entlang bewegt werden können. Darüber hinaus lassen sich auch zahlreiche CSS-Animationstechniken auf SVG anwenden.

Themenübersicht:

  • SVG-­Grafiken mit Adobe Illustrator erstellen
  • SVG-­Grafiken exportieren und optimieren
  • SVG-Grafiken einbinden
  • Fallback-Lösungen
  • Der Aufbau eines SVG-­Dokuments
  • SVG-­Grafiken mit CSS umgestalten
  • Interaktionen hinzufügen
  • Responsive SVG-­Grafiken
  • SVG-Sprites und Icon-Systeme
  • SVG-­Animationen mit CSS und SMIL
  • Tools und Hilfsmittel

Vorkenntnisse/Voraussetzungen

Solide Kenntnisse in Adobe Illustrator und Photoshop sowie in HTML und CSS werden vorausgesetzt.

Durchführung

Wir können für das Seminar insgesamt 8 Apple iMacs bereitstellen. Wenn Sie Ihr eigenes Laptop nutzen wollen bzw. können, geben Sie dieses bitte bei der Anmeldung an. Die maximale Teilnehmerzahl ist 10.

Zielgruppe

Das Seminar richtet sich an Webdesigner und Frontend-­Developer.

Dozent

Jonas Hellwig
kulturbanause, Berlin

hat eine Vorliebe für illustrative und technisch fortschrittliche Websites. Er lebt und arbeitet als Designer, Frontend-Entwickler und Trainer in Berlin. Dabei hat er sich auf Photoshop, WordPress und Social-Media-Integration spezia­lisiert. Zudem ist er Gründer der Agentur kulturbanause. Neben Fachbüchern und Lernvideos veröffentlicht er auf blog.kulturbanause.de regelmäßig Artikel, Tipps und Tutorials rund um das Thema Webdesign. Sein Blog gilt inzwischen als eine der wichtigsten Anlaufstellen für Informationen rund um dieses Thema. In der Offline-Welt ist Jonas Hellwig regelmäßig auch als Sprecher auf Konferenzen zum Thema Web­design anzutreffen.

Veranstaltungsort

Haus der Wissenschaft

Sandstraße 4/5
28195 Bremen [Routenplanung öffnen]

Anmeldung

Persönliche Informationen
Student
Azubi
arbeitssuchend
Setze ein Lesezeichen auf den Permalink.

Die Kommentarfunktion ist geschlossen.