Figma UI/UX Design mit WordPress und InDesign – Kurs

Diese Weiterbildung verbindet drei Bereiche der digitalen Mediengestaltung, die im Berufsalltag von UI/UX-Designer/innen häufig zusammenkommen: das Erstellen interaktiver Prototypen in Figma inklusive Echtzeit-Zusammenarbeit im Team, die Umsetzung und Pflege von Webinhalten in WordPress sowie die Gestaltung professioneller Layouts für Digital- und Printmedien mit InDesign. Wer nicht nur Oberflächen entwerfen, sondern diese auch in eine echte Website überführen und für Printmaterialien wie Magazine oder interaktive PDFs aufbereiten möchte, findet hier eine Kombination, die Design, Web-Umsetzung und Layout zusammenführt.

Der erste Modulblock vermittelt die Grundlagen des UI/UX-Designs mit Figma. Im Zentrum steht der Aufbau eines soliden Verständnisses für Benutzeroberflächen, Navigation und die grundlegenden Prinzipien überzeugender Prototypen.

• Aufbau und Struktur von Benutzeroberflächen und Navigationskonzepten
• Grundprinzipien und Best Practices des UI/UX-Designs
• erste Schritte beim Erstellen interaktiver Prototypen in Figma
• Einordnung typischer Anwendungsfälle für Prototyping im Designprozess
• Aufbau eines konsistenten visuellen Grundgerüsts für Projekte
• Feedback-Einholung zu ersten eigenen Entwürfen

Der zweite Modulblock vertieft die Prototyping-Techniken und rückt die Zusammenarbeit im Team in den Mittelpunkt. Hier lernen die Teilnehmenden, wie sich Figma über die reine Einzelarbeit hinaus als kollaboratives Werkzeug einsetzen lässt.

• Arbeiten mit Variants zur Abbildung unterschiedlicher Interface-Zustände
• Einsatz von Auto Layout für flexible, responsive Komponenten
• Nutzung der Echtzeit-Zusammenarbeit für gemeinsames Arbeiten an einem Projekt
• strukturiertes Feedback über Kommentarfunktionen einholen und verarbeiten
• Gestaltung eines vollständigen mobilen App-Interfaces
• Testen und Verfeinern von Prototypen anhand von Nutzerfeedback

Der dritte Modulblock widmet sich Webdesign und Content-Management mit WordPress. Die Teilnehmenden lernen, wie sich zuvor entworfene Oberflächen in eine funktionierende, pflegbare Website überführen lassen.

• Erstellen und Bearbeiten von Seiten und Beiträgen
• Auswahl und Anpassung von Themes für unterschiedliche Projekttypen
• Arbeiten mit dem Gutenberg-Editor zur Inhaltsgestaltung
• Einsatz praxisrelevanter Plugins zur Funktionserweiterung
• Benutzerverwaltung und Rechtemanagement in WordPress-Projekten
• Einbindung von Social-Media-Elementen sowie Aufbau eines E-Commerce-Bereichs mit WooCommerce

Der vierte Modulblock behandelt Grafikdesign und Layout mit InDesign und schließt damit den Bogen von der digitalen Oberfläche zur gedruckten und digitalen Publikation.

• Arbeiten mit Pfaden, Objekten und Effekten in InDesign
• Einsatz von Farben, Farbverläufen und Gestaltungseffekten
• Integration von Textinhalten in komplexe Layoutstrukturen
• Aufbau mehrseitiger Layouts für unterschiedliche Publikationsformate
• Gestaltung interaktiver PDFs für digitale Distribution
• praktische Umsetzung eines Magazin-Covers und einer Magazin-Doppelseite

