Zum Inhalt springen
Leitfaden6 Min. Lesezeit

Figma-Make-Landingpage-Video

Beweisen Sie, dass ein Figma-Make-Ablauf standhält, bevor er oben auf der Seite steht.

Bauen Sie das Video oberhalb des ersten Bildschirmrands für die Landingpage einer Figma-Make-App um einen Ablauf, der auch beim zweiten Besuch funktioniert.

Ansehen, wie es funktioniertDie ersten 60 Sekunden Video sind kostenlos, mit Wasserzeichen. Bestätigen Sie Ihre E-Mail-Adresse, um es herunterzuladen.

Die Landingpage einer Figma-Make-App trägt ein bestimmtes Risiko, das die Landingpage einer handgebauten App nicht hat: Der Ablauf, der in einer Design-Prüfung überzeugend wirkt, könnte eine visuelle Interaktion statt einer vollständig funktionierenden Funktion sein. Bevor dieser Ablauf in das Video oberhalb des ersten Bildschirmrands gelangt, wo er von Fremden beurteilt wird, die entscheiden, ob sie dem Produkt vertrauen, lohnt es sich zu bestätigen, was er genau tut.

GogoScreen baut diese Art von Video aus einer Web-App-URL und einem einzeiligen Hinweis darauf, was gezeigt werden soll, und liefert ein erzähltes, bearbeitetes MP4 mit Klick-Zooms, geglätteter Mauszeigerbewegung, entfernten Stillephasen und eingebrannten Untertiteln. Ein Demokonto kann verwendet werden, wenn der Ablauf hinter einer Anmeldung liegt, obwohl viele Figma-Make-Builds ohne Kontoverwaltung veröffentlicht werden, da sie oft für einen Design- oder Prototypzweck erzeugt werden. Nichts davon garantiert, dass ein erster Renderdurchlauf brauchbar ausfällt. Prüfzeit gehört in den Zeitplan, bevor das Video live geht.

Übersteht die Überschriftenaussage einen zweiten Blick?

Lesen Sie die Überschrift der Landingpage, öffnen Sie dann die App und versuchen Sie die genaue Aktion, die die Überschrift unterstellt. Laden Sie die Seite danach neu und prüfen Sie, ob das Ergebnis noch da ist. Wenn die Überschrift verspricht, dass etwas gespeichert, verfolgt oder erinnert wird, und der zugrunde liegende Build diesen Zustand tatsächlich nicht speichert, muss das Video entweder eine andere Aktion wählen, oder der Seitentext muss überarbeitet werden, damit er zu dem passt, was die App tatsächlich tut. Ein Video kann nicht verantwortungsvoll zeigen, dass etwas funktioniert, wenn der Zustand in dem Moment verschwindet, in dem die Seite neu lädt.

Landingpage-ElementWas das Video bestätigen sollteWas es hier konkret untergräbt
ÜberschriftDie Kernaktion, die tatsächlich geschieht und ein Neuladen überstehtEine rein visuelle Interaktion, die als gespeichertes Ergebnis dargestellt wird
UnterüberschriftJede Einschränkung zu Persistenz oder KontozugangEin Kontoablauf, den der Build tatsächlich nicht enthält
Call-to-ActionEin Ergebnis, das ein neuer Besucher tatsächlich erhalten würdeEin Ergebnis, das nur einmal während des Design-Tests erschien

Die Disziplin, Behauptungen vor der Veröffentlichung zu bestätigen, ist hier nützlich, und sie zählt für einen erzeugten Prototyp noch mehr als für ein handgebautes Produkt.

Wie viel von der Anmeldung sollte sichtbar sein, falls es eine gibt?

Manche Figma-Make-Builds enthalten tatsächlich eine Anmeldung, besonders solche, die als vollständigere Anwendungen statt reiner Prototypen gebaut wurden. Wenn eine Anmeldung existiert, entscheiden Sie, ob ihre Anzeige hilft oder einem kurzen Landingpage-Video nur Reibung hinzufügt. Wenn überhaupt keine Anmeldung existiert, schreiben Sie keinen Hinweis, der eine voraussetzt, denn er wird schlicht nicht zur Route passen.

