Alle Premium-Video-Skills in einem Plan. Jederzeit kündbar.Pläne ansehen
Vael · 16:9

Mit diesem Skill gerendert

Specs-Checkliste v1.0.0

Eine linksbündige Specs-Liste: Jede Zeile aus Bezeichnung und Wert gleitet nacheinander herein, darunter zieht eine Akzentlinie durch.

Noch keine Bewertungen 0 Downloads
Format
Video · 16:9
Länge
0:08

Kostenlos Kostenlos mit Konto

Zum Herunterladen anmelden

Füge das in deinen Agent ein. Er verbindet bei Bedarf die CLI und installiert dann den Skill.

Ein kostenloser HyperFrames-Block für einen 8-sekündigen Specs- oder Feature-Moment. Fünf Zeilen aus Bezeichnung und Wert gleiten nacheinander von links herein, jede mit einer Akzentlinie, die sich darunter durchzieht – im hellen Schema für Boards oder im dunklen Schema mit Scrim für Videoaufnahmen. Zeilen, Schema, Linienbreite, Position und Timing stellst du in einer kleinen Konfiguration im HTML ein; der Hintergrund ist transparent.

Aktualisiert am 4. Nov. 2026

Das bekommst du

  • Ein 8-sekündiges Overlay in 1920×1080 mit transparentem Hintergrund
  • Fünf Zeilen, die mit durchziehenden Unterstreichungen hereingleiten
  • Ein helles und ein dunkles Schema mit optionalem Scrim

Gut geeignet für

  • Produktdetailseiten und Anzeigen
  • Feature-Listen für Apps und Gadgets
  • Specs-lastige Kategorien wie Taschen, Schuhe und Elektronik

Nicht geeignet für

  • Mehr als fünf oder sechs Zeilen
  • Lange Sätze

Über diesen Skill

Du sagst

/mk-specs-list Mach eine Specs-Checkliste über unserem Vael-Cerise-Foto: Leather „Cherry calf, hand-finished“, Hardware „Solid brass clasp“, Fits „A 14-inch laptop“, Handles „Hand-stitched, 22 cm drop“, Made „In small, numbered runs“.

Specs überzeugen, wenn sie leicht zu lesen sind. Specs-Checkliste reiht fünf Zeilen aus Bezeichnung und Wert neben deinem Produkt auf, eine nach der anderen und jede mit einer klaren Unterstreichung. So kommen Materialien, Maße oder Features an, während das Produkt im Bild bleibt.

So funktioniert es

  1. Anfrage: Nenne deinem Agenten fünf kurze Paare aus Bezeichnung und Wert und sag ihm, ob der Hintergrund hell oder dunkel ist.
  2. Befüllen: Er trägt deinen Text und deine Farben in die Variablen des Blocks ein und hält die Texte nah an der Länge, für die das Layout gemacht ist.
  3. Rendern: Er rendert mit npx hyperframes render einen Entwurf, prüft ein paar Frames und rendert dann das finale MP4.
  4. Wiederverwenden: Die Variablen liegen in einer kleinen JSON-Datei; die nächste Version ist also nur ein weiterer Render.

Tipps

  • Halte Bezeichnungen bei einem Wort und Werte bei wenigen Wörtern.
  • Nimm das helle Schema über hellen Fotos und das dunkle Schema mit Scrim über dunklen Aufnahmen.
  • Der Hintergrund ist transparent. Render ihn also mit Alphakanal und leg ihn über dein eigenes Video, ein Foto oder eine einfarbige Fläche; die SKILL.md zeigt die beiden Befehle.
  • Lass die rechte Bildhälfte für das Produkt frei.

Open Source

Dies ist ein Block aus der HyperFrames-Registry. Er stammt von HeyGen und den HyperFrames-Mitwirkenden (heygen-com/hyperframes) und steht unter der Apache License 2.0. Der Download ist der Block samt Assets und einer von Reelity geschriebenen SKILL.md, damit dein Agent weiß, wie er ihn befüllt und rendert; HyperFrames selbst läuft über npm.

Was du vorab brauchst

Du lieferst
Fünf Paare aus Bezeichnung und Wert und eine Aufnahme des Produkts.
Abhängigkeiten
Node.js 22 oder neuer — erforderlich · FFmpeg — erforderlich
Externe Kosten
Keine. HyperFrames ist kostenlos und Open Source und rendert auf deinem eigenen Rechner.
Zuletzt getestet
v1.0.0 —

Nutzerbewertungen

Noch keine Bewertungen. Installiere den Skill und bewerte ihn als Erste:r.

FAQ

Kann ich mehr Zeilen hinzufügen?

Ja. Die Zeilen sind eine Liste in der Konfiguration; fünf oder sechs passen bequem hinein.

Ist das über einem unruhigen Foto noch lesbar?

Wähl das Schema, das sich vom Hintergrund abhebt, und verstärke bei Bedarf den Scrim.

Warum ist es kostenlos?

Es ist ein Open-Source-Block für HyperFrames von HeyGen und den HyperFrames-Mitwirkenden. Wir listen ihn unverändert, mit einer SKILL.md, damit dein Agent ihn nutzen kann, und einem Beispiel, das wir mit unserer Hausmarke Vael erstellt haben.

Leitfäden

How to show product specs in a videoSpecs sell when they are easy to read. How to animate a clean specs list next to your product, free, with the Specs Checklist block.

Ähnliche Skills

Alle ansehen