Über alle vier Modulblöcke hinweg zieht sich der rote Faden vom digitalen Entwurf bis zur fertigen Umsetzung: Ein in Figma entworfenes Interface findet seinen Weg in eine WordPress-Website, während dieselben gestalterischen Prinzipien in InDesign auf Print- und PDF-Formate übertragen werden. Diese Verzahnung unterscheidet die Weiterbildung deutlich von reinen Einzeltool-Kursen. Die praktischen Übungen bauen dabei aufeinander auf, sodass am Ende ein Portfolio entsteht, das sowohl interaktive Figma-Prototypen als auch eine umgesetzte WordPress-Struktur und InDesign-Layoutarbeiten umfasst – ein Nachweis, der die Bandbreite von Design über Web-Umsetzung bis Print abbildet. Gerade der Wechsel zwischen den drei Werkzeugen schärft ein Verständnis dafür, wo die Grenzen des jeweiligen Mediums liegen: Ein Figma-Prototyp simuliert Interaktion, kann aber nicht jede WordPress-spezifische Einschränkung vorwegnehmen; ein WordPress-Theme wiederum folgt anderen Gestaltungsregeln als ein frei skalierbares InDesign-Layout für den Druck. Wer diese Unterschiede früh erkennt, gestaltet von Anfang an realistischer und spart sich spätere Umwege bei der technischen Umsetzung.

Diese Weiterbildung richtet sich an Personen, die eine Tätigkeit in den Bereichen Webdesign, User-Experience-Design oder digitaler Mediengestaltung anstreben oder ihre bestehenden Fachkenntnisse in diesem Bereich erweitern möchten.

• Personen mit Interesse an einem Einstieg in UI/UX-Design oder Webdesign
• Grafikdesigner/innen, die ihre Kompetenzen um Prototyping und Webumsetzung erweitern möchten
• Mediengestalter/innen Digital/Print, die WordPress und InDesign gezielt vertiefen wollen
• Quereinsteigende mit ersten Adobe-Kenntnissen, die sich in Richtung Digital Design orientieren

Die vier Themenblöcke werden praxisorientiert vermittelt, wobei jede Software direkt am eigenen Projekt erprobt wird: Ein Interface-Entwurf in Figma wird über die Kursdauer hinweg weiterentwickelt, in WordPress technisch umgesetzt und in InDesign für Printmaterialien aufbereitet. Die Echtzeit-Zusammenarbeit in Figma wird dabei aktiv im Gruppenkontext geübt, sodass Feedback- und Abstimmungsprozesse nicht nur beschrieben, sondern tatsächlich durchlaufen werden.

Die Weiterbildung ist als mehrteilige Kombination dreier Themenfelder angelegt und entsprechend breiter angelegt als ein reiner Einzeltool-Kurs. Der zeitliche Rahmen berücksichtigt, dass für jeden der drei Bereiche – Figma-Prototyping, WordPress und InDesign – ausreichend Übungszeit zur Verfügung steht, um praxisnahe Ergebnisse zu erzielen.

Die Weiterbildung schließt mit einem trägerinternen Zertifikat bzw. einer Teilnahmebescheinigung ab, die die erworbenen Kompetenzen in Figma-Prototyping, WordPress und InDesign dokumentiert. Eine herstellerseitige Zertifizierung durch Adobe ist damit nicht verbunden.

In vielen kleineren Teams und Agenturen übernimmt eine einzelne Person mehrere Aufgaben zugleich: den Interface-Entwurf, dessen technische Umsetzung auf der Website und die Aufbereitung für Printmaterialien. Genau dieses Kombinationsprofil bildet die Weiterbildung ab, statt die drei Bereiche isoliert zu vermitteln. Besonders wertvoll ist dabei die durchgängige Projektlogik: Ein und dasselbe Interface wird in Figma entworfen, in WordPress lebendig gemacht und in InDesign für zusätzliche Publikationsformate aufbereitet. Diese Verzahnung zeigt Arbeitgebern nicht nur Werkzeugkenntnis, sondern ein Verständnis dafür, wie Design über verschiedene Ausgabeformate hinweg konsistent bleibt. Langfristig eröffnet diese breite Aufstellung Zugang zu unterschiedlichen Rollen zwischen UI/UX-Design, Webdesign und digitaler Mediengestaltung – und erlaubt es Absolvierenden, sich je nach beruflichem Interesse stärker in Richtung Interface-Design, Content-Management oder Printgestaltung zu spezialisieren.