Über diese Vorlage
Bevor du beim Thema Hero-Bereich für eine Reise- oder Tourismusmarke nachbaust, lies Velora Hero Section: Komposition und Spezifikation stehen beide hier. Die Überschrift der Seite lautet „Rent Your Dream Luxury Car Today“, und die Komposition ist um genau diese Worte gebaut. Die Palette ist schwarz #0A0A0B darunter und weiß #FFFFFF für die Schrift, gesetzt in Archivo. Geliefert wird eine eigenständige HTML-Datei: eine Seite, kein Plugin, kein Build-Tooling zwischen dir und dem Design. Die Bewegung beschränkt sich auf eine Videospur in Schleife. Am nützlichsten ist es, wenn beim Eintrag Hero-Bereich für Reisen ein Textwechsel ohne Redesign möglich bleibt.
Gemacht für
- Gemacht für Agenturen, die Projekte aus dem Bereich Reisen pitchen und eine eigenständige HTML-Datei schon in der ersten Antwort an den Kunden brauchen.
- Übergib eine eigenständige HTML-Datei zusammen mit dem 1500x1080-Zuschnitt an die Entwicklung und lass sie den Rest nachbauen.
- Die Seite richtet sich an Frontend-Entwickler, die ein Hero-Bereich-Design für eine Reise- oder Tourismusmarke in eine eigenständige HTML-Datei nachbauen und die Zahlen hinter der Optik suchen.
Was enthalten ist
- Obere Zeile, eine Aktion. Die Wortmarke hält die linke Kante, rechts davon laufen die Links, alles in Archivo gesetzt, damit die Leiste zur Seite darunter gehört und nicht zu einem eigenen System. Die Leiste liegt ohne eigene Hintergrundfläche über der Komposition von 1500x1080, damit die Medien darunter bis an den Rand durchlaufen.
- Abstände als Werte genannt. Die Liste bleibt kurz (100vh hohe Sektionen und Abstände in 56px-Schritten), deshalb lässt sich das ganze System von Hand prüfen. Die Werte stammen aus dem aufgezeichneten Prompt und sind nicht abgeleitet, deshalb überstehen sie ein erneutes Rendern.
- Obere Zeile: Wortmarke, Links, eine Aktion. Das Mobilmenü ist Teil des Briefings, der eingeklappte Zustand ist deshalb gestaltet und nicht improvisiert. Übernimm dieses Muster, wenn die Navigation einen lauten ersten Screen überstehen soll.
- Gemessen statt geschätzt. Die Abstände sind genauso zitiert (100vh hohe Sektionen und Abstände in 56px-Schritten) und nicht als Skala, die von selbst weiterwächst.
Bewegung & Interaktion
Eine Schleife, keine Timeline
Die Hintergrundbewegung ist ein Clip von 4,9s in 1500x1080, der leise hinter dem Text schleift statt auf den Zeiger zu reagieren. Ein Posterbild springt ein, wenn Autoplay blockiert wird, die Bewegung ist also ein Zusatz und keine Voraussetzung.
Statisch mit Absicht
Das Briefing lässt Animation weg und überlässt die Seite dem 1500x1080-Layout, nur Hover- und Druckzustände ändern sich. Im Briefing steht keine Animationsbibliothek, der Nachbau bleibt also klein.
So wird der Eintrag Hero-Bereich deiner
Fang mit dem Text an, nicht mit der Farbe. Schreib „Rent Your Dream Luxury Car Today“ zu einem Satz über dein Produkt um und setz ihn in Archivo in der Größe, die das Briefing verwendet. Behalt den Medienzuschnitt; er leistet so viel wie die Schrift.
Velora Hero Section als Spezifikation lesen
3.216 Zeichen Briefing ergeben eine vollständige Spezifikation. Der tragende Teil ist kurz: 100vh hohe Sektionen und Abstände in 56px-Schritten. Nichts in diesem Eintrag Hero-Bereich hängt an einer Voreinstellung.
Wie Velora Hero Section den ersten Blick ordnet
Ein feature-getriebenes Layout listet, was das Produkt tut; dieses führt den Leser zu einer einzigen Entscheidung. Die Route zeigen die Navigation, die Überschrift, die Kennzahlen-Zeile und der Hintergrund-Clip, und 100vh hohe Sektionen und Abstände in 56px-Schritten staffeln sie. Ein Leser im Bereich Reisen bekommt das Angebot vor den Optionen.
Häufige Fragen
Ist der Prompt zu Velora Hero Section eine fertige Spezifikation oder ein Ausgangspunkt?
Das erfasste Briefing umfasst 3.216 Zeichen und beschreibt Rahmen, Schriftgrößen-Skala, Palette und Übergänge. Wenn du es kopierst, hast du genau diesen Text; schickst du es an Studio, wird dieselbe Anfrage mit der bereits beschriebenen Seite vorbereitet.
Brauche ich eine eigenständige HTML-Datei, um Velora Hero Section nachzubauen?
Die Referenz ist zufällig in eine eigenständige HTML-Datei gebaut. Im Layout hängt nichts von dieser Entscheidung ab: Abstände, Schrift und Bewegungswerte übertragen sich auf das, was du bereits verwendest.
Was kann ich mit dem Briefing zu Velora Hero Section machen, sobald ich es habe?
Alles, was auf der Seite zitiert wird, stammt aus dem erfassten Briefing mit 3.216 Zeichen und nicht aus einer nachträglich verfassten Beschreibung. Deshalb passen die Zahlen und der Text zusammen.
