Zurück zum Product Cookbook
🚡
Prototyping & visuelles Design
Wireframing
Schnell skizzieren, günstig scheitern, iterieren bevor ein Pixel poliert wird.
Was ist das?
Wireframing erstellt Low-Fidelity-Darstellungen der Seitenstruktur und des Layouts.
Wann einsetzen
Nach Anforderungsdefinition und IA, aber vor dem visuellen Design.
Vorgehensweise
1
Beginnen Sie mit Papier-Skizzen für verschiedene Layouts.
2
Digitalisieren Sie die stärksten Konzepte in Figma oder Balsamiq.
3
Fokussieren Sie auf Inhaltshierarchie und Nutzerflow.
4
Testen Sie Wireframes mit Nutzern.
5
Iterieren Sie vor dem Übergang zu High-Fidelity.
Profi-Tipps
✦
Use real content (not lorem ipsum) whenever possible. It reveals layout problems early.
✦
Annotate wireframes to explain interactive behaviors and edge cases.