Communitygithub.com

Eugene-Studio/creativeai-dataviz-skill

Uma skill para Claude que transforma artigos do CreativeAI.fr em visualizações de dados com Chart.js, incorporáveis como blocos HTML no WordPress.

O que é creativeai-dataviz-skill?

Esta skill capacita agentes de IA (como o Claude) a converter automaticamente artigos do blog CreativeAI.fr em visualizações de dados interativas e personalizadas usando a biblioteca Chart.js. Ela é ideal para desenvolvedores, criadores de conteúdo ou equipes de marketing que desejam enriquecer postagens do WordPress com gráficos dinâmicos sem saída manual. A skill analisa o conteúdo do artigo (texto, estatísticas, tendências) e gera o código Chart.js correspondente, formatado como um bloco HTML pronto para ser inserido no editor do WordPress. Isso economiza tempo, elimina erros de codificação e garante que as visualizações fiquem consistentes com o design do site. Suporta as plataformas Claude (Web, Desktop e API) e qualquer ambiente que aceite Chart.js.

Funciona com✓Claude Code~Codex CLI~Cursor
npx skills add Eugene-Studio/creativeai-dataviz-skill

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

O que creativeai-dataviz-skill faz?

Uma skill para Claude que transforma artigos do CreativeAI.fr em visualizações de dados com Chart.js, incorporáveis como blocos HTML no WordPress.

Descrição

Esta skill permite que você pegue qualquer artigo do CreativeAI.fr e o converta automaticamente em gráficos interativos usando Chart.js. O código gerado é formatado como um bloco HTML que pode ser colado diretamente no editor de blocos do WordPress (Gutenberg), facilitando a publicação de visualizações de dados ricas sem nenhum esforço manual de codificação.

Como usar

  1. Obtenha o conteúdo do artigo: Copie o texto ou URL de um artigo do CreativeAI.fr.
  2. Invoque a skill: Use o prompt do Claude com o conteúdo ou link.
  3. Receba o gráfico: A skill retorna o código Chart.js completo, pronto para uso.
  4. Insira no WordPress: Cole o código HTML gerado em um bloco HTML personalizado no editor do WordPress.

Exemplo de Uso

Usuário: "Converta este artigo do CreativeAI.fr sobre tendências de IA em um gráfico de barras." Claude: (Retorna um bloco HTML com Chart.js que mostra as tendências em um gráfico de barras.)

Pré-requisitos

  • Acesso ao Claude (Web, Desktop ou API)
  • Um site WordPress com editor de blocos
  • Conhecimento básico de HTML/JS (opcional, mas ajuda na personalização)

Dependências

  • Chart.js (versão 3.x ou 4.x)
  • WordPress (versão 5.0+ para suporte a blocos HTML)

Suporte

Para dúvidas ou problemas, abra uma issue no repositório oficial.


Criado com ❤️ por Eugene-Studio

Habilidades Relacionadas