guided-launch-announcement

End-to-end guided workflow for creating a product launch or release announcement video. Extracts brand identity from the repo, generates a cinematic soundtrack, and produces a reveal-driven motion.dev composition rendered via Helios CLI. Use when making launch announcements, release videos, or product reveals.

45 stars

Best use case

guided-launch-announcement is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

End-to-end guided workflow for creating a product launch or release announcement video. Extracts brand identity from the repo, generates a cinematic soundtrack, and produces a reveal-driven motion.dev composition rendered via Helios CLI. Use when making launch announcements, release videos, or product reveals.

Teams using guided-launch-announcement should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

  • You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

  • You only need a quick one-off answer and do not need a reusable workflow.
  • You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/launch-announcement/SKILL.md --create-dirs "https://raw.githubusercontent.com/BintzGavin/helios/main/.agents/skills/helios-skills/skills/guided/launch-announcement/SKILL.md"

Manual Installation

  1. Download SKILL.md from GitHub
  2. Place it in .claude/skills/launch-announcement/SKILL.md inside your project
  3. Restart your AI agent — it will auto-discover the skill

How guided-launch-announcement Compares

Feature / Agentguided-launch-announcementStandard Approach
Platform SupportNot specifiedLimited / Varies
Context Awareness High Baseline
Installation ComplexityUnknownN/A

Frequently Asked Questions

What does this skill do?

End-to-end guided workflow for creating a product launch or release announcement video. Extracts brand identity from the repo, generates a cinematic soundtrack, and produces a reveal-driven motion.dev composition rendered via Helios CLI. Use when making launch announcements, release videos, or product reveals.

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

You may be operating inside the brand's repository, or working from an external context.

Do not guess brand identity. Either analyze the codebase or research the provided URL.

------------------------------------------------------------
EXECUTION PIPELINE
------------------------------------------------------------

STEP 1 — Gather Context

⛔ STOP. Ask the user these two questions:

1. "Are we inside your brand's repository, or would you like to provide a URL (e.g. your marketing site) so I can research your brand online?"

2. "Would you like generated background music? If yes, you'll need an ELEVEN_LABS_API_KEY in your environment. You can get one at https://elevenlabs.io → Profile → API Keys."

Wait for the user to respond to both questions.

Do not attempt to read .env files or verify keys yourself.
Trust the user's responses.

If the user provides a URL, use it for brand research in STEP 3 instead of analyzing the codebase.
If the user declines music, skip STEP 4 and STEP 5.


------------------------------------------------------------
STEP 2 — Ensure Helios Runtime Dependencies

Install required packages:

npm install @helios-project/core @helios-project/renderer @helios-project/cli

You will render using DOM mode.

------------------------------------------------------------
STEP 3 — Extract Brand Intelligence From Repo

If the user provided a URL instead of a repo, fetch that URL and extract
the same brand signals from the live site. Skip codebase-specific items
(Tailwind config, design tokens, etc.) and focus on visible brand elements.

Analyze:

• Tailwind config or CSS variables
• Global stylesheets
• Design tokens
• Logo assets
• Favicon
• Changelog or release notes
• Version numbers and release history
• New feature implementations (recent commits, new files)
• Hero sections
• Marketing copy
• Product name and tagline
• Announcement or blog post components
• UI components
• Existing motion usage

Construct internal brand profile:

• Core value proposition
• Target audience
• Tone of voice (exciting, confident, momentous)
• Visual density
• Primary palette
• Accent palette (highlight/celebration colors)
• Typography character
• Product maturity (v1 launch vs iterative release)
• Announcement magnitude (major vs minor)

All creative decisions must align with this.

------------------------------------------------------------
STEP 4 — Generate Original Music (Skip if no music)

Use ElevenLabs with existing ELEVEN_LABS_API_KEY.

Generate instrumental track matching:

• Cinematic build-up energy
• Clear crescendo moment (for the reveal)
• Triumphant resolution
• Target runtime

Save audio locally.

------------------------------------------------------------
STEP 5 — Analyze Audio With ffmpeg (Skip if no music)

Extract:

• BPM
• Beat timestamps
• Downbeats
• Energy peaks
• Crescendo peak timestamp

Create beat timing map.

The reveal moment must land on the crescendo peak.
Feature highlights must align to beats after the reveal.

------------------------------------------------------------
STEP 6 — Read Motion Design Rules

Before producing the creative specification, read and internalize:

skills/guided/motion-design-rules

Every rule in that skill is mandatory for this composition.

------------------------------------------------------------
STEP 7 — Produce Creative Specification

You are a senior creative director and launch event architect designing for Helios using motion.dev.

Input example:
make a 30 second launch announcement for v2.0

Output:

• One structured creative specification
• Wrapped in a single code block
• No explanation outside it

The specification must include:

