UI/UX Design + Figma + Wireframing + Prototyping

Diese Weiterbildung vermittelt grundlegende und fortgeschrittene Kenntnisse im Bereich UI/UX Design. Die Teilnehmenden lernen, wie digitale Anwendungen unter Einsatz von Prototyping-Tools und Designspezifikationen erarbeitet werden. Ein besonderer Fokus liegt auf der Anwendung des Tools Figma.

Modul 1: UI/UX Design für digitale Anwendungen
Modul 2: Figma: Digitale Designsysteme und Prototyping-Workflows
Modul 3: Wireframing in der nutzerzentrierten Gestaltung
Modul 4: UI Frameworks & visuelle Strukturmodelle im UX Design

UI/UX Design für digitale Anwendungen
  • Grundlagen von UI/UX: Einführung in Usability, Interface-Gestaltung und Nutzerführung für Web, App und mobile Anwendungen.
  • Prototyping & Wireframes: Einsatz von Figma, Adobe XD und Rapid Prototyping zur Entwicklung von nutzerzentrierten UI-Konzepten.
  • UX Research & Testing: Durchführung von User Research, A/B-Tests und User Personas zur Optimierung der User Experience.
  • Designsysteme & Tools: Nutzung von UI Frameworks, Style Guides und WCAG-Richtlinien für barrierefreies und responsives Design.

Figma: Digitale Designsysteme und Prototyping-Workflows
  • Grundlagen der Prototyp-Erstellung mit Figma, Aufbau interaktiver UI-Designs und Wireframing im Webdesign-Kontext.
  • Anwendung von Komponenten, Responsive Design, Grid Design und Style Guides in figma-basierten Projekten.
  • Teamarbeit mit Entwicklern durch Kommentierung, Dokumentation und figma-gestützte Entwicklerübergabe.
  • Erstellung interaktiver Prototypen, Durchführung von Usability-Tests und Ableitung gestalterischer Optimierungen.

Wireframing in der nutzerzentrierten Gestaltung
  • Grundlagen von Wireframes: Einführung in Struktur, Funktion und Einsatz von Wireframes zur Planung digitaler Interfaces und Webseiten.
  • Toolgestützte Entwicklung: Erstellung statischer und interaktiver Wireframes mit Figma, Sketch, Adobe XD und gängiger Prototyping Software.
  • Designprozesse & Usability: Einsatz von Wireframes zur frühen Evaluation von Navigation, Informationsarchitektur und responsivem Webdesign.
  • Standards & Zusammenarbeit: Integration in UI/UX-Workflows, Austausch im Team und Vorbereitung für Designsysteme und Frontend-Entwicklung.

UI Frameworks & visuelle Strukturmodelle im UX Design
  • Strukturelle Grundlagen: Vermittlung von UI-Komponentenmodellen mit Fokus auf usability, grid design und ui framework.
  • Frameworkbasierte Gestaltung: Einsatz von compose android, android compose und swift ui zur Interface-Entwicklung.
  • Prototyping-Tools: Umsetzung von app wireframe, prototyping software und figma ui im gestalterischen Entwicklungsprozess.
  • Test & Umsetzung: Validierung durch ui test, Integration in frontend-Systeme und Versionsverwaltung mit git.

Im Anschluss an die Weiterbildung können die Teilnehmenden nutzerzentrierte UI-Konzepte entwickeln, Prototypen erstellen und evaluieren. Sie nutzen Figma und weitere Tools, um Designs im Team zu planen und umzusetzen.