Webdesign + UI/UX + Wireframes + Barrierefreiheit
Diese Weiterbildung vermittelt Kenntnisse in der Gestaltung und technischen Umsetzung digitaler Benutzeroberflächen. Der Fokus liegt auf der Erstellung von Wireframes und Prototypen sowie der Anwendung von Webstandards und Barrierefreiheit. Teilnehmer lernen den Einsatz relevanter Tools und Methoden.
Modul 1: Webdesign: Digitale Gestaltung und technische Umsetzung
Modul 2: UX UI Gestaltung für interaktive Systeme
Modul 3: Wireframing in der nutzerzentrierten Gestaltung
Modul 4: Responsive Design für flexible Benutzeroberflächen
Modul 5: Barrierefreiheit und WCAG im UI/UX-Design
Modul 6: User Testing und A/B-Testing im UX-Kontext
Webdesign: Digitale Gestaltung und technische Umsetzung- UI/UX Design und Interface-Gestaltung für strukturierte und funktionale Benutzeroberflächen im Webdesign-Kontext.
- Erstellung von Wireframes und Prototypen mit Figma, Adobe XD und Sketch zur Visualisierung digitaler Webprojekte.
- Technische Umsetzung mit HTML, CSS, Grid Design und Flexbox im Bereich der Frontend Webentwicklung.
- Einführung in WCAG, Style Guides und barrierefreie Webstandards für zugängliche und normgerechte Webseiten.
UX UI Gestaltung für interaktive Systeme- Interface-Grundlagen: Struktur, Nutzerführung und Interface-Gestaltung für responsive Anwendungen und smartphone apps.
- Wireframing & Tools: Erstellung von Wireframes und App Wireframes mit figma ui, sketch und wireframe software.
- UX Methoden: Einsatz von user research, user persona development und customer journey mapping für zielgerichtetes ux design.
- Framework & Designsysteme: Verwendung von ui framework, style guides und wcag-konformen Elementen für barrierefreie Interfaces.
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.
Responsive Design für flexible Benutzeroberflächen- Grundlagen des Responsive Designs: Anpassung von Webseiten und Interfaces an verschiedene Bildschirmgrößen, Geräte und Auflösungen.
- Techniken & Tools: Umsetzung mit HTML, CSS, Flexbox, Grid Design und Breakpoints für Smartphone, Tablet und Desktop-Ansichten.
- Designprozesse & Prototyping: Erstellung responsiver Prototypen in Figma oder Sketch zur Entwicklung mobiler Web- und App-Oberflächen.
- Barrierefreiheit & Usability: Anwendung von WCAG, UX/UI Design und Testing-Methoden zur Optimierung für mobile und barrierefreie Nutzung.
Barrierefreiheit und WCAG im UI/UX-Design- Grundlagen der Barrierefreiheit: Einführung in digitale Zugänglichkeit, WCAG-Richtlinien und nutzerfreundliche Interface-Gestaltung.
- Gestaltungsprinzipien umsetzen: Anwendung von UX Design, Farbkontrasten, Tastaturnavigation und responsivem UI Design für alle Nutzergruppen.
- Tools & Prototyping: Entwicklung barrierearmer Wireframes mit Figma, Sketch oder Adobe XD unter Berücksichtigung aktueller Standards.
- Testing & Optimierung: Einsatz von User Testing, UI Testing und Guidelines zur kontinuierlichen Verbesserung digitaler Barrierefreiheit.
User Testing und A/B-Testing im UX-Kontext- Einführung in Testmethoden: Grundlagen von User Testing, A/B-Testing und Usability-Analysen zur Bewertung digitaler Interfaces.
- Planung & Durchführung: Konzeption von Testabläufen mit User Personas, Wireframes und Customer Journey Mapping in Figma oder Sketch.
- Analyse & Auswertung: Nutzung von Tools zur Datenerhebung, Auswertung von Nutzerverhalten und Ableitung konkreter Designentscheidungen.
- Barrierefreiheit & Standards: Anwendung von WCAG, UI Testing und responsive Design-Prinzipien für zugängliche und testbare Anwendungen.
Am Ende der Weiterbildung beherrschen die Teilnehmenden die Gestaltung und Umsetzung flexibler und barrierefreier Benutzeroberflächen. Sie nutzen Tools wie Figma und Sketch, um interaktive Systeme zu entwickeln und zu testen.
