Skip to main content

Kontakt

Was interessiert Sie?

Zurück zum Glossar (W)
Glossar · W

Wireframe.

Ein Wireframe ist ein schematischer Entwurf einer Seite oder eines Screens, der Struktur, Inhalte und Funktionen ohne finale Gestaltung zeigt. Er klärt früh, was wo platziert wird — bevor Farben, Bilder und Feinheiten ins Spiel kommen.

WIGLOSSARDLM Digital

Wireframe — ausführlich erklärt

Ein Wireframe ist der 'Bauplan' einer Website oder App: eine bewusst schlichte, meist graustufige Skizze, die zeigt, welche Elemente wo platziert werden — Navigation, Überschriften, Textblöcke, Buttons, Bildbereiche. Auf Farben, finale Typografie und reale Inhalte wird verzichtet, damit der Fokus auf Struktur, Hierarchie und Nutzerführung liegt.

Wireframes sind ein frühes, günstiges Werkzeug, um Ideen zu klären und Feedback einzuholen, bevor teure Design- und Entwicklungsarbeit beginnt. Man unterscheidet Low-Fidelity-Wireframes (grobe Skizzen, schnell und änderbar) und High-Fidelity-Wireframes (detaillierter, näher am späteren Layout). Sie bilden die Brücke zwischen Konzept und visuellem Design.

Im UX-Prozess von DLM Digital folgen Wireframes auf das User Research und gehen dem UI Design voraus. So stellen wir sicher, dass eine Seite zuerst logisch und conversion-orientiert aufgebaut ist — und erst danach visuell gestaltet wird. Das spart Zeit und führt zu Interfaces, die nicht nur schön sind, sondern funktionieren.

Weiterführende Seite

UX Agentur Zürich

Häufige Fragen zu Wireframe

Ein Wireframe zeigt die Struktur (grau, ohne Gestaltung). Ein Mockup ist die visuell ausgestaltete Version (Farben, Typografie, Bilder), aber statisch. Ein Prototyp ist klickbar und simuliert die Interaktion. Die drei bauen typischerweise aufeinander auf.

Für alles ausser sehr kleinen Seiten lohnen sich Wireframes. Sie verhindern teure Missverständnisse, weil Struktur und Inhalt geklärt sind, bevor designt und entwickelt wird. Gerade bei komplexeren Seiten oder Apps sparen sie viel Zeit und Geld.

Gängige Tools sind Figma, Balsamiq, Sketch oder auch Stift und Papier für erste Skizzen. DLM Digital arbeitet überwiegend in Figma, weil sich Wireframes dort nahtlos zu UI-Designs und klickbaren Prototypen weiterentwickeln lassen.

Bereit für Ihr Projekt?

Wenden Sie dieses Wissen auf Ihre Website an — DLM Digital hilft Ihnen dabei.