←  Alle Begriffe
W
Design Systems

Wireframe

Ein Wireframe ist eine reduzierte schematische Darstellung von Seitenstruktur, Inhaltshierarchie und zentralen Interaktionen.

Eng im Zusammenspiel mit Informationsarchitektur und Prototyping dient das Wireframe als strategisches Gerüst zur Festlegung von Layouts, Interaktionspfaden und inhaltlichen Prioritäten. Sein voller Nutzen entfaltet sich durch den konsequenten Einsatz verbindlicher Tokens, zugänglicher Komponenten, verständlicher Dokumentation und deren fortlaufende Pflege.

Weiterlesen

Prototyp

Informationsarchitektur

UX Design

FAQ

Wireframe

Welche Fehler passieren beim Erstellen eines Wireframes häufig?
Typisch sind zu viel Detail, Platzhaltertext statt realer Inhalte und fehlende Berücksichtigung kleiner Bildschirme. Ein Wireframe mit Blindtext verdeckt, ob Überschriften und Texte tatsächlich passen. Realistische Inhalte und eine mobile Perspektive machen das Ergebnis belastbar. Ein kurzer Test mit Beteiligten deckt Lücken auf, bevor Design und Entwicklung beginnen.
Wann lohnt sich ein Wireframe und wann kann er entfallen?
Er lohnt sich bei komplexen Seiten, mehreren Beteiligten oder unklaren Prioritäten. Bei kleinen Anpassungen oder etablierten Design Systems genügt oft direkt der Entwurf in Figma. Kriterium: Ist die Struktur strittig, schafft ein Wireframe Klarheit, bevor Gestaltungsaufwand entsteht. Ein kurzes Skizzieren auf Papier kann bei kleinen Vorhaben genügen.
Worin unterscheiden sich Wireframe, Mockup und Prototyp?
Ein Wireframe zeigt Struktur und Priorität ohne visuelle Details, ein Mockup ergänzt Farben, Typografie und Bildsprache, ein Prototyp macht Abläufe klickbar. Die Reihenfolge folgt der Detailtiefe. Wer zu früh über Visuelles diskutiert, verliert Zeit bei Strukturfragen, deshalb bleibt der Wireframe bewusst grob.