Ein Mockup kommt während der Planung eines Webauftritts zum Einsatz. Mit der Hilfe eines Mockups kannst du deine neue Website sehr schnell und einfach visualisieren und erhältst einen ersten Eindruck von den Funktionalitäten und der Gestaltung deiner Website. Dazu brauchst du nicht eine Zeile Quellcode schreiben, da Mockups entweder auf Papier entworfen oder über sogenannte Mockup-Tools am PC realisiert werden.
Mockup einer Change-Management-Software
Bei einem Mockup tritt das Design der Website in den Hintergrund. Hier geht es einzig und alleine darum, die verschiedenen Elemente deiner Website anzuordnen und somit einen optimalen Userflow zu realisieren. Im Fokus steht dabei die Planung der Interaktionsmöglichkeiten und Funktionen deiner Website.
Man kann sagen, dass es sich bei einem Mockup um ein Grundgerüst der Bedienelemente handelt. Dieses Grundgerüst besitzt keine weiteren Funktionalitäten. Das Mockup ist also nur eine grobe Skizze der zu entwickelnden Seite.
Mockups bauen auf der Struktur eines eventuell vorhandenen Wireframes auf und werden hauptsächlich zu Präsentationszwecken herangezogen. Durch die schematische Darstellung eines Mockups, kannst du dich auf das Wesentliche konzentrieren. Du erhälst viel schneller ein Gefühl dafür, ob deine Ideen umsetzbar sind oder ob am Grundkonzept noch weiter gefeilt werden muss. So bekommst du schon sehr früh ein Feedback und musst nicht mitten im Entwicklungsprozess dein Konzept komplett überarbeiten. Das spart Zeit, Geld und vorallem Nerven.
Unser Tipp: Wenn du nicht nur ein Mockup, sondern auch eine dazu passende Website erstellen möchtest, dann kann ich dir den Homepage Baukasten “Wix” absolut empfehlen! Auch wenn du einen Blog erstellen oder einen Online-Shop aufbauen willst, ist Wix die beste Wahl. Hier findest du eine Auflistung der besten Homepage Baukästen im Vergleich. Sogar kostenlos kann man Wix nutzen (wenn auch mit eingeschränkten Funktionen). Zum Testen reicht das aber allemal aus:)
Lieber Enrico,
danke für deine Infos. Viele Quellen definieren Mockups jedoch nicht als “nur grobe Skizzen”. Es wird meist beschrieben, dass es sich um eine fertige, statische Ansicht handelt:
A mockup is a realistic representation of what the product will look like. The final result can look exactly like the mockup
oder
https://designmodo.com/wireframing-prototyping-mockuping/
Hallo Richard,
vielen Dank für deinen Hinweis. Das ich die Begriffe Mockup und auch Wireframe nicht ganz korrekt beschrieben habe, ist mir auch schon aufgefallen. Ich nehme mir auch immer wieder vor, die beiden Artikel zu überarbeiten. Leider fehlt mir im Moment einfach die Zeit dafür. Das ist übrigens auch der Grund, warum aktuell keine neuen Artikel hier im Blog erscheinen.
Viele Grüße
Enrico