Zum Hauptinhalt springen
CutFast CutFast

Kostenlos im Browser

iPhone Duo Mockup

Eine responsive Seite weitet sich beim Klappen vom Außendisplay auf das innere Doppeldisplay. Legen Sie Ihr eigenes Bild oder Video ab, schneiden Sie es zu und exportieren Sie eine MP4.

CutFast als bevorzugte Quelle bei Google hinzufügen So siehst du mehr von CutFast in den Top-Meldungen und in KI-Antworten.
Funktion
Faltbares Telefon-Mockup + MP4
Eingaben
URL · Bild · Video
Ausführungsort
In diesem Tab
Export
MP4 herunterladen

Ein faltbares Mockup, das Ihren Inhalt abspielt

Eigene Medien werden auf eine HTML-Canvas gezeichnet und auf das innere und äußere Display des Duo gelegt. Das Scharnier ist ein Live-Regler, kein GIF. Die Aufnahme exportiert die 3D-Ansicht, während Ihr Inhalt auf dem Glas bleibt.

Features

Ein faltbares Mockup, das Sie wirklich nutzen können

Die Seite ist das Tool. Eigener Inhalt wird auf eine HTML-Canvas gezeichnet, auf die Bildschirme des Duo gelegt und im Browser aufgenommen.

Eigene URL, Bild oder Video

Fügen Sie eine Website ein, und sie öffnet sich in einem iframe auf dem Glas — die Seite bricht beim Klappen vom Außendisplay auf die Breite des Doppeldisplays um. Oder legen Sie eine Datei ab und ziehen Sie sie zum Zuschneiden.

Klappen, das der Hand folgt

Der Regler folgt beim Ziehen im Verhältnis 1:1. Lassen Sie los, und er federt aus der aktuellen Bewegung in die offene oder geschlossene Ruheposition.

Hier eine MP4 exportieren

Nehmen Sie einen Klappzyklus mit Ihrem Inhalt auf den Bildschirmen auf und laden Sie eine abspielbare MP4 herunter. Es wird nichts an eine Renderfarm gesendet.

Für Gerätefilme, nicht für leere Hüllen

Nutzen Sie es, wenn ein Screenshot auf einem stillen Telefon nicht reicht und sich das Scharnier mit der Geschichte bewegen soll.

Produktfilme

Zeigen Sie, wie eine App oder Website auf einem Klapptelefon aufgeht, und exportieren Sie die Einstellung.

Startclips

Legen Sie ein Hochformat-Video ab, klappen Sie das Gerät und behalten Sie dieselbe Datei für Anzeigen oder soziale Netzwerke.

Kunden-Mockups

Legen Sie ein Design-Standbild auf beide Bildschirme, ohne den Browser zu verlassen.

Drei Schritte

Bleiben Sie auf dieser Seite. Nichts zu installieren.

  1. 1

    Demoseite klappen oder eine Datei ablegen

    Der Modus Eigenes startet mit einer responsiven Seite, die sich beim Öffnen des Telefons weitet. Legen Sie ein Bild oder Video ab, um es zuzuschneiden und zu platzieren.

  2. 2

    Das Telefon klappen

    Ziehen Sie den Regler. Er folgt Ihrer Hand; lassen Sie los, und er federt auf oder zu.

  3. 3

    Aufnehmen und herunterladen

    Nehmen Sie einen Klappzyklus als MP4 auf. Die Datei wird im Browser codiert.

Wer ein faltbares Mockup nutzt

Immer dann, wenn ein stiller Geräterahmen für die Geschichte zu leblos ist.

App-Marketing

Zeigen Sie eine Produktoberfläche, die auf einem Klapptelefon aufgeht, ohne einen Kinorender.

Motion-Designer

Legen Sie ein Video ab, klappen Sie im Takt und exportieren Sie die Einstellung.

Gründer unter Zeitdruck

Legen Sie einen Screenshot der Landingpage auf beide Bildschirme und liefern Sie heute einen Clip.

Verwandte Downloads

Brauchen Sie eine Platte mit echten Händen statt eines 3D-Mockups?

Mockup-Begriffe, erklärt

Was ist ein Telefon-Mockup?

Ein Telefon-Mockup ist ein geräteförmiger Rahmen, der einen Screenshot, ein Video oder eine Oberfläche hält, damit das Design im Zusammenhang sichtbar wird. Anders als eine flache Überlagerung als PNG kann ein 3D-Mockup Kamera und Scharnier ändern, während der Bildschirminhalt auf dem Glas bleibt.

Was ist ein Mockup für ein Klapptelefon?

Ein Mockup für ein Klapptelefon ist ein Geräterahmen, dessen Scharnierwinkel ein lebendiger Parameter ist. Geschlossen zeigt es das Außendisplay, offen das Innendisplay. Dieselben Medien lassen sich beim Winkelwechsel auf beide Bildschirme einpassen.

Warum lässt sich nicht jede Website auf eine Canvas zeichnen?

Browser behandeln die Pixel einer anderen Website als privat, solange diese Website keine CORS-Header sendet. Eine fremde Seite auf eine Canvas zu zeichnen würde einem Tool erlauben, diese Pixel zu lesen. Fehlen die Header, ist der redliche Weg, die Einbettung abzulehnen und einen hochgeladenen Screenshot oder ein Video anzunehmen.

Quellen

  • Inhalt anderer Herkunft wird von der Canvas blockiert, sofern die Ressource nicht mit CORS-Headern ausgeliefert wird, damit eine Seite nicht die Pixel einer anderen Website lesen kann.

    MDN — CORS ↗
  • WebCodecs lässt eine Website Canvas- oder VideoFrame-Eingaben im Browser codieren, ohne Einzelbilder an einen Server zu senden.

    W3C WebCodecs ↗

Häufig gestellte Fragen

Fragen Sie uns!

Passende Anleitungen

Möchten Sie den Clip nach dem Export schneiden?

Kürzen, konvertieren und untertiteln Sie die MP4 mit den anderen Browser-Tools von CutFast.