Webdesign-Tools
Ein einzelnes Programm reicht selten aus, um ein Webprojekt vollständig abzuwickeln. In der Praxis arbeiten Designer mit einer Kombination aus Werkzeugen, die jeweils für bestimmte Phasen besser geeignet sind. Dieser Kurs analysiert genau diese Werkzeugkette.
Phasenorientiertes Arbeiten mit spezifischen Programmen
In der frühen Konzeptphase arbeiten viele Designer mit Whimsical oder Miro für schnelle Wireframes. Diese Programme sind bewusst reduziert gehalten – zu viele Gestaltungsoptionen in dieser Phase lenken von strukturellen Entscheidungen ab. Erst wenn die Informationsarchitektur steht, wechseln erfahrene Designer zu Figma oder einem vergleichbaren UI-Werkzeug.
Für die Übergabe an Entwickler kommen zusätzliche Werkzeuge ins Spiel: Zeplin oder der Inspect-Modus in Figma, kombiniert mit Dokumentationswerkzeugen wie Notion oder Confluence. Wer diese Übergabe schlecht organisiert, erzeugt Nacharbeit auf beiden Seiten.
Bildbearbeitung und Asset-Vorbereitung
Vektorgrafiken werden häufig in Illustrator oder Inkscape vorbereitet, bevor sie in das Hauptdesignprogramm importiert werden. Für Fotobearbeitung bleibt Photoshop in vielen Studios Standard, auch wenn Alternativen wie Affinity Photo technisch vergleichbar sind.
Was dieser Kurs nicht ist
Es handelt sich nicht um eine Einführung in einzelne Programme. Teilnehmende sollten bereits Grundkenntnisse in mindestens einem UI-Designwerkzeug mitbringen. Der Fokus liegt auf dem Zusammenspiel der Werkzeuge und auf Entscheidungen, die den Projektverlauf strukturieren.
Was dich im Kurs erwartet
- Phase 1: Konzept und Wireframing – Whimsical, Miro, Papier-Sketches im Vergleich
- Phase 2: UI-Design – Figma als Hauptwerkzeug im professionellen Kontext
- Phase 3: Asset-Vorbereitung – Vektoren, Bildformate, Exportstandards
- Phase 4: Prototyping und Nutzertests – Tools und Methoden
- Phase 5: Entwicklerübergabe – Zeplin, Inspect-Modus, Dokumentationsstandards
- Phase 6: Praxisprojekt – vollständiger Durchlauf eines realen Webprojekts