Verwenden Sie in jedem Fall ein speziell für die Aufnahme angelegtes Demokonto statt einer persönlichen Anmeldung, und niemals die Zugangsdaten eines echten Kunden. Bei GogoScreen werden bereitgestellte Zugangsdaten verschlüsselt, für genau einen Renderdurchlauf verwendet und danach gelöscht, was die genaue und zutreffende Beschreibung dieser Handhabung ist. Wird zuerst ein Storyboard geplant, bleiben die Zugangsdaten für diese Sitzung verschlüsselt und werden spätestens zwei Stunden nach ihrer letzten Verwendung gelöscht.

Was sollte der Eröffnungsbildframe enthalten?

Die ersten zwei bis drei Sekunden tragen oberhalb des ersten Bildschirmrands das meiste Gewicht, da viele Besucher schon vor diesem Punkt entscheiden, ob sie weiterscrollen. Öffnen Sie auf einem Zustand, der bereits wie ein arbeitendes Produkt wirkt, im Voraus vorbereitet, statt bei dem Standardzustand belassen, mit dem der Build startet.

  • Bestätigen Sie, dass die gewählte Aktion einen zweiten Durchlauf übersteht, nicht nur den ersten.
  • Entfernen Sie jeden Platzhalter- oder Lorem-Ipsum-Text, der aus dem Designprozess übrig geblieben ist.
  • Prüfen Sie, dass die sichtbaren Daten wie ein plausibles Beispiel wirken, nicht wie erfundene Füllung.
  • Stellen Sie sicher, dass der Call-to-Action der Seite und das Ergebnis des Videos auf dasselbe Ziel hinweisen.

Wie unterscheidet sich das von einem allgemeinen Demovideo?

Ein allgemeines Figma-Make-Demovideo kann sich mehr Kontext und ein langsameres Tempo leisten, da ein Besucher, der durchgeklickt hat, um es anzusehen, bereits Interesse gezeigt hat. Die Platzierung auf der Landingpage muss kürzer sein und darauf zielen, genau eine Aussage zu beweisen. Den Hinweis für die Landingpage als gekürzte Version des allgemeinen Demo-Hinweises zu schreiben, sobald beide Abläufe als konsistent bestätigt wurden, hält die beiden Assets aufeinander abgestimmt, ohne die Prüfarbeit zu verdoppeln.

Was, wenn Design und funktionierender Build nicht übereinstimmen?

Eine Figma-Make-App trägt manchmal eine sichtbare Lücke zwischen dem, was ein Bildschirm entworfen wurde zu unterstellen, und dem, was die erzeugte Interaktion tatsächlich liefert, da das Werkzeug von einer Designabsicht ausgeht, mit der die Entwicklung nicht immer vollständig Schritt gehalten hat. Wenn diese Lücke während der Bestätigungsprüfung auftaucht, behandeln Sie sie als Information über den aktuellen Zustand des Builds, statt sie herumzuinszenieren. Eine andere Aktion zu wählen, die der Build tatsächlich unterstützt, ist eine bessere Zeitverwendung, als zu versuchen, sozusagen um eine nur halb funktionierende Funktion herumzukamerafahren.

Wenn die Lücke zwischen dem Landingpage-Text und dem Build liegt, statt innerhalb des Builds selbst, ist die schnellere Lösung meist, den Text statt das Video anzupassen. Eine Landingpage-Überschrift, die geschrieben wurde, bevor der Build fertig war, kann von dem abdriften, was tatsächlich ausgeliefert wurde, und ein Video ist ein schlechtes Werkzeug, um über diese Abweichung hinwegzutäuschen, da ein aufmerksamer Besucher die Diskrepanz irgendwann selbst bemerkt.

Was ist die Kurzfassung dieses Prozesses?

  1. Bestätigen Sie, dass sich der gewählte Ablauf beim zweiten Besuch gleich verhält, bevor Sie den Hinweis darauf aufbauen.
  2. Kürzen Sie die aufgenommene Route auf genau die Aktion, die die Überschrift verspricht, ohne etwas Zusätzliches.
  3. Prüfen Sie den fertigen Kandidaten gegen die eigene Überschrift der Seite, bevor Sie ihn oberhalb des ersten Bildschirmrands platzieren.

