Workspace de IA open source para criadores que reúne tradução e download de vídeos, geração de imagens e vídeos, narrações e criação de roteiros, com base no Codex CLI.
13,8 mil1,5 milTypeScriptApache-2.0Atualizado ontem
pengchujin/livecanvas
Uma skill de assistente de programação com IA que transforma uma frase em uma capa animada no estilo Live Photo, com gráficos, emojis e linhas do tempo, usando Remotion.
- Estrelas
- 507
- Forks
- 29
- Issues abertas
- 1
- Último commit
- há 11 dias
O que é?
LiveCanvas é uma skill para assistentes de programação com IA, como Codex e Claude Code. A partir de uma frase que descreve um tema, ela pesquisa e verifica fatos, cria um storyboard, renderiza uma animação com Remotion e gera uma prévia junto com os recursos do Apple Live Photo.
O resultado pode incluir imagens, emojis, cenas, linhas do tempo e gráficos, entregues como uma capa com design, um MP4, as fontes dos dados e um projeto editável. No Linux, Windows e macOS, é possível gerar recursos pareados do Apple Live Photo usando Python 3.10+, Pillow e FFmpeg; no macOS, também há uma opção nativa em Swift. As ferramentas atuais produzem vídeos H.264 sem áudio, acompanhados de imagens estáticas JPEG.
A instalação é feita pelo Skills CLI, com a opção de direcioná-la apenas ao Codex. Para executar as animações, são necessários Node.js, Python 3, FFmpeg e fontes adequadas ao conteúdo.
Recursos principais
- 01Transforma uma frase em uma capa animada com um layout elaborado.
- 02Oferece suporte a imagens, emojis, cenas, linhas do tempo e gráficos.
- 03Gera pares do Apple Live Photo no Linux, Windows e macOS.
- 04Exporta prévias em MP4 e projetos editáveis do Remotion.
- 05Instala pelo Skills CLI para o Codex e outros assistentes.
Casos de uso
- Transformar uma tendência de dados, como as temperaturas anuais, em uma capa animada para compartilhar.
- Criar animações explicativas curtas para comparações de produtos ou dados de mercado.
- Gerar versões Live Photo de gráficos para compartilhar pelo iPhone.
Início rápido
- 1
Instale a skill em todos os seus assistentes de IA com o Skills CLI
npx skills add pengchujin/livecanvas --skill livecanvas -g - 2
Instale a skill apenas para o Codex
npx skills add pengchujin/livecanvas --skill livecanvas -g -a codex - 3
Abra um novo chat e insira uma solicitação como o exemplo das temperaturas de Pequim e Xangai do README
Antes de usar
- São necessários Node.js/npm, Python 3, FFmpeg e fontes adequadas para a renderização.
- O assistente precisa ser capaz de pesquisar na web e executar código.
- A saída nativa de Live Photo só tem suporte completo no macOS; em outras plataformas, é usado um método portátil com limitações.
Tópicos
Perguntas frequentes
- O que é livecanvas?
- Uma skill de assistente de programação com IA que transforma uma frase em uma capa animada no estilo Live Photo, com gráficos, emojis e linhas do tempo, usando Remotion. LiveCanvas é uma skill para assistentes de programação com IA, como Codex e Claude Code. A partir de uma frase que descreve um tema, ela pesquisa e verifica fatos, cria um storyboard, renderiza uma animação com Remotion e gera uma prévia junto com os recursos do Apple Live Photo.
- livecanvas é gratuito? Qual é a licença?
- livecanvas é open source sob a licença MIT. Confira os termos da licença antes de usá-lo em produtos comerciais.
- livecanvas ainda é mantido?
- Manutenção ativa. O último commit de livecanvas foi em 10 de out. de 2026.
- Para que posso usar livecanvas?
- Transformar uma tendência de dados, como as temperaturas anuais, em uma capa animada para compartilhar. Criar animações explicativas curtas para comparações de produtos ou dados de mercado. Gerar versões Live Photo de gráficos para compartilhar pelo iPhone.
- Como instalar livecanvas?
- Instale a skill em todos os seus assistentes de IA com o Skills CLI: npx skills add pengchujin/livecanvas --skill livecanvas -g Instale a skill apenas para o Codex: npx skills add pengchujin/livecanvas --skill livecanvas -g -a codex Abra um novo chat e insira uma solicitação como o exemplo das temperaturas de Pequim e Xangai do README
- Onde consigo livecanvas?
- O código-fonte e as instruções de instalação estão no GitHub: https://github.com/pengchujin/livecanvas
Resumo gerado por IA a partir do README do projeto. As estatísticas do GitHub são atualizadas diariamente.
Projetos relacionados
Uma skill de agente que transforma receitas de estilos artísticos e gramáticas de vídeos explicativos em animações feitas por código, dando movimento a pinturas e diagramas.
4,7 mil504JavaScriptMITAtualizado há 5 dias
Toolkit de motion design que permite a agentes de programação, como Claude Code, criar vídeos com Remotion usando cenas guiadas por timeline, revisão visual e um mecanismo de áudio em Python.
49663JavaScriptMITAtualizado há 12 dias
Lista curada de recursos de motion design e cinco skills de agente instaláveis para GSAP, Motion, Remotion, Lottie e Rive, compatíveis com Claude Code, Codex e Copilot.
6920CC0-1.0Atualizado há 7 dias
Uma skill de agente para Claude Code / Codex que transforma a descrição de um produto em um filme de lançamento com qualidade comercial, feito com código, trilha composta e edição por apontar e clicar.
78077JavaScriptMITAtualizado anteontem
Transforma um roteiro escrito em um vídeo explicativo ou demonstração de produto narrados, com voz local, sincronização por palavra e renderização em canvas, tudo comandado por um agente de programação.
61439JavaScriptMITAtualizado ontem