Skills Guide

Animation de projecteur lumineux

VérifiéSûr

Génère une animation HTML autonome de projecteur oscillant révélant du texte, avec paramètres configurables.

Télécharger et utiliser
Spar Skills Guide Bot
ContenuDébutant
25/07/2026
Claude CodeCodex
#spotlight#text-reveal#animation#html#glow

Recommandé pour

Claude CodeCodexDesigner UI/UXSEO & contenuProduct managerRédacteur / marketeur

Synthèse automatique

Génère un fichier HTML autonome avec une animation de projecteur oscillant qui révèle du texte.

Points forts

  • Paramètres entièrement personnalisables (texte, angle, vitesse, couleurs).
  • Fichier HTML unique et autonome.
  • Prise en charge d'un fond transparent.
  • Utilisation simple via la ligne de commande.

Limites

  • La sortie est uniquement au format HTML, pas de vidéo ou GIF.
  • Nécessite Python pour exécuter le script.
  • Animation simple (un seul effet).
Quand l'utiliser

Utilisez-le lorsque vous avez besoin d'une animation de révélation de texte élégante pour des présentations, logos ou en-têtes de sites web.

Quand l'éviter

Ne l'utilisez pas si vous avez besoin d'un fichier vidéo, d'animations complexes ou d'effets multicouches.

Analyse de sécurité

Sûr
Score qualité85/100

The skill uses a local Python script to generate a standalone HTML animation. No destructive commands, network requests, or data exfiltration are involved. The bash command only locates the skill directory and runs the script with user-supplied parameters, which are expected to be sanitized by the script. There is no risk of command injection if proper quoting is used.

Aucun point d'attention détecté

Comment cette analyse est faite

Exemples

Customized spotlight reveal
Create a swinging spotlight text reveal animation for 'Hello World' with a swing angle of 30 degrees and a glow opacity of 0.8.
Logo text reveal with brand colors
Generate a light logo reveal animation with text 'MyBrand', golden text on dark background, swinging 45 degrees every 4 seconds.
Transparent background animation
Make a spotlight text reveal HTML for the word 'Vibes' with a transparent background and a lamp scale of 1.5.

description: Generate a swinging spotlight text-reveal HTML animation with configurable text, swing angle, lamp scale, glow, and colors. Use when users ask for 聚光灯扫字动画, spotlight text reveal, light logo reveal, 发光文字揭示动画, or want a reusable HTML animation instead of a static image.

Light Spotlight Render

Workflow

  1. Collect the animation parameters:
    • label_text
    • swing_angle_degrees
    • swing_cycle_seconds
    • lamp_scale
    • glow_opacity
    • mask_color
    • text_color
    • background_color
    • video_width
    • video_height
    • optional output
  2. Resolve the installed skill directory and run scripts/render_light_spotlight.py.
  3. Return the final absolute HTML path printed by the script.

Command

python3 scripts/render_light_spotlight.py \
  --label-text "vibe-motion" \
  --output "out/light-spotlight-vibe-motion.html"

Installed Skill Resolution

Use the installed skill copy, not the source repo checkout:

skill_dir=""
for base in "${AGENTS_HOME:-$HOME/.agents}" "${CLAUDE_HOME:-$HOME/.claude}" "${CODEX_HOME:-$HOME/.codex}"; do
  if [ -d "$base/skills/light-spotlight-render" ]; then
    skill_dir="$base/skills/light-spotlight-render"
    break
  fi
done
[ -n "$skill_dir" ] || { echo "light-spotlight-render skill not found under ~/.agents, ~/.claude, or ~/.codex"; exit 1; }

python3 "$skill_dir/scripts/render_light_spotlight.py" \
  --label-text "vibe-motion" \
  --output "$(pwd)/out/light-spotlight-vibe-motion.html"

Behavior

  • Read assets/light_spotlight_template.html.
  • Replace template placeholders with sanitized parameter values.
  • Keep the SVG spotlight animation self-contained in one HTML file.
  • Default output name is derived from label_text.
  • Preserve the top-vertex lamp scale pivot so the spotlight grows from the lamp tip rather than the swing axis.
  • Allow background_color=transparent for transparent-background workflows.