• Duration
• Aspect ratio (16:9)
• Brand summary
• What is being launched (version, feature, product)
• Motion language (cinematic, dramatic, celebratory)
• Beat synchronized scene breakdown
• Exact timestamps
• Voiceover script (announcement-style, confident)
• On screen text (version number, feature names, tagline, date)
• Visual composition (countdown elements, reveal animations, feature cards)
• Explicit motion.dev animation behavior
• Transition logic (build tension → reveal → celebrate → details)
• Layering order (dark background → particles/atmosphere → text → product reveal → feature cards)
• Audio direction
• Asset requirements

Use motion.dev compatible terminology only.

Launch structure requirements:

• Act 1 — Tension (first 30% of duration)
  Atmospheric build, teaser text, countdown energy
• Act 2 — Reveal (next 20% of duration)
  Product name or version number dramatic reveal on crescendo
• Act 3 — Showcase (next 35% of duration)
  Key features/changes highlighted with rapid-fire cards
• Act 4 — CTA (final 15% of duration)
  Call to action, availability date, brand sign-off

------------------------------------------------------------
STEP 8 — Implement DOM Based Helios Composition

Using the creative specification:

Create a composition.html file that:

• Uses HTML + CSS + motion.dev
• Implements animations using WAAPI / CSS / motion.dev
• Aligns reveal moment to audio crescendo
• Uses dramatic scale and opacity transitions for the reveal
• Includes atmospheric elements (particles, glows, gradients)
• Includes generated audio file
• Has exact duration

Expose Helios runtime:

```js
import { helios } from "@helios-project/core";

window.helios = helios;

helios.bindToDocumentTimeline({
  autoSyncAnimations: true
});
```

Requirements:

• window.helios must be defined
• helios.bindToDocumentTimeline() must be called
• autoSyncAnimations: true must be enabled
• All CSS and WAAPI animations must sync correctly
• No randomness
• Deterministic timing
• Reveal moment must feel impactful — use scale, glow, and flash
• Feature cards must animate sequentially, not simultaneously

------------------------------------------------------------
STEP 9 — Render Using Official Helios CLI (DOM Mode)

Render with:

npx helios render ./composition.html -o output.mp4

Requirements:

• 16:9 aspect ratio
• Correct duration
• Audio attached
• CSS and WAAPI fully synchronized
• High quality MP4 output

Output file must be:

output.mp4

------------------------------------------------------------
RUNTIME RULES
------------------------------------------------------------

If duration ≤ 15 seconds
Skip Act 1. Open with immediate reveal. Show max 2 features.

If no duration specified
Default to 30 seconds.

Maximum 5 feature highlights for any duration.
The reveal moment is the emotional peak — everything builds toward it.
Version numbers and dates must be visually prominent.

Never restate the original prompt.
Never explain reasoning.
Creative specification must be output inside a single code block only.

Related Skills

guided-testimonial-video

45
from BintzGavin/helios

End-to-end guided workflow for creating a social proof or testimonial video. Extracts brand identity from the repo, generates a warm soundtrack, and produces a trust-building motion.dev composition rendered via Helios CLI. Use when making customer testimonial, review highlight, or social proof videos.

guided-social-clip

45
from BintzGavin/helios

End-to-end guided workflow for creating a short-form social media clip (Reels, TikTok, Shorts). Extracts brand identity from the repo, generates a punchy soundtrack, and produces a vertical 9:16 motion.dev composition rendered via Helios CLI. Use when making Instagram Reels, TikTok videos, YouTube Shorts, or other vertical short-form content.

guided-explainer-video

45
from BintzGavin/helios

End-to-end guided workflow for creating an explainer or walkthrough video. Extracts brand identity from the repo, generates a measured soundtrack, and produces a narrative-driven motion.dev composition rendered via Helios CLI. Use when making how-it-works, feature walkthrough, or educational videos.

helios-skills

45
from BintzGavin/helios

Collection of agent skills for Helios video engine. Use when working with programmatic video creation, browser-native animations, or Helios compositions. Install individual skills by path for specific capabilities.

Workflow & Productivity

skill-creator

45
from BintzGavin/helios

Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Claude's capabilities with specialized knowledge, workflows, or tool integrations.

workflow-visualize-data

45
from BintzGavin/helios

Workflow for creating data-driven animations. Use when you need to visualize datasets using D3, P5, or other libraries.

render-video

45
from BintzGavin/helios

Workflow for rendering a Helios composition to a video file. Use when you need to automate video production or export a high-quality animation.

create-composition

45
from BintzGavin/helios

Workflow for creating a new Helios composition. Use when building a new animation project or converting an existing animation to run in Helios.

helios-studio

45
from BintzGavin/helios

Studio tool for developing and previewing Helios compositions. Use when you want to launch the interactive development environment or manage assets.

helios-renderer

45
from BintzGavin/helios

Renderer API for generating video/image output from Helios compositions. Use when you need to programmatically render a composition to a file using Node.js.

helios-player

45
from BintzGavin/helios

Player API for embedding Helios compositions in web pages. Use when you need to display a composition with playback controls, enable client-side exporting, or support Picture-in-Picture.

motion-design-rules

45
from BintzGavin/helios

Motion design framework for programmatic video. Defines anti-slideshow architecture, visual layering, physics-based easing, choreography rules, and quality validation. Reference this skill from any guided video skill.