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

Mit diesem Skill gerendert

Fortschritts-Statistikkarte v1.0.0

Eine große Kennzahl zählt neben einer Beschriftung hoch, eine schmale Fortschrittsleiste füllt sich bis zum Wert, und eine Bildunterschrift blendet ein.

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

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 7-sekündigen Statistik-Moment. Eine große Ziffer zählt bis zu deinem Wert hoch, mit einem Suffix wie %, daneben steht eine Beschriftung, eine schmale Akzentleiste füllt sich im Verhältnis von Wert zu Maximum, und darunter erscheint eine kurze Bildunterschrift. Wert, Suffix, Maximum, Beschriftung, Bildunterschrift und Farben werden in einer kleinen Konfiguration im HTML festgelegt; der Hintergrund ist transparent.

Aktualisiert am 3. Nov. 2026

Das bekommst du

  • Eine 7-sekündige Statistik in 1920×1080 mit transparentem Hintergrund
  • Eine hochzählende Ziffer, Beschriftung, Fortschrittsleiste und Bildunterschrift
  • Ein kleiner Konfigurationsblock für die Werte

Gut geeignet für

  • Umfrage- und Bewertungsergebnisse
  • Meilensteine und Ziele
  • Produktaussagen mit einer Zahl

Nicht geeignet für

  • Mehrere Zahlen auf einmal
  • Zahlen ohne Kontext

Über diesen Skill

Du sagst

/mk-progress-stat Mach eine Fortschritts-Statistik: 94% „Would wear it again“, Bildunterschrift „Maison Vey Ambre Nuit, blind test of 200 people“, über unserer Parfümaufnahme.

Eine starke Zahl kann eine ganze Anzeige tragen. Fortschritts-Statistikkarte zählt sie hoch, zeigt, wie nah sie am Maximum liegt, und gibt ihr eine Beschriftung und eine Bildunterschrift, schlicht genug, um über einer Produktaufnahme zu liegen.

So funktioniert es

  1. Anfrage: Nenne deinem Agenten die Zahl, ihr Suffix und Maximum, eine kurze Beschriftung und eine Bildunterschrift.
  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

  • Wähle eine Zahl mit klarer Bedeutung, etwa 94% würden wieder kaufen.
  • Halte die Beschriftung bei drei oder vier Wörtern.
  • 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.
  • Nutze echte Zahlen, die du belegen kannst.

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
Eine Zahl, ihr Maximum, eine kurze Beschriftung und eine Bildunterschrift.
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 die Zahl auch etwas anderes als ein Prozentwert sein?

Ja. Setz das Suffix auf K, x oder lass es weg und pass das Maximum entsprechend an.

Kann sie auf einem schlichten Hintergrund stehen?

Ja. Sie hat helle und dunkle Textstile für Flächen oder Videoaufnahmen.

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 Maison Vey erstellt haben.

Leitfäden

How to make a money counter animation for a sales milestoneA number that counts up and explodes in green is the most direct way to celebrate a result. How to make one with sound, free, with the Money Counter block.How to make an animated statistic for an adOne strong number can carry an ad. How to count it up with a label, progress track and caption, free, with the Progress Stat Card block.

Ähnliche Skills

Alle ansehen