KI-gestütztes UI-Design

Du lernst, was UI-Design bedeutet, wie es digitale Produkte prägt und welche Grundprinzipien hinter guten Interfaces stecken. Außerdem steigst du in Figma und die wichtigsten KI-Tools ein, die deinen Designworkflow von Anfang an beschleunigen.

Du vertiefst dein Verständnis für technische Grundlagen wie HTML, CSS, Padding und Margin und lernst, wie Begriffe wie Dark Patterns, Konsistenz und Direkte Manipulation die Qualität von Interfaces beeinflussen. Anhand realer Beispiele übst du, bestehende Designs zu analysieren und gezielt zu verbessern.

Du baust die wichtigsten UI-Komponenten eigenständig in Figma: Avatare, Chips, Tabellen, Toggles, Modals und Tooltips. Dabei lernst du Best Practices und verstehst, wie gut durchdachte Komponenten die Grundlage für skalierbare Designsysteme bilden.

Du lernst, was ein Designsystem ist, wie es aufgebaut wird und wie du Variablen, Design Tokens und Theming in Figma einsetzt. Mit KI-Unterstützung durch ChatGPT erstellst du ein vollständiges, dokumentiertes System – von Farb-Tokens bis zu Variable Modes.

Du erstellst interaktive Prototypen mit Variablen in Figma und setzt Motion & Micro Interactions ein. Ergänzend lernst du, wie du mit KI-Tools wie Figma Make, Lovable und v0 schnell prototypst und Designs sauber an Entwickler:innen übergibst.

Du baust zwei reale Apps – Songkick und Dropbox – in Figma nach und durchläufst dabei den kompletten UI-Prozess: von Color Styles und Icon Sets über Komponenten bis zum Prototyping. Diese Praxiseinheit festigt alle erlernten Fähigkeiten in einem realistischen Projektsetting.