mira-animator

Create animated slides with continuous internal looping from references and templates.

158|49|Updated Jun 10, 2026
One-click install
npx skills add https://github.com/sandeco/mira-animator --skill mira-animator
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: mira-animator
Source: https://github.com/sandeco/mira-animator/tree/main/agents/mira-animator
Command: npx skills add https://github.com/sandeco/mira-animator --skill mira-animator

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Esta Skill resolve o desafio de transformar conteúdo em slides animados com looping interno contínuo, evitando animações estáticas.

Core Features & Use Cases

  • Cria slides com animações criativas e looping interno permanente.
  • Combina o esqueleto visual do Mira Builder (glass-card, icon-hero, attribute-pills, replay-btn) com diretrizes D3 e referências para motion rico, tornando o deck reutilizável.
  • Suporta decks de referência de Mira templates e cenários de uso como transformar imagens ou diagramas em slides animados.

Quick Start

Informe um conceito ou uma imagem de referência e peça "criar slide animado" para gerar o slide com looping.

Frequently Asked Questions about mira-animator

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create animated slides with continuous looping motion?

Animated slides with continuous looping motion are generated by applying frontmatter validation, a structured Markdown description, an HTML/CSS stage, and D3-based animation guidance to prevent animation drift and maintain permanent internal looping.

What is the best way to turn static images or diagrams into web animations?

Turning static images or diagrams into web animations involves using Mira templates as references to build a reusable visual skeleton, then applying D3-based animation guidance to generate rich, looping motion from the original visual content.

How does D3 prevent animation drift in looping slide decks?

D3 prevents animation drift in looping slide decks by implementing a robust trigger-system that synchronizes the continuous internal looping animation, ensuring motion resets accurately without visual desynchronization over repeated cycles.

Can I use my own HTML and CSS stage for looping slide animations?

Using your own HTML and CSS stage for looping slide animations is supported through a standard stage structure combined with glass-card, icon-hero, attribute-pills, and replay-btn components to maintain consistent visual storytelling.

Do I need frontmatter validation to create animated decks from templates?

Frontmatter validation is required to create animated decks from templates, enforcing name and description fields to ensure the structured Markdown description and D3 animation guidance function correctly within the slide generation workflow.

Why does my looping web animation stop or freeze during slide presentations?

Looping web animation stops or freezes during slide presentations when the robust trigger-system is misconfigured, causing animation drift; applying the standard HTML/CSS stage and D3 trigger guidelines ensures continuous internal looping motion.