S Skillteca
Receber por email
Explorar Categorias Coleções Newsletter
← Voltar para o catálogo

animation-explainer

Outros Autor: AgentBuff

Converte conceitos técnicos, processos ou sistemas em HTML animado 'teatral', com múltiplas cenas, reprodução automática, navegação por capítulos, narração e código real. É ideal para tópicos 'invisíveis, mas essenciais' como protocolos de rede e algoritmos, entregue como um único arquivo HTML sem etapas de construção.

3estrelas
Atualizado há 5 meses
Ver no GitHub ↗ Licença: MIT

Como adicionar

/plugin marketplace add AgentBuff/animation-explainer

O comando exato pode variar conforme o repositório. Confira o README no GitHub.

Para o autor da skill

Cole no README do seu repo

Mostra que sua skill está catalogada na Skillteca, gera backlink e tráfego rastreável.

[![Skillteca](https://www.skillteca.com.br/api/badge/animation-explainer/svg)](https://www.skillteca.com.br/skills/animation-explainer)
#ai

Skills relacionadas

Ver todas de Outros →

slack-gif-creator

153.1k

Conhecimento e utilitários para criar GIFs animados otimizados para o Slack. Fornece restrições, ferramentas de validação e conceitos de animação, sendo útil quando usuários solicitam GIFs para o Slack, como "crie um GIF de X fazendo Y para o Slack".

Outros #ai por anthropics

template-skill

153.1k

Substitua pela descrição da habilidade e quando Claude deve usá-la.

Outros por anthropics

baoyu-compress-image

22.1k

Comprime imagens para WebP (padrão) ou PNG com seleção automática de ferramenta. Use quando o usuário pedir para comprimir imagem, otimizar imagem, converter para webp ou reduzir o tamanho do arquivo de imagem.

Outros por JimLiu

zzz-one-dragon-player

7k

Assistente de jogo automático completo para Zenless Zone Zero, que permite a Agentes de IA automatizar totalmente as rotinas diárias do jogo.

Outros #ai por OneDragon-Anything

Alerta por categoria

Receba novas skills de Outros toda segunda

1 email curto, só com as skills novas de Outros. 4 minutos de leitura, sem spam, cancela com 1 clique.

Você confirma o email no primeiro envio. Sem spam. Cancela com 1 clique.

Ler descrição completa

Animation Explainer · 知识动画化技能

这个技能是什么

输入一个主题（"打开浏览器到屏幕上像素的全过程"、"一个 SQL 查询是怎么被执行的"、"TLS 1.3 握手"、"V8 是怎么编译 JS 的"），输出一份单文件 HTML 动画演示，能在任意浏览器打开播放。

参考实现：examples/browser-request/index.html。任何新主题都从复制这个文件开始，而不是从零写。

它不是什么

  • ❌ 不是幻灯片：每节有 SVG 动画，元素会移动、闪烁、依次出现
  • ❌ 不是单页长滚动信息图：内容被切成离散场景，自动按节奏播放
  • ❌ 不是 PPT 截图导出工具：纯 HTML+SVG+CSS+原生 JS，没有打包步骤
  • ❌ 不是通用 explainer 框架：只解决一类问题 — 多场景剧场式技术解说

核心结构（必须遵守）

文件

  • 单一 index.html，所有 CSS/JS/SVG 内联。零外部依赖（除了 Google Fonts，可选）。
  • 复制 `ex

[Description truncada. Veja o README completo no GitHub.]

Compartilhar X LinkedIn