Output

  • Primary output: a standalone .html animation file.
  • Tell the user to open the HTML file in a browser to preview the animation.
  • If the user wants video output after generating the HTML, suggest rendering it with another tool or browser capture flow rather than rewriting the skill.

Du fichier au premier essai

Le téléchargement contient exactement le contenu affiché sur cette fiche. Cette copie peut différer de la dernière version du dépôt source.

Consulter la source et ses fichiers annexes

Ce téléchargement contient uniquement SKILL.md. Les scripts, références, modèles et dépendances éventuels ne sont pas inclus. Récupérez les fichiers nécessaires depuis la source en conservant leur arborescence avant de poursuivre.

1. Télécharger le fichier

Télécharger SKILL.md

Depuis la racine d’un projet de test, enregistrez le fichier sous .skill-downloads/light-spotlight-animation-mrwakexv/SKILL.md, ou utilisez la commande suivante. Ce dossier sert à examiner la skill avant son installation.

Commande pour macOS/Linux ou WSL : un shell POSIX et curl sont nécessaires. Sous Windows sans WSL, utilisez le bouton de téléchargement et créez le dossier manuellement.

mkdir -p '.skill-downloads/light-spotlight-animation-mrwakexv' && curl --fail --show-error --location 'https://skills-guides.com/api/skills/light-spotlight-animation-mrwakexv/download' --output '.skill-downloads/light-spotlight-animation-mrwakexv/SKILL.md.part' && mv '.skill-downloads/light-spotlight-animation-mrwakexv/SKILL.md.part' '.skill-downloads/light-spotlight-animation-mrwakexv/SKILL.md'

2. Vérifier les prérequis

Lisez SKILL.md avant de l’utiliser. Si le fichier cite des scripts ou services externes, examinez-les et préparez les accès nécessaires dans votre environnement de test.

Aucune section de prérequis reconnue dans ce fichier. Cela ne signifie pas qu’il est autonome : les bibliothèques, outils et accès peuvent être cités ailleurs dans le contenu ou dans le dépôt source.

Les plateformes de la fiche sont des indications du catalogue. Les chemins ci-dessous suivent la documentation des outils ; ils ne prouvent pas que cette skill y a été exécutée. Aucune version minimale de ces outils n’est attestée pour cette fiche.

3. Charger la skill

Le fichier ne fournit pas un en-tête name/description exploitable pour cette procédure native. Le téléchargement reste disponible pour lecture ; utilisez le mode manuel ci-dessous.

Mode manuel ou autre outil : joignez SKILL.md à une conversation, ou ouvrez-le dans un agent capable de lire les fichiers. Ajoutez les ressources annexes nécessaires. Il n’existe pas de dossier universel reconnu par tous les outils.

4. Faire un premier essai

Utilisez une entrée courte et fictive : un endpoint d’API, un petit document ou un brief d’interface. Dans une nouvelle conversation, joignez le fichier ou donnez son chemin à l’agent, puis adaptez cette demande :

Lis .skill-downloads/light-spotlight-animation-mrwakexv/SKILL.md et applique ses instructions à cet exemple : [décrire une entrée de test]. Indique les fichiers, dépendances ou accès qui manquent. Produis le résultat demandé par la skill sans inventer de données ni exécuter de script non examiné.

Résultat attendu : une sortie correspondant aux instructions de la skill, ou une liste précise des prérequis manquants. Une simple confirmation de lecture ne valide pas le premier usage. Si une ressource externe est indisponible, ce parcours reste à tester.

Skills similaires

Fragments d'écriture

Contenu

Extrayez des fragments d'écriture bruts via un entretien intensif, sans imposer de structure. Capturez idées, citations et mots porteurs pour une utilisation ultérieure.

Claude CodebeginnerSûr 240,316
Skills Guide Bot

Rédaction UI et audit

Contenu

Rédigez ou auditez les textes d'interface (boutons, erreurs, états vides, infobulles) dans le monorepo, en suivant la source de vérité du design system.

Claude CodeCursorbeginnerSûr 108,623
Skills Guide Bot

Extraction MIDI/score

Contenu

Extrait le MIDI ou la partition d'une production musicale existante via l'outil MCP CogMusic et confirme la disponibilité du fichier.

Claude CodebeginnerSûr 69,866
Skills Guide Bot