Kursbeschreibung

Das Modul "UI-Design mit Figma" isr der Erstellung von Prototypen für verschiedene Webseiten, Mobile-Geräten und Desktop-Applikationen gewidmet. Unser praxisorientierter Ansatz ermöglicht es dir nicht nur, Figma zu beherrschen, sondern auch bewährte Designpraktiken zu verstehen. Von Figma-Grundlagen bis zur fortgeschrittenen Anwendung – erfahre, warum Figma das führende Tool für UI-Designer.

- Einführung und Vorbereitung
- Figma als Werkzeug für UI-Designer
- Einrichtung und Registrierung
- Figma Web App vs. Figma Desktop-App
- Datei-Formate in Figma
- Dateien in Figma organisieren
- Dateien zwischen Teams und Projekten teilen
- Figma Community
- Tools und Arbeitsflächen
- Arbeitsflächen, Menüs und Tools
- Pages, Layers und Assets
- Tastenkombinationen
- Navigieren und Zoomen
- Plugins und Widgets
- Diagrammen mit FigJam erstellen
- Datei-Freigabe und Berechtigungen
- Elemente für Gestaltung in Figma
- Figuren und Container
- Farben und Hintergründe
- Text- und Schrifteinstellungen
- Importieren von Schriften
- Gruppen, Frames und Sektionen
- Masken und Boolean Operationen
- Vektorgrafiken
- Pixel-Bilder
- Automatisierung von Arbeitsabläufen
- Layers verwalten
- Stile
- Komponenten und Instanzen
- Variante
- Variablen
- Organisation von Inhalten innerhalb einer Design-Datei
- Layouts erstellen
- UI-Usability als Basis für Layout
- Layout-Grundstruktur nach Atomic Design
- Constraints vs. Auto-Layout
- Auto-Layout für grafische Elemente
- Auto-Layout für Text-Blöcke
- Parent-Frames und Child-Frames
- Nested Auto-Layouts
- Layouts für diverse Gadgets
- Grids und Breakpoints
- Responsive vs. Adaptive Design
- Pixel Density
- UI Design-Richtlinien (Guidelines)
- Prototyping mit Figma
- Arten und Rolle der Prototypen im Überblick
- Moodboards
- MockUps
- LoFi- und HiFi-Wireframes
- Design-System (im Überblick)
- Verwendung von Bibliotheken
- Interaktive Prototypen
- Conditionals
- Design Tokens