Communitygithub.com

Simulador de Desmontagem

Transforma qualquer máquina ou mecanismo (real ou imaginário) em um simulador 3D interativo, offline, de página única, que pode ser desmontado — visão em corte, vista explodida, explicador 'como funciona X', modelo dirigível ou um filme gravado com trilha sonora. Executa a skill de desmontagem do Claude Code.

O que é Simulador de Desmontagem?

Esta skill permite que agentes de IA (como Claude Code, Cursor ou Codex) construam simuladores 3D interativos completos, offline e de página única, a partir de descrições textuais de máquinas ou mecanismos reais ou imaginários. Suporta todos os navegadores modernos e é ideal para criar explicadores interativos de engenharia, modelos educacionais ou visualizações de mecanismos complexos. A skill automatiza todo o fluxo de trabalho: desde a coleta de referências e construção do modelo 3D baseado em parâmetros reais, passando pela criação de painéis de controle com gráficos ao vivo, até a gravação de um filme em 60 fps com trilha sonora original gerada proceduralmente. Funciona em qualquer plataforma que suporte a ferramenta de linha de comando Claude (Node.js >= 20, ffmpeg, python3 e Playwright são os únicos pré-requisitos). O processo inclui uma fase crítica de verificação de colisões e consistência, garantindo que o simulador final seja preciso e visualmente limpo. Também oferece a opção de publicar o resultado como uma página HTML autossuficiente com menos de 1 MB.

Funciona com✓Claude Code~Codex CLI✓Cursor
npx skills add https://github.com/script-repo/3d-studio/tree/HEAD/skills/teardown-simulator

Perguntar na sua IA favorita

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

Documentação

O que Simulador de Desmontagem faz?

Uma máquina, uma página HTML offline: um modelo construído em código com unidades reais, um resolvedor como funções puras de uma única entrada, painéis ao vivo, um botão por subsistema, um tour automático, uma passagem crítica, um filme gravado a 60 fps com trilha sonora e uma etapa de publicação opcional.

Regras

  • Referência primeiro. Antes de construir, peça ou encontre um desenho em corte, foto ou clipe. Sem referência, sem construção.
  • Nunca invente números silenciosamente. Todo número é proveniente de uma fonte ou sinalizado como estimativa, indicando de onde veio.
  • Confirme o escopo primeiro. Construções pesadas usam muito do Claude Code: concorde sobre a máquina, os momentos, filme ou não.
  • Publicação precisa de um 'sim' explícito, toda vez.
  • No host: apenas nível de usuário, sem sudo, não mexa nos serviços do cluster, renderizações longas em tmux com logs.

Escolha uma boa máquina

Uma entrada móvel (ângulo de manivela, curso 0..1, vento, tempo) e números reais publicados. Bons exemplos: câmbio de bicicleta, escape de relógio (4 Hz), diferencial de carro, ponto de costura de máquina de costura, braço de escavadeira. Evite máquinas com muitas entradas independentes ou dimensões secretas.

Anatomia do simulador

  1. Máquina — construída a partir de código em unidades reais. 2. Modelo — um resolvedor, funções puras de uma única entrada. 3. Painéis — gráficos ao vivo do mesmo modelo. 4. Botões — isolar/cortar/mostrar sozinho por subsistema, vistas, controles deslizantes. 5. Janela — o chão/palco mostra o que o resolvedor diz. 6. Tour — tour automático com cursor; qualquer entrada assume o controle; 25 s de silêncio o devolve.

Instalação e execução (em )

npx skills add elvarofficial/teardown -g -a claude-code
cd ~/.claude/skills/teardown && npm install && npx playwright install chromium
# precisa de Node >= 20, ffmpeg, python3
mkdir -p ~/3d-studio/{projects,out,logs,smoke}
cd ~/3d-studio/projects/<maquina>
tmux new -s <maquina> 'claude 2>&1 | tee ~/3d-studio/logs/<maquina>.log'
# dentro do Claude Code: /teardown ...   (nunca --dangerously-skip-permissions)

Teste de fumaça: node ~/.claude/skills/teardown/sims/build.mjs cessna-live e abra o HTML de teardown-out/dist/.

Fluxo de trabalho (substitua os [colchetes])

1. Construir

/teardown Construir [o trem de pouso principal do Cessna 337] como um simulador 3D interativo. Referência anexada: [um desenho em corte do trem]. Construa-o a partir de código em unidades reais: [peças]. Antes de desenhar qualquer coisa, escreva o modelo como funções puras de uma única entrada: [curso de 0 a 1]. Use os números reais: [cremalheira percorre 201 mm, pinhão 32 dentes com módulo 4 mm, pernas giram exatamente 180°]. Verifique-os manualmente e mostre-me a verificação. Se não tiver certeza se um número é real, diga e conte de onde veio. Cada peça, cada painel e cada rótulo lê desse único modelo. Nada é animado manualmente.

