icon-arrow-lefticon-arrow

Kurzbeschreibung

Das vektorbasierte Web-­Grafikformat 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 Export-­Einstellungen kennen und erfahren, wie Browser-­Kompatibilitä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 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.

Agenda

  • SVG-­Grafiken erstellen
  • SVG-­Grafiken optimieren und exportieren
  • Der Aufbau eines SVG-­Dokuments
  • SVG-­Grafiken mit CSS verändern
  • Interaktionen hinzufügen
  • Responsive SVG-­Grafiken
  • SVG-­Animationen
  • Tools und Hilfsmittel

Voraussetzungen & Zielgruppe

Das Seminar richtet sich an Webdesigner und Frontend-­Developer. Solide Kenntnisse in Adobe Illustrator, sowie in HTML und CSS werden vorausgesetzt. Ein eigenes Notebook mit installiertem Google Chrome Browser, Adobe Illustrator (Testversion ausreichend) sowie einem Code-Editor (z. B. dem kostenlosen Editor Brackets) sind notwendig um die Übungen dieses Workshop live mitmachen zu können.

Die Sprache des Seminars ist Deutsch. Die Schulungsunterlagen werden ebenfalls in deutscher Sprache bereitgestellt.

Veranstaltungsort & Verpflegung

Das Seminar findet im »Social Impact Lab« in der Glogauer Str. 21 in Berlin-Kreuzberg statt.

Fotos des Seminarraums im Social Impact Lab Berlin

Der Eingang befindet sich im Innenhof rechts im Seitenflügel. Die Seminarräume befinden sich im 2. Obergeschoss und sind behindertengerecht ausgestattet.

Kaffee, Tee, kalte Getränke, Obst und Gebäck stehen Ihnen den ganzen Schulungstag über zur Verfügung. In der Mittagspause gehen Sie gemeinsam mit dem Dozenten und den anderen Teilnehmern in einem Restaurant in der Nähe des Seminarraums essen. Dort werden neben fleischhaltigen auch vegetarische und vegane Gerichte angeboten. Die Kosten sind im Seminarpreis enthalten.

Dozent

Jonas HellwigJonas Hellwig arbeitet als Web Designer, Video-Trainer, Fachbuchautor und Dozent in Berlin. Neben UX/UI-, Frontend- & Responsive Design hat er sich auf WordPress 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 Webdesign anzutreffen und unterstützt Digitalagenturen und Unternehmen bei der Planung und bei der technischen Umsetzung von Web-Projekten.

Kunden-Feedback zu unseren öffentlichen Schulungen

Tolles Seminar! Sehr praxisnah, uptodate mit viel, viel Info. Toller Seminarstil. Ich habe in 2 Tagen extrem viel gelernt. Vielen Dank

Mai 2018, Dido Krämer, Grafik-Designerin – Quelle

[…] Begeistert war ich von Jonas Hellwigs Vortrag zur „Content Choreography für responsive Websites […]

April 2014, Die Onlinerin, Anja Böhnke, – Quelle

Am 26.11. habe ich dem Tagesseminar Responsive Web Design - Die technische Umsetzung - mit Jonas Hellwig (kulturbanause) teilgenommen. Ich bin mit dem Anliegen angereist, als Lehrender meinen aktuellen Kenntnisstand zu überprüfen und durch die Erfahrungen und Entwicklungen aus der Agenturpraxis zu ergänzen. Das Seminar hat meine Erwartungen vollständig erfüllt. Dem Referenten ist es gelungen, den gepackten Stoff didaktisch augezeichnet aufzuarbeiten und trotz seiner manchmal vorhandenen Komplexität verständlich und nachvollziehbar zu vermitteln. Eine umfangreiche digitale Seminardokumentation hilft, die Inhalte noch einmal zu rekapitulieren.

Dezember 2015, Prof. Andreas Baumgart, Hochschule für Angewandte Wissenschaften Hamburg

Vielen Dank für zwei spannende Tage Input und Austausch. Jonas leitet die Seminare hochpräzise und aufmerksam, er geht jederzeit flexibel und geduldig auf wirklich alle Fragen ein und findet einen passenden Lösungsweg. Besonders wertvoll für mich, ist Jonas' spürbar große persönliche Leidenschaft für einerseits die Optimierung der komplexen Thematik selbst, aber vor allem auch die Lehre – eine ehrliche Begeisterung, die sich auf die Teilnehmer überträgt und konzentriertes Arbeiten auf hohem Niveau garantiert. Ein Seminar, das man mit fundiertem Wissen vom Jetzt bis in die nahe Zukunft verlässt und einer großen Freude direkt loszulegen.

November 2016, Miriam Stepper, Art Director, infoklick.ch

Top Dozent mit sehr umfangreichem Know-how. Ich habe sehr viel gelernt. Danke!

November 2016, Tatiana Teusch, Entwicklerin, GDV e.V.

Ihr Kommentar zu diesem Termin

Ihr Kommentar zu diesem Termin

Bei Fragen, Anregungen oder Kritik zu diesem Termin, nutzen Sie bitte das Kommentar-Formular.

Ihr Kommentar wird überprüft bevor er auf der Website erscheint. Nicht themenrelevante Beiträge werden gelöscht.

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