Über diese Vorlage

Talent Collective liefert für eine Agentur oder ein Studio einen fertigen ersten Screen und die Zahlen, die ihn hervorgebracht haben. Die Palette umfasst grau #BAB8B5 darunter, die Schrift ist Geist. Geliefert wird React und Tailwind CSS, erfasst bei 1904x1080, damit der Rahmen feststeht, bevor die erste Zeile Code entsteht. Die Bewegung beschränkt sich auf Übergänge von 700ms und eine Videospur in Schleife. Wenn du ein Briefing zum Thema Landingpage im Bereich Agentur schreibst, starte bei dieser Komposition und tausche nur das Thema aus.

Gemacht für

  • Produktmarketer, die brauchen, dass die Komposition (Landingpage) auch mit 6,5s Video in Schleife hinter dem Text lesbar bleibt.
  • Wer ein Modell mit einem Landingpage-Briefing versorgt, startet mit dem Prompt über 9.583 Zeichen.
  • Gemacht für Content-Leads, die ein Landingpage-Design neu betexten, dessen Headline so lang bleiben muss wie die von Talent Collective.

Was enthalten ist

  • Navigation in einer Zeile. Eine schmale Leiste liegt über der Komposition (Landingpage), die Wortmarke links, die Links in Geist gesetzt, damit die Komposition zuerst als Inhalt und erst danach als Rahmen wirkt. Die Leiste liegt ohne eigene Hintergrundfläche über der Komposition von 1904x1080, damit die Medien darunter bis an den Rand durchlaufen.
  • Nichts davon ist geerbt. Das Briefing nennt die Zahlen: Abstände in 40px-Schritten und 700ms Übergänge. Genau deshalb hält die Komposition zusammen, denn zwischen Schrift und Rahmen liegt keine erfundene Abstandsstufe. Zwischen den genannten Werten gibt es keinen erfundenen Zwischenwert; die Werteliste ist das ganze System.
  • Zahlen dort, wo der Beleg steht. Ein kompakter Zahlenstreifen trägt die Aussagen, die sonst einen Absatz bräuchten, und hält damit die Komposition (Landingpage) davon ab, zur Feature-Liste zu werden. Die Zeile gehört zum ersten Screen und nicht zu einem eigenen Band, was den Beleg nah an der Aussage hält.
  • Spalten, keine Linkhalde. Die Links sind zu Spalten gruppiert, die Wortmarke hat ihren eigenen Block, und das hält einen langen Footer lesbar, statt ihn zu einer Liste zu machen. Die Wortmarke bekommt ihren eigenen Block, was eine lange Linkliste lesbar hält. Gruppiere die Links, statt sie aufzulisten.

Bewegung & Interaktion

Die Zeiten stehen im Briefing

Übergänge sind auf 700ms festgelegt; dieser Wert gilt auch für die Bedienelemente. Ein Wert wird für alle Bedienelemente wiederverwendet, ihr Timing kann also nicht auseinanderlaufen. Bemiss die Rückmeldung exakt.

Eine Schleife, keine Timeline

Der Hintergrundclip läuft 6,5s in 1904x1080 als Endlosschleife, stumm und inline, deshalb bewegt sich die Seite weiter, während die Aufmerksamkeit auf dem Text liegt. Eine Scroll-Bibliothek ist nicht nötig, denn die einzige Hintergrundbewegung ist das Medium selbst. Weil er stumm ist, kann die Schleife unter dem Text laufen, ohne um Ton oder Aufmerksamkeit zu konkurrieren. Dreh oder exportiere in 1904x1080 oder breiter.

Die Reihenfolge im Eintrag Landingpage

Der Preis ist Geduld: Die Seite hält das Detail zurück, das ein scanbares Raster sofort liefern würde. Was sie dafür kauft, ist ein erster Screen, auf dem die Navigation, die Überschrift, die Kennzahlen-Zeile, die Feature-Liste und der Footer nicht falsch gelesen werden können. Ein Leser im Bereich Agentur bekommt das Angebot vor den Optionen.

Was du in Talent Collective zuerst änderst

Vergleich das mit einem leeren Blatt. Hier sind der Rahmen (1904x1080) und Abstände in 40px-Schritten und 700ms Übergänge bereits entschieden, die Arbeit ist also Substitution und nicht Komposition. Substitution ist billiger als Komposition, und darum geht es.

Wie der Eintrag Landingpage umbricht

Einen schmalen Screen kann man nicht durch Verkleinern reparieren. Dieses Briefing behandelt die Änderung in Schrift und Navigation: die Skala ist fließend statt gestuft. Autoplay und Bewegung sind ehrlich behandelt, die Seite kommuniziert also auch ohne sie.

Häufige Fragen

Ist der Prompt zu Talent Collective eine fertige Spezifikation oder ein Ausgangspunkt?

Das Briefing beschreibt den Bau, nicht die Stimmung: Es nennt die Komposition bei 1904x1080, die Abstände und die Bewegungswerte. Das gerenderte Bild dient darin an keiner Stelle als verbindliche Grundlage.

Wie viel von Talent Collective hängt von React und Tailwind CSS ab?

Talent Collective wurde in React und Tailwind CSS gebaut, und der Eintrag nennt das, um die Herkunft zu belegen. Das Briefing beschreibt Positionen, Größen und Zeitwerte, also lässt sich die Seite in jedem Framework nachbauen, das Schrift setzen und Elemente platzieren kann.

Woher stammt das Design von Talent Collective?

Das Briefing ist eine Beschreibung, keine Lizenz zur Weitergabe fremder Dateien. Behalte Struktur und Zahlen, ersetze Medien und Markenzeichen, und nenne die Quelle, wenn ein Kunde fragt, woher das Layout stammt. Die Referenz wurde mit 1904x1080 erfasst.

In Studio nachbauen

Starte mit der Referenz und passe Inhalte und visuelle Details in Studio an.