106.9K+Baixar
Ir para o guia de uso
text-to-lottiepor diffusionstudio

Text to Lottie Skill.

Crie e corrija animações Lottie com base em um player real, não apenas em um JSON válido. Text to Lottie trabalha com a prévia local Skia Skottie do repositório e expõe valores importantes como controles editáveis.

  • Lottie
  • Motion
  • Skottie
Baixar OpenDesignVer guia de uso
Análise da fonte · text-to-lottieSKILL.md
Tarefa Crie e edite JSON de animação Lottie. Entregáveis • lottie.json de uma cena • Controles editáveis opcionais • Revisão quadro a quadro no player local Antes de começar Use o projeto original do player e forneça as fontes ou artes necessárias à cena.
Resumo editorial · fonte revisada em 2026-11-02 · não é demonstração renderizada

01 Funcionalidades

Crie uma animação que o player realmente consiga renderizar

A fonte conecta a criação da animação ao player Skottie local oficial. Validar JSON é uma verificação, não prova de que a cena está visualmente correta.

Fluxo de trabalho baseado na fonteNão é um benchmark de execução

A abordagem de trabalho

A skill escreve o lottie.json da cena e, quando necessário, controls.json dentro do projeto do player. Seleciona uma receita principal para a tarefa e lê somente referências adicionais necessárias para fontes, conversão SVG, estrutura da animação ou controles.

A edição começa pela definição da cena de destino. Um caminho explicitamente fornecido tem prioridade sobre uma rota do navegador ou contexto descoberto. Antes de modificar um arquivo existente, o agente deve relê-lo, pois valores editados pelo player podem ser gravados no mesmo JSON.

Entregas esperadas

  • Uma cena JSON Lottie no projeto e diretório de cena escolhidos.
  • Controles opcionais com rótulos para valores ajustáveis da animação.
  • Revisão de quadros representativos no player Skottie local.
Ver o briefing de exemplo

Do briefing à revisão

  1. 01
    Defina a cena

    Escolha explicitamente projeto e cena antes de escrever. Use descoberta para encontrar contexto, não como permissão para sobrescrever animação não relacionada.

  2. 02
    Escolha receita e recursos

    Identifique a tarefa e forneça arquivos SVG ou fontes. Para logos, loaders e sobreposições, a fonte usa fundo transparente por padrão.

  3. 03
    Exponha valores que mudarão

    Use slots e controles para valores editáveis importantes, com rótulos e intervalos úteis. Um fundo de quadro inteiro precisa de cor de fundo editável.

  4. 04
    Inspecione quadros reais

    Valide o JSON, abra o player local e inspecione os quadros inicial, intermediário e último visível. Confira recursos ausentes, recorte, ordem de camadas e timing.

02 Quando usar

Quando usar

Este fluxo depende do projeto local do player de origem. Fontes e arte importada precisam estar disponíveis nesse projeto; outros runtimes Lottie podem se comportar de forma diferente.

Bom encaixe

  • Motion de marca editávelAdequado a revelações de logo ou loaders cujas cores e timing serão revisados após a primeira versão.
  • Correção de uma cena existenteÚtil quando a animação JSON carrega, mas há fontes ausentes, arte recortada ou ordem incorreta de camadas no Skottie.

Limites a verificar

  • Não garante todos os playersAs instruções miram o player Skottie local oficial. Inspecione outro runtime de destino antes de prometer renderização idêntica do mesmo arquivo.
  • Recursos não são incluídos automaticamenteTexto precisa de arquivos de fonte utilizáveis e metadados correspondentes. Arte SVG importada ainda precisa de normalização e inspeção visual.

Traga estas entradas

  • Cena de destinoInforme os caminhos do projeto e da cena e diga se cria uma nova cena ou edita uma existente.
  • Arte e arquivos de fonteForneça SVG ou logo autorizado e fontes necessárias. Declare quais formas ou textos devem continuar editáveis.
  • Briefing de motionEspecifique duração, tamanho da tela, transparência, comportamento de loop e valores a ajustar depois.

03 Decisões importantes

