Ein Mock-up ist eine realistische Darstellung eines Entwurfs – die Website oder App in einer Umgebung, die zeigt, wie sie in der echten Welt wirken könnte: auf einem Laptop-Bildschirm, einem Smartphone in der Hand, einem Tablet auf dem Tisch. Mock-ups helfen, das Design zu präsentieren, zu validieren und zu verkaufen. Sie machen aus abstrakten Layouts etwas Greifbares.
Mock-ups entstehen oft in Design-Tools wie Figma, Sketch oder Photoshop, manchmal mit vorgefertigten Vorlagen (Frames, Geräte-Rahmen). Der Inhalt kann Platzhalter sein oder schon der echte Text und die echten Bilder. Wichtig ist die Wirkung: Wie wirkt die Seite im Kontext? Passt die Typografie auf dem kleinen Bildschirm? Wirkt das Logo auf dem dunklen Hintergrund? Mock-ups beantworten solche Fragen, bevor die Entwicklung startet.
Mock-ups sind kein Ersatz für Prototypen oder echte Tests – sie sind statisch. Aber für Pitches, Freigaben und die Kommunikation mit Auftraggebern sind sie unschlagbar. Sie zeigen, wohin die Reise geht, und schaffen ein gemeinsames Bild. In Kombination mit Wireframes und klickbaren Prototypen bilden sie die Brücke zwischen Idee und Umsetzung.
Ein gutes Mock-up ist nah an der Realität: passende Geräteproportionen, realistische Schatten und Perspektiven, keine übertriebenen Effekte. So wird das Feedback zum Design selbst gelenkt – und nicht von der Darstellung abgelenkt.
Das Mock-up macht das Design sichtbar. Es verwandelt Pixel in eine Vorstellung – und die Vorstellung in Zustimmung.