Video-Produzent

Create a 30-second promotional video for prompts.chat

Required Assets

• https://prompts.chat/logo.svg - Logo SVG
• https://raw.githubusercontent.com/flekschas/simple-world-map/refs/heads/master/world-map.svg - World map SVG for global community scene

Color Theme (Light)

• Background: #ffffff
• Background Alt: #f8fafc
• Primary: #6366f1 (Indigo)
• Primary Light: #818cf8
• Accent: #22c55e (Green)
• Text: #0f172a
• Text Muted: #64748b

Font

• Inter (weights: 400, 600, 700, 800)

---

Scene Structure (8 Scenes)

Scene 1: Opening (5s)

• Logo appears
• Logo centered, scales in with spring animation
• After animation: "prompts.chat" text reveals left-to-right below logo using clip-path
• Tagline appears: "The Free Social Platform for AI Prompts"

Scene 2: Global Community (4s)

• Full-screen world map (25% opacity) as background
• 16 pulsing activity dots at major cities (LA, NYC, Toronto, Sao Paulo,
  London, Paris, Berlin, Lagos, Moscow, Dubai, Mumbai, Beijing, Tokyo,
  Singapore, Sydney, Warsaw)
• Each dot has outer pulse ring, inner pulse, and center dot with glow
• Title: "A global community of prompt creators"
• Stats row: 8k+ users, 3k+ daily visitors, 1k+ prompts, 300+ contributors,
  10+ languages
• Gradient overlay at bottom for text readability

Scene 3: Solution (2.5s)

• Three words appear sequentially with spring animation: "Discover." "Share." "Collect."
• Each word in different color (primary, accent, primary light)

Scene 4: Built for Everyone (4s)

• 8 floating persona icons around screen edges with sine/cosine wave floating animation
• Personas: Students, Teachers, Researchers, Developers, Artists, Writers,
  Marketers, Entrepreneurs
• Each has 130x130 icon container with colored background/border
• Center title: "Built for everyone"
• Subtitle: "One prompt away from your next breakthrough."

Scene 5: Prompt Types (5s)

• Title: "Prompts for every need"
• Browser-like frame (1400x800) with macOS traffic lights and URL bar showing "prompts.chat"
• A masonry skeleton screenshot scrolls vertically with eased animation (cubic ease-in-out)
• 7 floating pill-shaped labels around edges with icons:
  • Text (purple), Image (pink), Video (amber), Audio (green), Workflows
    (violet), Skills (teal), JSON (red)

Scene 6: Features (4s)

• 4 feature cards appearing sequentially with spring animation:
  • Prompt Library (book icon) - "Thousands of prompts across all categories"
  • Skills & Workflows (bolt icon) - "Automate multi-step AI tasks"
  • Community (users icon) - "Share and discover from creators"
  • Open Source (circle-plus icon) - "Self-host with complete privacy"

Scene 7: Social Proof (4s)

• Animated GitHub star counter (0 → 143,000+)
• Star icon next to count
• Badge: "The First Prompt Library — Since December 2022" with trophy icon
• Text: "Endorsed by OpenAI co-founders • Used by Harvard, Columbia & more"

Scene 8: CTA (3.5s)

• Background glow animation (pulsing radial gradient)
• Title: "Start exploring today"
• Large button with logo + "prompts.chat" text (gradient background, subtle
  pulse)
• Subtitle: "Free & Open Source"

---

Transitions (0.4s each)

• Scene 1→2: Fade
• Scene 2→3: Slide from right
• Scene 3→4: Fade
• Scene 4→5: Fade
• Scene 5→6: Slide from right
• Scene 6→7: Slide from bottom
• Scene 7→8: Fade

Animation Techniques Used

• spring() for bouncy scale animations
• interpolate() for opacity, position, and clip-path
• Easing.inOut(Easing.cubic) for smooth scroll
• Math.sin()/Math.cos() for floating animations
• Staggered delays for sequential element appearances

Key Components

• Custom SVG icon components for all icons (no emojis)
• Logo component with prompts.chat "P" path
• FeatureCard reusable component
• TransitionSeries for scene management