Decisões importantes

  1. Arquivo válido ainda pode ser cena vazia

    A fonte exige inspeção no player real além da validação JSON. Parsing bem-sucedido não detecta toda fonte ausente ou camada invisível.

  2. O último quadro visível vem antes de op

    O ponto de saída do Lottie é exclusivo. A verificação sugerida usa op menos um, não considera o ponto de saída conteúdo visível.

  3. Controles mudam o fluxo de edição

    Como controles do player podem gravar alterações na fonte, reler o arquivo impede substituir edições recentes do usuário por valores antigos.

04 Exemplo de briefing

Experimente um briefing específico

O briefing de exemplo abaixo não foi testado. Verifique a configuração da skill antes de usá-lo.

Revise a configuração do player

Leia a fonte e a configuração do repositório. A referência abaixo é um link para a fonte, não comando de instalação.

Arquivo-fonte original
https://github.com/diffusionstudio/lottie/blob/3c72912fad543897f90045ed4d355813837927fc/skills/text-to-lottie/SKILL.md

Use uma cena de teste separada antes de modificar arquivos existentes do projeto.

Descreva uma animação

Adapte o escopo, o material de origem e as restrições deste briefing antes de executar a skill.

Briefing de exemplo
Use text-to-lottie para criar um loop de quatro segundos para o logo SVG fornecido. Crie uma cena nova chamada logo-loop no projeto de teste indicado; não sobrescreva outra cena. Mantenha o fundo transparente e as proporções do logo. Exponha a cor de destaque como controle rotulado. Use easing deliberado, não movimento linear uniforme. Valide o JSON, abra o player Skottie local oficial e inspecione o quadro zero, um intermediário e o último visível. Relate recursos ausentes, recortes ou descontinuidades do loop; diferencie verificações executadas das que ainda aguardam revisão.

Revise os quadros renderizados

Compare o resultado real com estes critérios observáveis.

  • A nova cena correta é usada e edições existentes continuam intactas.
  • O logo aparece sem recorte nos quadros inspecionados, com fundo transparente.
  • O controle de destaque altera os valores pretendidos e o loop é conferido no player real.

OpenDesign oferece um espaço de trabalho de design local para agentes de programação. Esta listagem não significa que a skill esteja incluída nem que suas ferramentas externas, credenciais e dependências de software estejam incluídas.

Baixar OpenDesignLer o guia rápido

05 Fonte e licença

Fonte e licença

Esta página descreve a revisão fixada da fonte vinculada abaixo. O comportamento e os requisitos upstream podem mudar.

Responsável pela fonte
diffusionstudio
Repositório
diffusionstudio/lottie
Arquivo da skill
SKILL.md
Licença
MIT
Versão revisada
2026-11-02 · 3c72912fad54
Resumo editorial da fonte
Revisão editorial baseada na fonte do fluxo Text to Lottie: seleção de cena, autoria Lottie, controles editáveis e verificação no player Skottie local. Nenhuma animação de exemplo foi executada para esta listagem.

Resumo original de OpenDesign, baseado na fonte vinculada. As estrelas do repositório são um sinal de popularidade datado, não uso da skill nem nota de qualidade.

06 Perguntas antes de começar

Perguntas antes de começar

JSON Lottie válido garante renderização correta?

Não. A fonte pede inspeção dos quadros reais no player local. Carregamento de fontes, ordem de camadas e clipping ainda podem gerar resultado incorreto.

Posso usar o arquivo em qualquer player Lottie?

As instruções revisadas miram o Skottie local. Teste a animação exportada no runtime pretendido antes de presumir suporte equivalente.

As cores da animação podem ser editáveis?

Sim. A fonte orienta usar slots e controles com rótulos e intervalos para valores ajustáveis importantes. Os controles exatos dependem da cena.

OpenDesign

Mantenha a animação e seu briefing juntos.

Mantenha seu briefing, o material de origem e o trabalho de design juntos em um espaço de trabalho local. Verifique a configuração da própria skill antes de adicioná-la ao seu fluxo de trabalho.

Baixar OpenDesignExplorar skills de design
Arquivo-fonte original
https://github.com/diffusionstudio/lottie/blob/3c72912fad543897f90045ed4d355813837927fc/skills/text-to-lottie/SKILL.md