Tauche mit unserem Online-Kurs ein in die Welt von Figma, dem revolutionären Tool für UI/UX-Design. Wir zeigen dir, wie du beeindruckende Designsysteme und Responsive Designs erstellst, Komponenten designst und Animationen sowie interaktive Prototypen entwickelst.
Perfekt für Einsteiger, die sich mit dem Tool vertraut machen wollen und erfahrene Designer, die ihre Fähigkeiten in der digitalen Gestaltung erweitern wollen. Lass dich von Figma inspirieren und verwandle deine kreativen Ideen in realisierbare Projekte!
Course plan
Einführung
Figma account erstellen
Figma Files importieren
Modul 1 - Basics
1 - Übersicht
2 - Wie finde ich mich im Figma Dashboard zurecht?
3 - Was ist Figjam?
4 - Wie verwende ich FigJam?
5 - Was ist Figma?
6 - Wie verwende ich Figma?
Modulprüfung
Modul 2 - Grundlagen in Figma
1 - Übersicht
2 - Wie erstelle ich einen Button?
3 - Wie erstelle ich eine Card?
4 - Modulprüfung
Modul 3 - Designsysteme in Figma
0 - Modulübersicht
Teil 1 - Was ist eigentlich ein Designsystem?
1.1 - Grundlagen Designsysteme (Theorie)
1.2 - Atomic Design (Theorie)
1.3 - Import des Designsystems
Teil 2 - Umsetzung von Designsystemen
2.2 - Farbsystem erstellen
2.3 - Gridlayouts erstellen
2.4 - Iconbibliothek erstellen
2.5 - Dynamische Icongrößen erstellen
2.6 - Schatten erstellen
Modulprüfung Teil 1
2.7 - Namenskonventionen nach BEM
2.8 - Button Komponente erstellen
2.9 - Input Fields erstellen
2.10 - Designsystem veröffentlichen und verwenden
2.11 - Elemente vom Veröffentlichen ausschließen
Modul 4 - Responsive Design
0 - Modulübersicht
Teil 1 - Was ist Responsive Design?
1.1 - Boxmodell und Flexbox (Theorie)
Teil 2 - Wie designe ich eine Website?
2.1 - Websitedesgin (Menü)
2.2 - Websitedesgin (Herobanner)
2.3 - Websitedesgin (Feature Cards)
2.4 - Websitedesgin (Teamcards)
2.5 - Websitedesgin (Blog)
2.6 - Websitedesgin (Kontakt-Standort)
2.7 - Websitedesgin (Footer)
2.8 - Websitedesgin (Tablet und Smartphone Version erstellen)
2.9 - Websitedesgin (Offcanvas Menü erstellen)
Modul 5 - Komponenten erstellen
0 - Modulübersicht
Teil 1 - Was sind eigentlich Komponenten?
1.1 - Wann sollte ich Komponenten erstellen (Theorie)
1.2 - Globale vs. Lokale Komponenten
Teil 2 - Komponenten erstellen
2.1 - Menükomponente erstellen
2.2 - Komponenten im Designsystem veröffentlichen
2.3 - Verhalten bei Änderungen an Komponenten
2.4 - Varianten von Komponenten
2.6 - Properties zu Komponenten hinzufügen
Modulprüfung
Modul 6 - Prototyping und Animationen
0 - Modulübersicht
Teil 1 - Wie erstelle ich Animationen?
1.2 - Übersicht zu Animationen
1.3 - Animationen (Theorie)
Teil 2 - Wie erstelle ich einen Prototypen?
2.1 - Prototyping einer App
2.2 - Prototypen teilen und Feedback einholen
Modulprüfung
Modul 7 - Abschluss
Übersicht
Wie geht es weiter?