2. Console

Organize um console ao redor da máquina em 1600×900: o título e o número vivo principal no canto superior esquerdo, grande: [rotação do motor em rpm]. Gráficos ao vivo que se movem com a máquina: [levantamento da válvula ao longo de 720° de manivela, diagrama PV]. Um painel esquemático que redesenha o mecanismo em 2D a partir do mesmo modelo. Um botão por subsistema: isolar, cortar, mostrar sozinho. Vistas de câmera como botões: [principal, frontal, lateral, superior, interna]. Anotações com linhas finas de chamada. Cada painel é redesenhado a partir do estado do quadro. Nenhum número na tela é digitado.

3. Visual

Estilo: um modelo de estudo limpo sobre um estúdio claro. Fundo claro, sombras suaves em um chão invisível, uma cor de destaque para a parte que está funcionando no momento: [cor de destaque]. A máquina preenche 60–70% da vista. Peças escuras brilhantes, revestimentos de vidro, rugosidade do metal de pelo menos 0,45. Peças quase brancas recebem um contorno de tinta fino ou um tom mais escuro. Escolha a câmera para o mecanismo: [vista 3/4] se a visão frontal se transformar em uma grade.

4. Crítico

Antes de me mostrar qualquer coisa: 1. Renderize um quadro fixo em cada batida do tour e leia cada um para: uma parte passando por outra, uma parte flutuando fora de seu suporte, um rótulo cobrindo o que nomeia, um número discordando da pose. 2. Varra cada transição em passos de 0,2 s para saltos. 3. Corrija colisões com um número no bloco de parâmetros, nunca as esconda com a câmera. Diga-me o que verificou e o que corrigiu. Mostre-me os quadros fixos.

5. Dirigir

O tour é reproduzido automaticamente com um cursor pressionando os botões: [batidas do tour]. Qualquer clique, arrasto, rolagem ou tecla entrega o controle ao visitante; 25 s de silêncio o devolve. Arraste para orbitar, role para zoom, [tecla] esconde os painéis. Aqueça cada shader antes do primeiro quadro. Teste em uma GPU integrada com etapas de qualidade: sem AO, proporção de pixel menor, sombras menores, painéis a cada dois quadros.

6. Gravar

Faça render(t) uma função pura do tempo ao longo de [20 s]. Desenhe cada quadro a 60 fps, 1920×1080 no Chrome sem cabeça, e canalize para ffmpeg como H.264 yuv420p com faststart. Dê-me uma folha de contato de cada batida.

7. Musicar

Pontue-o em código na mesma linha do tempo: [acordes Am9 a 92 bpm, um baque em cada curso de potência, um clique a cada pressionamento de botão, ar ascendente sob o arrasto do acelerador]. Masterize para -14 LUFS, pico real abaixo de -1 dB, e multiplexe no vídeo.

8. Publicar

Deixe o HTML abaixo de 1 MB (modelos grandes vão em arquivos irmãos). Faça um cartão de pré-visualização de 1200×630 a partir do melhor quadro, com URLs de imagem absolutas. Implemente em [Vercel / host] somente depois que eu disser sim.

9. Quebrar (bônus)

Adicione um controle deslizante para [vento 0–15 m/s] e execute o modelo ao vivo com ele; mostre o efeito nos mesmos painéis.

Lições aprendidas

  • Mantenha a página abaixo de 1 MB: uma página de 15,9 MB matou o cartão de link do X; 967 KB o consertou.
  • GPUs integradas: etapas de qualidade (sem AO, proporção de pixel menor, sombras menores, painéis a cada dois quadros) levou uma construção de 15 fps para 75 fps.
  • Quadros fixos detectam colisões que o movimento esconde. Sempre execute a passagem crítica.
  • Corrija colisões no bloco de parâmetros, nunca com a câmera.

Entregável

Pasta com: <maquina>.html (offline, <1 MB), relatório crítico (templates/critic-report.md) com quadros fixos, folha de contato, <maquina>.mp4 (60 fps, -14 LUFS), a verificação manual dos números do modelo com fontes/sinalizações, e um cartão de pré-visualização se for publicar.

Créditos

Fluxo de trabalho e prompts de Elvar (@elvar_official), "How I Turn Any Machine Into a 3D Simulator You Can Take Apart" (X, 2026-10-30). Executa a skill de desmontagem de Elvar, github.com/elvarofficial/teardown (MIT), construída sobre whaleyxbt/claude-motion (MIT).

Habilidades Relacionadas