Für Entwickler:innen und Designer:innen ist es wichtig, ihr Produkt schon vor dem ersten Download authentisch in Szene zu setzen und ein Stück weit „greifbar“ zu machen. Das gilt natürlich auch für Wireframes, die einen ersten Eindruck einer Website vermitteln sollen – egal, ob sie nur im Team oder direkt mit Kund:innen geteilt werden sollen. Wenn es schön aussieht, ist es schon schön.

Aber auch Marketer:innen oder Journalist:innen helfen Mockup-Tools, wenn es darum geht, ansprechende Bilder zu kreieren und nicht nur auf langweilige Screenshots zu setzen. Solche den realen Bedingungen nachempfundenen Produktpräsentationen können mithilfe von Online-Tools binnen weniger Minuten und mit wenig Klickaufwand erstellt werden – dafür müsst ihr weder mit Photoshop noch mit anderen Bildbearbeitungsprogrammen umgehen können.

Mockup-Tools gibt es wie Sand am Meer und nicht alle sind gleich. Das beginnt bei der Preisgestaltung: Manche Anbieter erlauben den kostenlosen Download, versehen das Bild aber mit einem Wasserzeichen, das nur gegen eine Gebühr entfernt wird. Wieder andere Mockup-Apps stellen nur einen Teil ihrer Bilder zum Gratis-Download zur Verfügung. Auch in Bezug auf die Geräteauswahl gibt es große Unterschiede – Smartphone-Mockups beinhalten nicht immer iPhone-Mockups oder aktuelle Geräte. Hier lohnt es sich, genauer hinzuschauen. Die meisten Mockup-Tools bieten auch unterschiedliche Designs an – das kann sich auf Gerätefarben beziehen, aber auch auf die Hintergründe. Vom freigestellten Gerät bis zu beruflichen und privaten Hintergrundszenarien sollte für jede:n das Passende dabei sein.

Im Folgenden stellen wir euch die beliebtesten Mockup-Tools vor. Sie alle sind grundsätzlich kostenlos nutzbar – teilweise aber mit eingeschränktem Funktionsumfang.

Placeit ist der Platzhirsch unter den browserbasierten Mockup-Diensten. Wer seine App oder sein Webprojekt stilvoll in Szene setzen will, kommt an der Lösung des Template-Marktplatzes Envato kaum vorbei. Die Auswahl ist riesig und überzeugt durch die Bank mit hoher Qualität. Per Drag & Drop lässt sich jeder Screenshot in ein authentisches Produktbild einbetten. Dabei stehen unterschiedlichste Kontexte vom Café übers Wohnzimmer bis hin zu abstrakten Präsentationsflächen zur Verfügung. Viele Bilder sind in einer Auflösung von 1920 x 1280 Pixeln gratis verfügbar und dürfen auch kommerziell genutzt werden. Auch Videos gibt es auf der Seite Wer druckfähige Auflösungen oder mehr Auswahl bevorzugt, zahlt 9,99 US-Dollar pro Monat.

Besonders praktisch: Der Funktionsumfang von Placeit geht über die reine Mockup-Erstellung hinaus und beinhaltet auch Elemente der Bildbearbeitung. Nutzer:innen können Bildausschnitte croppen oder drehen, Hintergrundfarben anpassen oder Logos und Text einfügen.

Shotsnapp aus Malaysia weiß im Vergleich zu vielen Konkurrenten mit einem durchdachten Design und hochwertiger Präsentation zu überzeugen. Auch technisch kann sich das Tool durchaus sehen lassen: Nutzer können zusätzlich zum Wunschgerät auch einen eigenen Hintergrund wählen, Farben definieren und ihre Mockups sogar mit individuellen Schriftzügen versehen. Grundsätzlich ist Shotsnapp für Nutzer:innen kostenlos. Es gibt jedoch einige wenige Einschränkungen. Wer beispielsweise mehrere Bilder oder Objekte in einem Mockup abbilden will, muss eine Jahreslizenz für 36 Dollar erwerben.

Wer nicht allzu großen Wert auf authentische Produktbilder mit Stockfoto-Charme legt, ist mit Mockuphone an der richtigen Adresse. Der Onlinedienst bettet Screenshots in Smartphone-Gewänder bekannter Hersteller ein. Nutzer:innen wählen das gewünschte Gerät aus und laden die jeweiligen Screenshots einfach per Drag & Drop hoch. Das generierte Produktbild könnt ihr dann in allen Variationen als ZIP-Datei herunterladen – eine Voransicht gibt es allerdings nicht. Der Service ist kostenlos.

Mit einer großen Auswahl ohne anfallende Kosten kann Mockuper überzeugen. Der Dienst bietet neben Smartphone- und Tablet-Mockups auch zahlreiche Vorlagen für Werbetafeln, Fernseher oder Wandbilder. Die Geräte sind nicht immer auf dem neuesten Stand – wer Mockuper nutzen will, sollte also genau hinschauen.

Besonders praktisch: Mockuper hat Vorlagen mit mehreren Devices im Angebot, die alle unterschiedlich „befüllt“ werden können.

Wer nur mal schnell sehen will, wie eine Website auf verschiedenen Apple-Geräten aussieht, sollte zum Multi Device Website Mockup Generator greifen. Nutzer:innen geben einmal die korrekte URL einer beliebigen Website ein und schon erscheint sie in der iMac-, iPhone-, Macbook- und iPad-Vorlage. Der Dienst ist kostenlos.

Wer es etwas abstrakter mag und keinen Wert auf lebensnahe Szenarien liegt, könnte mit Previewed glücklich werden. Nutzer:innen können Apple-Geräte so einfärben, wie sie es sich wünschen – ob es das Device so im Handel gibt, spielt keine Rolle. Hintergründe und Bildausschnitte lassen sich ebenfalls anpassen. Wer mit Previewed arbeiten möchte, muss sich auf der Seite registrieren. Kostenlos können Mockups in einer Auflösung von 720p heruntergeladen werden, die dann unter einer „CC BY 3.0 DE“Lizenz verwendet werden dürfen. Gegen eine Einmalzahlung von sieben Dollar gibt es eine höhere Auflösung, mehr Bearbeitungsmöglichkeiten, Mockup-Videoclips und fünf Downloads. Ab 19 Dollar im Monat kostet es, wenn ihr unbegrenzt viele Mockups herunterladen und Videos mit höherer Framerate erstellen wollt.

Haben wir ein Mockup-Tool in dieser Auflistung vergessen? Sagt es uns in den Kommentaren!

Dieser Artikel wurde am 21. Juni 2024 grundlegend überarbeitet.