icon-arrow-lefticon-arrow

Kurzbeschreibung

Die Gestaltung moderner Websites ist in den letzten Jahren anspruchsvoller geworden. Insbesondere Designer ohne oder mit geringen HTML- und CSS-Kenntnissen können zunehmend schlechter einschätzen, wie robuste Web-Layouts konstruiert sein müssen, welche gestalterischen Einschränkungen und Freiheiten es gibt und wie die Zusammenarbeit mit Entwicklern möglichst reibungslos gestaltet werden kann. Auch neue Bedienkonzepte und Benutzergewohnheiten sorgen dafür, dass Web-Layouts heute anders aussehen und anders gestaltet werden müssen, als noch vor ein paar Jahren.

In diesem Seminar erfahren Sie, welche gestalterischen Möglichkeiten es mit CSS gibt, wo Sie mit Problemen rechnen müssen und wo CSS Vorteile bietet. Auch Tools und Hilfsmittel zum Erzeugen von Code oder zum Testen der gestalterischen Möglichkeiten werden Sie kennenlernen. Anhand kleiner in sich abgeschlossener Übungen lernen Sie die neuen Web-Design-Funktionen der Creative Cloud kennen und optimieren ihren Workflow in Photoshop, Illustrator und Edge Reflow.

Mit neuen Workflow-Konzepten und modularen Layouts erreichen Sie nicht nur schneller ihr Ziel, sondern auch die Kollegen aus der Entwicklung werden es Ihnen danken. Auch die Optimierung von Grafik für hochauflösende Displays, SVG-Grafiken und Webfont-Icons stellen für Sie in Zukunft keine Herausforderung mehr dar.

Themenübersicht

Web-Design Grundlagen

  • Gestalterische und technologische Trends
  • Visuelle Hierarchie
  • Die Auswirkung von HTML-Strukturen auf die Gestaltung
  • Konventionen
  • Progressive Enhancement
  • Mobile First
  • Responsive Design

Gestaltung mit CSS

  • Ebenenstile und CSS
  • Farben und Verläufe
  • Hintergründe und Muster
  • Schatten und Effekte
  • Animationen und Übergänge
  • Adobe Extract
  • Tools und Hilfsmittel

Neue Workflows und Programmfunktionen

  • Bibliotheken und modulare Layouts
  • Farbkonzepte
  • SVG & SVG-Animationen
  • Verknüpfte Smartobjekte
  • Web-Design-Funktionen von Illustrator, Photoshop & Co.
  • Programme kombinieren
  • Webfonts erstellen und einsetzen
  • Webfont-Icons

Dateiausgabe und Reinzeichnung

  • Assets und der Photoshop-Generator
  • Farbraum und Profile
  • Dateiaufbereitung

Vorkenntnisse/Voraussetzungen

Dieses Seminar richtet sich an Grafiker und Designer ohne Coding-Erfahrung. Es wird u. a. in Photoshop und Illustrator gearbeitet. Die Funktionsweise dieser Programme sowie ein sicherer Umgang mit OSX (falls Sie unseren Schulungsrechner benutzen) 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

Grafiker, Designer, Webdesigner, Mediengestalter sowie andere Kreative, die Webseiten gestalten

Kunden-Feedback zu unseren öffentlichen Schulungen

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

Tolles und kurzweiliges Seminar! Ich hätte nicht gedacht, in so kurzer Zeit so viel zu lernen und zu verstehen. Ich habe richtig viel Spaß am Thema gewonnen.

Mai 2019, Phil Hoffmann, International Marketing, DKMS GmbH

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:

diegruenen