Was ist ein Mockup? Und wie erstellst du eins für dein Logo?

Ein Mockup ist eine realistische Vorschau auf etwas, das es noch nicht gibt. Im Webdesign ist es die fertig gestaltete, aber nicht klickbare Ansicht einer Seite; bei Textilien zeigt es dein Logo auf einem T-Shirt oder Hoodie, damit du Größe, Position und Farbe vor der Bestellung prüfen kannst.

Was ist ein Mockup?

Ein Mockup ist ein Anschauungsmodell, das zeigt, wie ein Entwurf fertig aussehen wird, ohne schon wie das Endprodukt zu funktionieren. Die deutsche Wikipedia beschreibt ein Mock-up oder Mockup als Vorführmodell, das keine vollständige Funktionalität besitzt.

Im Alltag begegnen dir zwei Bedeutungen. Wer Websites oder Apps gestaltet, meint damit eine Bildschirmansicht. Wer Shirts für den Verein, Hoodies für die Firma oder Merch für die eigene Marke bestellt, meint sein Logo auf dem Produkt. Beide folgen derselben Idee: erst anschauen, dann herstellen. In der Architektur gibt es noch eine dritte Spielart, ein Modell im Maßstab 1:1, zum Beispiel ein Stück Fassade, an dem Details, Oberflächen und Farben geprüft werden.

Was ist ein Mockup im Webdesign?

Ein Mockup im Webdesign ist ein statisches, detailgetreues Bild einer Webseite oder eines App-Screens: mit den echten Farben, Schriften, Bildern und Abständen, aber ohne einen einzigen Button, der funktioniert. Davor entsteht der Wireframe, ein grobes Gerüst aus grauen Kästen, das nur festlegt, welcher Inhalt wohin gehört. Danach folgt der Prototyp, durch den du dich klicken kannst wie durch die fertige Seite.

	Wireframe	Mockup	Prototyp
Klärt	wo welcher Inhalt steht	wie das fertige Design aussieht	wie sich die Seite verhält
Zeigt	graue Kästen, Platzhaltertext	finale Farben, Schriften und Bilder	von schlichten Screens bis zum fertigen Look
Klickbar?	meist nicht	nein	ja

Wenn du diese Bedeutung gesucht hast, kennst du jetzt das Wichtigste. Der Rest dieses Ratgebers dreht sich um die zweite: dein Logo auf einem echten Produkt.

Was ist ein Logo-Mockup?

Ein Logo-Mockup ist ein realistisches Bild deines Logos auf dem Gegenstand, für den es gedacht ist: auf einem T-Shirt, einem Hoodie, einer Tote Bag, einer Visitenkarte oder einem Ladenschild. Es entsteht meist aus einem Foto oder einem 3D-Modell, gedruckt wird dabei nichts. Oft ist auch vom Produkt-Mockup die Rede. Für Vereine, kleine Betriebe und junge Modelabels ist es der schnellste Weg, Trikot, Teamshirt oder Merch zu beurteilen, bevor Geld fließt.

Wofür braucht man ein Mockup?

Ein Mockup brauchst du, um teure Fehler zu entdecken, solange sie noch nichts kosten: ein Logo, das zu groß ist, zu tief sitzt oder auf der Stofffarbe untergeht. Drei Aufgaben übernimmt es besonders gut:

1. Größe, Position und Farbe prüfen. Auf dem Bildschirm wirkt ein Logo schnell wuchtig, auf einem Hoodie in XL ist es dann winzig. Und ein dunkelblaues Logo verschwindet auf einem navyblauen Shirt fast ganz.
2. Zustimmung einholen. Der Vereinsvorstand, die Chefin oder ein Kunde sagt schneller Ja zu einem Bild des fertigen Shirts als zu einem Dateinamen.
3. Verkaufen, bevor produziert wird. Wer eine kleine Kollektion startet, kann Mockups zeigen, Vorbestellungen sammeln und erst dann die verkaufte Menge drucken lassen. Kennzeichne die Bilder dabei klar als Vorschau: Das echte Shirt sieht nie ganz genauso aus.

Welche Arten von Mockups gibt es?

Produkt-Mockups gibt es in zwei Arten, als Foto-Mockup und als 3D-Mockup. Beide sind Bilder, sie beantworten aber unterschiedliche Fragen.

• Foto-Mockup: Dein Logo liegt auf dem Foto eines echten Kleidungsstücks, oft im Ghost-Mannequin-Stil (mit einer unsichtbaren Schaufensterpuppe fotografiert, damit das Shirt seine Form behält) oder flach ausgelegt. Gute Foto-Mockups legen das Logo in die Falten und übernehmen Licht und Schatten des Stoffs.
• 3D-Mockup: ein dreidimensionales Modell, das du mit Maus oder Finger drehst, um Vorderseite, Seiten und Rücken zu sehen. So beurteilst du am schnellsten einen kleinen Druck im Nacken oder ein großes Motiv auf dem Rücken.

