Dein erstes Mockup

Showoff setzt deine Screenshots auf echte Geräte in 3D. Du brauchst dafür einen aktuellen Browser und ein Konto. Kein Designprogramm, keine 3D-Kenntnisse, nichts zu installieren.

Konto anlegen#

Unter Konto erstellen registrieren.
Eine Organisation anlegen, falls du noch keine hast. Das geht im Konto-Menü oben rechts. In der Organisation liegen deine Projekte, auch wenn du allein arbeitest.
Du landest auf „Meine Projekte“, der Übersicht deiner Organisation.

Projekt anlegen#

Auf „Meine Projekte“ klickst du auf „Neues Projekt“. Der Dialog fragt, womit du anfängst.

Wahl	Was du bekommst
Vorlage wählen	Eine fertige Szene als Ausgangspunkt, siehe Mit einer Vorlage anfangen.
Standbild	Eine leere Bühne für ein Bild. Kein Takt, keine Bewegung, kein Ton.
Film	Eine leere Bühne mit Zeitachse. Geräte bewegen sich, die Kamera fährt, darunter liegt Ton.

Achtung

Standbild oder Film legst du beim Anlegen fest, danach lässt sich das nicht mehr umstellen. Aus einem Standbild exportierst du ein Bild, aus einem Film ein Video. Brauchst du beides, leg zwei Projekte an.

Gerät einsetzen#

Im Editor oben links EinsetzenGerät … wählen.
Links nach Art eingrenzen oder oben suchen, etwa nach Pixel.
Rechts stehen das Gerät, seine Maße und die empfohlene Screenshot-Größe. Gibt es mehrere Farben oder Armbänder, wählst du sie gleich hier.
Unten rechts auf den Knopf mit dem Namen des Geräts klicken, etwa „iPhone 17 Pro einsetzen“. Ein Doppelklick auf die Kachel tut dasselbe.

Screenshot drauf#

Das Gerät anklicken. Rechts im Reiter „Objekt“ steht der Abschnitt „Screenshot“.
Auf „Hinzufügen“ klicken. Die Mediathek öffnet sich mit dem Gerät als Ziel.
Eine Datei hineinziehen oder über „Dateien“ wählen. Sie landet im Bestand des Projekts und sofort auf dem Display.

Über dem Abschnitt steht die empfohlene Größe, beim iPhone 17 Pro etwa 1206 × 2622 px. Andere Größen gehen auch. Passt das Seitenverhältnis nicht, wird eingepasst statt beschnitten. Mehr dazu unter Screens und Medien.

Szene einrichten#

Gerät drehen, Kamera bewegen, Hintergrund wählen. Wie der Editor aufgebaut ist, steht unter Der Editor im Überblick. Farben, Licht und Schatten findest du unter Hintergrund, Licht und Schatten.

Exportieren#

Oben rechts auf „Exportieren“. Beim Standbild wählst du PNG oder JPG und die Auflösung, beim Film Format und Bildrate des Videos. Gerechnet wird in deinem Browser, die Datei landet direkt auf deinem Rechner. Die Details stehen unter Bild exportieren und Video exportieren.

Hinweis

Speichern musst du nichts. Jede Änderung geht sofort an den Server, und oben in der rechten Spalte steht dann „Gespeichert“.

Und dann?#

Geräte Alle Modelle, Farben und Armbänder, und wie du sie aufstellst. Animation Geräte fliegen herein, schweben und fliegen wieder hinaus. Vorlagen Fertige Szenen, in die nur noch dein Screen muss. Im Team Leute einladen und gleichzeitig an einer Szene arbeiten.

War diese Seite hilfreich?