hermoso
Anmelden Registrieren
MCP & CLI
APIPreise
Anmelden Registrieren

App-UI-Tour

Echte App-Screenshots in einem CSS-iPhone-Mockup (abgerundetes Gehäuse, metallischer Rahmen, Dynamic Island, Displayreflexion), die auf einer weichen markenfarbigen Bühne schweben, während die Tour durch die Bildschirme führt.

Es ist eine von 13 nativen HTML-Anzeigenvorlagen in Hermoso, also Formate, die ein Browser aus echtem Markup rendert statt ein Modell generiert. Diese hier liefert ein Video mit 4 Textfeldern, die du ausfüllst, und sie braucht 2 App-Screenshots aus deiner Marke, bevor sie laufen kann.

Wann man es einsetzt

App-Installationskampagnen und Software-Launches. Es ist die App-Marken-Antwort auf einen Produktfilm und die einzige Möglichkeit, eine Oberfläche zu zeigen, ohne dass ein Modell sie erfindet.

Worauf es ankommt

Die Oberfläche wird aus deinen echten Screenshots als DOM gerendert, also ist sie pixelgenau und lesbar. Zwei Bildschirme sind das Minimum, eine Tour mit einem Bildschirm ist eine statische Anzeige.

Das Format auf einen Blick

  • Ausgabe: ein Video.
  • Textfelder: 4, jedes mit eigenem Zeichenbudget, das aus dem Layout abgeleitet und nicht geschätzt ist.
  • Benötigte Assets: 2 App-Screenshots.
  • Vorlagen-ID: app-ui-tour.

So rendert diese Vorlage

Nichts hier wird von einem Bild- oder Videomodell generiert. Das Format ist eine in sich geschlossene HTML-Seite, deren Animation eine reine Funktion der Zeit ist, ohne CSS-Keyframes, Timer oder Zufall. Der Renderer steppt diese Seite Bild für Bild in einem Headless-Chrome, macht von jedem Bild einen Screenshot und setzt sie mit ffmpeg zu einer H.264-Datei zusammen, die mit einer Überblendung auf deine Markenend-Karte endet.

Daraus folgen zwei Dinge. Der Render ist deterministisch: Dieselben Eingaben ergeben dieselbe Datei, ein Format, das gestern richtig aussah, sieht heute richtig aus. Und jedes Wort auf dem Bildschirm ist echter, im Browser gerenderter Text, also ist der Text exakt und bleibt bei jeder Auflösung scharf. Das Ganze kostet ein paar Credits statt einer Videogenerierung, und genau das macht diese Formate im großen Maßstab praktikabel.

Wie viele Bildschirme braucht eine Tour?

Mindestens zwei. Eine Tour mit einem Bildschirm ist eine statische Anzeige mit einem gezeichneten Telefon drumherum. Die Bildschirme sind deine echten Screenshots, als Browser-DOM in einem CSS-iPhone gerendert, damit die Oberfläche lesbar bleibt statt erfunden zu werden.

Alle 13 stehen im Index der nativen Anzeigenvorlagen, und der weitere Katalog steht im Index der kreativen Rezepte.

Die App-UI-Tour-Vorlage ist von Claude, Cursor, Codex oder jedem anderen MCP-Client aus erreichbar, ebenso wie im Web-Studio, mit derselben Markenbasis. Ein Format über einen Agenten steuern beschreibt die Einrichtung.

Rendere eine Anzeige im nativen Format für ein paar Credits. Für den Free-Plan brauchst du keine Kreditkarte.

Kostenlos starten →   Preise ansehen