Kein Mockup im eigentlichen Sinn, aber eng damit verwandt: das Muster, ein echtes Teil aus der Druckerei. Der Unterschied wird wichtig, sobald es ans Bestellen geht.

Was ist der Unterschied zwischen Mockup, Andruck und Muster?

Ein Mockup zeigt, wie dein Entwurf aussehen könnte; ein Andruck oder Proof zeigt, was die Druckerei mit genau deiner Datei herstellen wird; ein Muster ist ein fertiges Teil zum Anfassen. Das Mockup machst du selbst, Andruck und Muster kommen von der Druckerei.

	Mockup	Andruck oder Proof	Muster
Wer erstellt es?	du selbst	die Druckerei	die Druckerei
Grundlage	Foto oder 3D-Modell mit deinem Logo	deine Druckdatei	echter Stoff, echte Farbe
Wofür?	entscheiden	freigeben	bestätigen

Ein Proof ist laut Wikipedia die vorweggenommene Simulation eines Druckergebnisses zur Kontrolle, und ein freigegebener Kontrakt-Proof kann zur rechtsverbindlichen Vorlage für den Auftrag werden. Was du freigibst, wird also so gedruckt. Ein Muster wiederum ist das einzige der drei, an dem du siehst und fühlst, wie Farbe oder Garn auf dem Stoff wirken. Dafür ist es auch das langsamste und teuerste.

Leg Größe, Position und Farbe im Mockup fest und vergleiche den Proof damit, bevor du ihn freigibst. Die Farben auf dem Bildschirm bleiben dabei eine Annäherung, denn Druckfarbe auf Baumwolle leuchtet nie wie ein Display.

Wie erstellst du ein Logo-Mockup kostenlos?

Ein Logo-Mockup erstellst du kostenlos mit einem Mockup-Generator im Browser: Logo auswählen, Produkt und Textilfarbe festlegen, dann Position und Größe einstellen. Mit unserem kostenlosen T-Shirt-Mockup-Generator kannst du ein Mockup erstellen, ohne dich anzumelden und ohne Software zu installieren:

• Produkt: T-Shirt, Hoodie, Sweatshirt oder Tote Bag.
• Textilfarbe: neun Farben von Weiß über Navy und Flaschengrün bis Rosa, dazu jeder beliebige Hex-Code, falls dein Stoff einen ganz bestimmten Ton hat.
• Druckposition: Brust links, Brust mittig, Rücken oder Nacken. Beim Hoodie fehlt der Nacken, weil die Kapuze ihn verdeckt, und die Tote Bag wird nur vorne in der Mitte bedruckt.
• Logogröße: per Schieberegler, bis die Proportionen stimmen.
• Dunkle Stoffe: Ein schwarzes oder dunkles einfarbiges Logo wird auf dunklem Textil automatisch weiß, so wie die Negativ-Version, die Druckereien für dunkle Stoffe verlangen. Unter „Druckfarbe“ stellst du jederzeit selbst Original, Schwarz oder Weiß ein.
• Foto oder 3D: eine realistische Fotoansicht oder die Ansicht „3D 360°“, in der du das Kleidungsstück rundum drehst.

Die Vorschau entsteht direkt in deinem Browser. Das fertige Mockup kannst du teilen oder kostenlos in HD per E-Mail anfordern.

Wie erstellst du ein Mockup in Photoshop?

Ein Mockup in Photoshop erstellst du, indem du dein Logo auf einer eigenen Ebene über ein Produktfoto legst, es an die Form des Stoffs anpasst und es mit einem Mischmodus in das Material einblendest. Bewährt hat sich dafür „Multiplizieren“: Laut Adobes Seite zu den Mischmodi in Photoshop dunkelt dieser Modus Farben ab und behält die Tiefen bei. Auf einem hellen Shirt bleiben die Falten so auch unter einem dunklen Logo sichtbar.

Wer kein passendes Foto suchen will, greift zu einer Mockup-Vorlage: einer PSD-Datei mit Ebenen und einem Platzhalter für dein Motiv, in der Verformung und Schatten schon eingerichtet sind. Du brauchst trotzdem Photoshop oder ein anderes Programm, das PSD-Dateien öffnet. Das fertige Mockup exportierst du meist als JPG oder PNG, damit du es verschicken, posten oder in deinen Shop stellen kannst.

Darfst du kostenlose Mockup-Vorlagen kommerziell nutzen?

Kostenlose Mockup-Vorlagen darfst du nur dann kommerziell nutzen, wenn ihre Lizenz es erlaubt: Manche sind ausschließlich für private Projekte freigegeben, andere verlangen, dass du den Urheber nennst. Bei Vorlagen unter einer Creative-Commons-Lizenz verrät das Kürzel, was erlaubt ist: NC bedeutet, dass das Werk nicht für kommerzielle Zwecke verwendet werden darf, BY verlangt die Namensnennung.

