Spezialgebiet · Wireframing
Wireframing: erst die Struktur, dann das Design.
Mit Wireframes skizzieren wir eine Seite oder Website schematisch, ohne Farben oder Fotos. So besprechen Sie mit Zentrale, Standorten und Webentwickler zuerst, was wo stehen soll, bevor gestaltet und gebaut wird.
Wann
Zeit für Wireframing, wenn …
- Sie eine neue Website oder Standortseite bauen lassen
- Diskussionen über das Design an Farben und Fotos hängen bleiben
- der Weg von der Marke zum Standort nicht logisch wirkt
- Webentwickler und Marketing nicht dasselbe vor Augen haben
Was wir tun
Von der Customer Journey zur Blaupause für den Bau.
- 01
Customer Journey
Wir erfassen, welche Schritte ein Besucher geht, vom Suchergebnis bis zum Termin am Standort.
- 02
Wireframes
Pro Seitentyp erstellen wir einen schematischen Entwurf mit den Elementen, die den Besucher weiterbringen.
- 03
Abstimmung
Wir sammeln Feedback und sorgen dafür, dass Design und Entwicklung mit derselben Blaupause weiterarbeiten.
Was Wireframing ist
Ein Wireframe ist die Blaupause einer Seite.
Ein Wireframe ist eine vereinfachte Darstellung einer Website, App oder eines anderen digitalen Produkts. Es zeigt Struktur und Aufteilung: welche Blöcke es gibt, in welcher Reihenfolge und ungefähr wie groß. Farben, Schriften und Fotos lassen Sie bewusst weg.
Das macht das Gespräch besser. Sie sprechen darüber, was der Besucher braucht und wo es stehen soll, nicht über den Farbton eines Buttons. So erfassen Sie, welche Elemente den Besucher in der Customer Journey weiterbringen und wo sie hingehören.
- Wireframe: Struktur und Aufteilung, ohne Gestaltung
- Mock-up: dasselbe, aber mit Farben, Bildern und Typografie
- Prototyp: ein klickbares Modell, mit dem Sie die Funktion testen können
Wireframing und UX
Wireframing als Teil von UX und CRO.
Wireframing ist ein fester Bestandteil unserer UX-Arbeit. Mit einem Wireframe erfassen wir die Struktur der Website und die Wege der Besucher. Es hilft, Feedback zu sammeln und Marketing und Entwicklung auf eine Linie zu bringen.
Für ein Franchisesystem erstellen wir meist Wireframes für einige Vorlagen, die überall wiederkehren: die Startseite, die Standortsuche, die Standortseite und die Leistungs- oder Produktseite. Jeder Standort profitiert dann vom selben durchdachten Aufbau, mit Raum für lokale Inhalte innerhalb der Markenrichtlinien.
Teil von
Jedes Fachgebiet arbeitet für das gesamte Franchisesystem.
Dieses Fachgebiet ist Teil von Hybrid und On-demand und wird für die Marke und für jeden Standort eingesetzt. Kein Franchisesystem, aber trotzdem eine Frage? Dann können Sie es auch einzeln buchen.
Weitere Fachgebiete
Häufige Fragen
Fragen zu Wireframing.
Was ist der Unterschied zwischen Wireframes, Mock-ups und Prototypen?
Ein Wireframe zeigt die Struktur. Ein Mock-up fügt die Gestaltung hinzu. Ein Prototyp ist ein interaktives Modell, in dem Sie klicken und die Funktion testen können.
Wie detailliert sollte ein Wireframe sein?
Detailliert genug, um Aufteilung und Funktion zu verstehen, aber ohne grafische Details. Der Fokus liegt auf der Struktur und dem nächsten Schritt für den Besucher.
Wer nutzt Wireframes?
Webdesigner, UX-Designer, Entwickler und Projektleiter. Bei einem System auch die Zentrale, damit alle dasselbe Bild haben, bevor der Bau beginnt.
Mit welchen Tools erstellt man ein Wireframe?
Es gibt viele Tools, etwa Balsamiq, Sketch, Adobe XD und Miro. Für das Ergebnis spielt das Tool kaum eine Rolle. Es geht um die Entscheidungen, die Sie darin festhalten.
Erst ein gutes Gespräch, dann ein Plan.
In einer Stunde besprechen wir, wo Sie stehen und welche Chancen wir sehen. Passt es nicht, sagen wir das auch.