Zielsetzung des Kurses
Der Kurs UI-Design für Web adressiert die Gestaltung und Strukturierung webbasierter Benutzeroberflächen im Kontext digitaler Produktentwicklung. Behandelt werden Konzepte der visuellen Gestaltung, Interaktionsmuster und Informationsarchitektur für Websites und Webanwendungen. Ziel ist die Ausrichtung von Interface-Entscheidungen an Nutzungsanforderungen, gängigen Webstandards und technischen Rahmenbedingungen. Zudem erfolgt die Einordnung in angrenzende Disziplinen wie Frontend-Entwicklung und UX-Research.
Inhalte
Gestaltungsgrundlagen für Weboberflächen mit Fokus auf Layout-Prinzipien, Raster, Typografie, Farb- und Icon-Systeme sowie Zustände und Komponentenbildung auf Basis eines konsistenten UI-Kits
Interaktionsdesign und Navigationskonzepte einschließlich Zustandslogiken, Nutzerflüsse, Barrierefreiheit nach gängigen Richtlinien und Responsive-Verhalten über Breakpoints hinweg
Informationsarchitektur und Content-Strukturierung durch Hierarchiebildung, Muster für Orientierung, Formulare, Fehlermeldungen und Mikrokopie in Oberflächen
Prototyping und Design-Workflow mit Wireframes, Low- bis High-Fidelity-Prototypen, Übergabe an Entwicklung, Versionierung und Dokumentation in Styleguides oder Designsystemen
Designqualität und Evaluation mittels Heuristiken, Usability-Kriterien, UI-Patterns, Feedbackschleifen sowie Vorbereitung und Auswertung einfacher Testszenarien
Technische Rahmenbedingungen des Web wie Komponentenorientierung, Browser-Rendering, Performance-Aspekte, responsive Bilder und Grundzüge von HTML/CSS im Zusammenspiel mit Designvorgaben
Lernziele
- Analysieren von Webseitenoberflächen anhand von Gestaltungsprinzipien, Navigationsmustern und Zustandslogiken
- Unterscheiden von UI-Komponenten, Breakpoints und Interaktionsmustern für responsive Webinterfaces
- Erstellen von Wireframes und Prototypen zur Abbildung von Nutzerflüssen, Formularen und Fehlermeldungen
- Anwenden von Barrierefreiheitskriterien auf Navigation, Kontrast, Fokusführung und Tastaturbedienung
- Entwickeln eines konsistenten UI-Kits mit Typografie, Farben, Icons, Komponenten und Zustandsvarianten
- Integrieren von Designartefakten in den Entwicklungsprozess durch Styleguide-Übergabe und Versionsverwaltung
Berufsperspektiven
Die Kursinhalte finden Anwendung in Berufsfeldern wie UI-Designer für Web, mit Schwerpunkt auf Komponenten, Interaktionen und Layouts in Webanwendungen. Typische Tätigkeitsfelder umfassen UX/UI-Designer in digitalen Produktteams, die Navigationskonzepte, Prototypen und Designsystembausteine erarbeiten. Der Kurs adressiert Inhalte für Tätigkeiten wie Frontend-nahe Designerrollen, die Design-Spezifikationen für Entwicklung aufbereiten und dokumentieren.
Zusammenfassung
Der Kurs UI-Design für Web behandelt die Konzeption und Ausarbeitung von Benutzeroberflächen für Websites und Webanwendungen, inklusive Layout, Interaktion, Informationsarchitektur und Prototyping. Im Rahmen dieser Weiterbildung werden Vorgehensweisen für UI-Kits, Designsystembausteine und Übergaben an Entwicklung thematisiert. Die vermittelten Inhalte knüpfen an Tätigkeitsfelder wie UI-Design, UX/UI-Design und frontendnahe Designerrollen an.