Lies die Bedingungen auf der Download-Seite, bevor ein Mockup in deinem Onlineshop, auf Instagram oder im Angebot für einen Kunden landet. Die Lizenz betrifft dabei die Vorlage, also Foto und Ebenen, nicht dein eigenes Logo.

Was braucht dein Logo für ein gutes Mockup?

Ein gutes Mockup beginnt mit einer guten Logodatei: scharf, ohne Hintergrund und in realistischer Größe. Fünf Punkte solltest du prüfen, bevor du dem Bild traust:

1. Eine Vektordatei. Eine Vektordatei speichert dein Logo als Formen (Pfade) statt als Raster aus winzigen Farbquadraten und bleibt deshalb in jeder Größe scharf. Ein kleines JPG, über die ganze Brust gezogen, wirkt schon im Mockup unscharf und auf dem Shirt erst recht. Wie aus einer Pixelgrafik eine Vektordatei wird, erklärt unser Ratgeber zum Vektorisieren.
2. Genug Pixel, falls du nur eine Pixelgrafik hast. Ein Bild mit 1.000 Pixeln Breite reicht bei 300 dpi für etwa 8,5 cm Druckbreite (1.000 ÷ 300 × 2,54). Für andere Maße rechnet es dir der Rechner Pixel in cm aus.
3. Kein Hintergrund. Ein Logo mit weißem Hintergrund bringt auf jedem farbigen Shirt ein weißes Rechteck mit. Unser Generator blendet einen weißen oder sehr hellen Hintergrund in der Vorschau aus (die Option „Weißen Hintergrund entfernen“ ist voreingestellt): Ein sauberes Mockup beweist also nicht, dass deine Datei keinen Hintergrund hat.
4. Die echte Größe. Stell das Logo so groß ein, wie du es bestellen willst, nicht so, wie es auf dem Bildschirm am besten wirkt, und frag deine Druckerei nach der größten Druckfläche für dieses Kleidungsstück.
5. Druckbare Farben. Jede zusätzliche Farbe macht den Druck aufwendiger, vor allem wenn du dein Logo im Siebdruck auf Textil bringen willst, wo eine Farbe nach der anderen gedruckt wird. Auf dunklem Stoff brauchst du außerdem eine helle Version deines Logos.

Woher bekommst du die weiße Version deines Logos für dunkle Shirts?

Die weiße Version deines Logos für dunkle Shirts bekommst du kostenlos bei Depixelise: Das Tool zeichnet dein Logo als Vektordatei neu und legt eine Negativ-Version für schwarze, navyblaue oder flaschengrüne Stoffe dazu. Das Ganze ist 100 % kostenlos, du brauchst kein Konto, und auf den Dateien landet kein Wasserzeichen.

Du lädst ein PNG, JPG, WebP oder SVG bis 10 MB hoch, und nach etwa zehn Sekunden erscheint das neu gezeichnete Logo in Großansicht, und du kannst hineinzoomen. Den Hintergrund entfernt das Tool automatisch. Per E-Mail bekommst du das Druckpaket mit vier Dateien: die SVG-Datei für die Druckerei, ein freigestelltes PNG (2.000 px, transparenter Hintergrund), das du direkt in den Mockup-Generator ziehen kannst, eine einfarbige Version und die Negativ-Version. Ist dein Ausgangsbild sehr klein, wird es zuerst vergrößert und seine Formen werden neu aufgebaut: Vergleiche die Buchstaben mit deinem Original. Depixelise druckt selbst nichts: Es bereitet deine Datei für die Druckerei vor.

FAQ

Schreibt man Mockup oder Mock-up?

Beide Schreibweisen sind richtig: Der Duden empfiehlt „Mock-up“ mit Bindestrich und führt „Mockup“ als Variante. Das Wort ist sächlich, es heißt also das Mock-up, im Plural die Mock-ups, und kommt vom englischen „to mock up“, nachbilden.

Kann ein Mockup zeigen, wie eine Stickerei aussieht?

Ein Mockup zeigt, wo eine Stickerei sitzt und wie groß sie wird, aber ein flaches Bild gibt weder das Relief der Stiche wieder noch verrät es, ob feine Schrift im Garn lesbar bleibt. Bitte deshalb den Stickbetrieb um ein gesticktes Probestück, bevor die ganze Bestellung läuft.

Macht die Druckerei ein Mockup für dich?

Eine Druckerei macht nicht immer ein Mockup für dich: Manche schicken mit dem Angebot eine schnelle Vorschau, andere erst kurz vor der Produktion die Ansicht zur Freigabe. Frag schon bei der Angebotsanfrage danach. Kommst du mit deinem eigenen Mockup, stehen Größe, Position und Textilfarbe schon fest, und die Abstimmung bleibt kurz.

Kann man ein Mockup auf dem Handy erstellen?

Ja, ein Mockup lässt sich auch auf dem Handy erstellen, solange der Generator im Browser läuft und nichts installiert werden muss. In unserem Tool braucht die 3D-Ansicht einen aktuellen Browser; auf einem älteren Smartphone nutzt du einfach die Fotoansicht.