Was sollten Sie vor der Veröffentlichung oberhalb des ersten Bildschirmrands prüfen?

Spielen Sie das fertige Video neben dem Seitentext ab und fragen Sie, ob jemand, der das Produkt nie gesehen hat, zustimmen würde, dass die Überschrift bewiesen wurde, nicht nur unterstellt. Wenn ein erneuter Versuch nötig ist, ist das normal: Etwa einer von fünf Renderdurchläufen braucht einen. Jedes neue Konto erhält einmalig 60 Sekunden Video mit Wasserzeichen und erforderlicher E-Mail-Bestätigung für den Download, was oft gut zu dieser Platzierung passt. Über die kostenlosen 60 Sekunden hinaus nutzen Videos Zeit aus einem Plan oder einer Aufladung, und Zeit wird nur verbraucht, wenn ein Renderdurchlauf tatsächlich gelingt.

Wo passen die anderen Figma-Make-Seiten hinein?

Sobald das Landingpage-Video steht, braucht derselbe Build meist andere Assets für andere Aufgaben. Ein Product-Hunt-Launch-Video hat eigene Galerievorgaben. Die Übergabe des Builds an einen nicht technischen Prüfer wird im Leitfaden dazu behandelt, wie man ein Figma-Make-Projekt mit einem Kunden teilt. Ein Portfolio-Eintrag möchte meist die laufende Oberfläche für ein anderes Publikum zeigen, und ein Prüfungsrundgang rahmt denselben Ablauf um die Frage, ob der Build das getan hat, worum gebeten wurde.

Für dieselbe Aufgabe auf einer vergleichbaren Ersteller-Plattform behandelt der Leitfaden zum Bubble-Demovideo eine Plattform mit anderen Standardeinstellungen zu Persistenz und Konten, lesenswert, wenn dasselbe Team Ersteller-Plattformen vergleicht. Verwandte Platzierungsleitfäden umfassen den Leitfaden zum README-Produkt-Demovideo, den Leitfaden zum Produktankündigungs-Demovideo, den Leitfaden zum Einbetten eines Produkt-Demovideos, den Leitfaden zum KI-Agenten-Release-Übergabevideo und den Leitfaden zum Demovideo für eine agentengebaute App. Vergleichen Sie direkte URL-Optionen bei GogoScreen im Vergleich zu Screen Studio, prüfen Sie Preise, oder durchsuchen Sie die übrigen Leitfäden und Vergleiche von der Startseite aus.

Klarstellungen

Bevor Sie beginnen

Was gehört oberhalb des ersten Bildschirmrands auf die Landingpage einer Figma-Make-App?

Ein kurzes Video des Ablaufs, der das Überschriftenversprechen am besten beweist, von Hand bestätigt, dass er sich konsistent verhält, und nicht nur beim einmaligen Durchklicken richtig aussieht.

Sollte das Landingpage-Video erwähnen, dass die App mit Figma Make gebaut wurde?

Das ist eine Seitentext-Entscheidung, getrennt vom Video. Die Aufgabe des Videos ist es zu zeigen, dass der Ablauf funktioniert, unabhängig davon, wie die umgebende Seite das verwendete Werkzeug diskutiert.

Wie lang sollte das Video oberhalb des ersten Bildschirmrands sein?

Kurz genug, um vor dem Scrollen angesehen zu werden. GogoScreen gibt jedem neuen Konto einmalig 60 Sekunden Video mit Wasserzeichen, was für diese Platzierung eine sinnvolle Obergrenze ist.

Fügen Sie eine URL ein, beschreiben Sie einen Ablauf und erhalten Sie ein Demovideo Ihrer Webanwendung.

Die ersten 60 Sekunden Video sind kostenlos, mit Wasserzeichen. Bestätigen Sie Ihre E-Mail-Adresse, um das Video herunterzuladen.