DE

Mockup erstellen

Mockup erstellen in Sekunden: Logo oder Bild hineinziehen, Produkt wählen – das Motiv liegt sofort perspektivisch richtig auf T-Shirt, Tasse, Schild oder Bildschirm, mit Falten und Licht des Fotos. Alles bleibt auf Ihrem Gerät.

Quelle: Heckbert (1989) – Fundamentals of Texture Mapping and Image Warping, UC Berkeley UCB/CSD-89-516 (projektive Abbildung Quadrat → Viereck). Stand: .

Dateien hierher ziehen oder

Logo oder Bild (PNG mit Transparenz ideal, auch JPG, WebP, HEIC), bis 50 MB

Tipp: Bilder lassen sich auch mit Strg + V einfügen.

Ihre Dateien werden nur in Ihrem Browser verarbeitet und nicht hochgeladen – sie verlassen Ihr Gerät nicht.

Produkt
Wird genutzt, solange kein eigenes Bild gewählt ist.

Ihr Mockup

Mockup wird geladen …
    Meine Toolbox

    Ergebnis

    So wird gerechnet

    Kurz gesagt: Ein Mockup ist ein realistisches Vorschaubild, das zeigt, wie ein Logo oder Motiv auf einem echten Produkt aussieht. Dieses Werkzeug setzt Ihr Bild perspektivisch korrekt auf acht Produktfotos – T-Shirt, Hoodie, Tasse, Ladenschild, Visitenkarte, Laptop, Handy und Poster – und übernimmt Falten, Schatten und Glanz des Fotos. Es läuft vollständig im Browser, ohne Konto, Wasserzeichen oder Upload.

    So funktioniert's

    1. Logo oder Bild hineinziehen, auswählen oder mit Strg + V einfügen. Ohne eigenes Bild zeigt das Werkzeug ein Beispiel-Logo aus dem Text, den Sie eintippen.
    2. Produkt antippen. Die Vorschau erscheint sofort.
    3. Größe und Position anpassen. Bei Logos auf weißem Grund „Weißen Hintergrund entfernen“ anlassen, bei Fotos und Screenshots „Ganze Fläche füllen“ einschalten.
    4. „Mockup speichern“ lädt das Bild als PNG oder JPG, „Alle 8 als ZIP“ erzeugt alle Produkte auf einmal – praktisch für Präsentationen, Shops und Angebote.

    So wird gerechnet

    Ebene Flächen wie Schild, Poster oder Bildschirm sind im Foto schräg zu sehen. Aus den vier Eckpunkten der Fläche wird eine projektive Abbildung (Homographie) berechnet, wie sie Paul Heckbert 1989 für das Texture Mapping beschrieben hat. Für jeden Bildpunkt des Fotos rechnet das Werkzeug zurück, welche Stelle Ihres Motivs dort liegt, und mischt die vier Nachbarpixel (bilineare Interpolation) – so entstehen keine Treppen und keine Nähte. Die Tasse ist gewölbt: Hier wird das Motiv um einen Zylinder gelegt, zum Rand hin gestaucht und an Ober- und Unterkante als Ellipsenbogen geführt.

    Damit der Druck echt wirkt, wird er mit der Helligkeit des Produktfotos multipliziert (Füllmethode „Multiplizieren“ nach W3C). Falten im Stoff und Schatten an der Tasse liegen dadurch auch auf dem Motiv; Lichtreflexe auf Keramik bleiben sichtbar. Bildschirme leuchten selbst, dort wird nicht abgedunkelt.

    Ehrliche Grenzen

    Die Produktfotos haben 1024 bis 1216 Pixel Kantenlänge – genug für Webseite, Shop und Social Media, aber kein Druckvorlage-Ersatz. Die Produktfotos wurden für diese Seite lokal mit einem Bildmodell erzeugt und zeigen keine Marken. Ein Mockup ist eine Vorschau: Farben weichen je nach Druckverfahren und Stoff vom Ergebnis ab. Sehr feine Linien im Logo können auf Stoff durch die Falten leicht unruhig wirken.

    Datenschutz

    Ihr Logo wird ausschließlich im Browser verarbeitet und nicht hochgeladen. Gemerkt werden nur die Einstellungen (Produkt, Größe, Text), nicht das Bild.

    Passend dazu: Hintergrund entfernen für Logos ohne Transparenz und Visitenkarten erstellen als druckfertiges PDF.

    Häufige Fragen

    Wie kann ich kostenlos ein Mockup erstellen?

    Logo in das Feld oben ziehen, Produkt wählen und „Mockup speichern“ klicken. Es gibt kein Konto, kein Wasserzeichen und keine Begrenzung der Anzahl.

    Was ist ein Mockup?

    Ein Mockup ist ein Vorschaubild, das ein Design auf einem realen Gegenstand zeigt – etwa ein Logo auf T-Shirt oder Tasse –, bevor etwas gedruckt oder produziert wird. Es dient für Angebote, Online-Shops, Präsentationen und Social Media.

    Brauche ich ein Logo mit transparentem Hintergrund?

    Am besten ja (PNG mit Transparenz). Für Logos auf weißem Grund gibt es die Option „Weißen Hintergrund entfernen“; bei farbigen Hintergründen hilft vorher das Werkzeug „Hintergrund entfernen“.

    Kann ich einen Screenshot auf Laptop oder Handy zeigen?

    Ja. Produkt „Laptop“ oder „Handy“ wählen, Screenshot hineinziehen und „Ganze Fläche füllen“ einschalten. Das Bild wird perspektivisch auf den Bildschirm gelegt; Kamera-Aussparung und Rand des Handys bleiben sichtbar.

    Darf ich die Mockups geschäftlich verwenden?

    Ja. Die Produktfotos wurden für diese Seite selbst erzeugt und enthalten keine Marken Dritter. Für Ihr eigenes Logo und Motiv brauchen Sie natürlich die Rechte.

    Wie mache ich ein Mockup in Photoshop?

    Dort legt man das Logo als Smartobjekt auf das Produktfoto, verzerrt es mit „Perspektivisch verformen“ und stellt die Ebene auf „Multiplizieren“. Genau diese Schritte – Perspektive und Multiplizieren – rechnet diese Seite automatisch.

    Quellen und Rechtsgrundlagen

    Stand: · So prüfen wir

    Passende Werkzeuge