Faça o Claude responder pergunta difícil com uma página fácil de ler

01Pra que serve

• Entender um assunto complicado lendo uma página organizada em painéis e diagramas, em vez de rolar a tela num textão.
• Comparar duas opções lado a lado (ferramentas, planos, caminhos) e ver a diferença de um jeito visual.
• Ver o mapa de um projeto: como as partes se ligam umas às outras, desenhado num diagrama.
• Cada página é um arquivo só, que abre sem internet e é fácil de mandar pra outra pessoa.
• O agente escreve bem menos: no teste do projeto, a página feita na mão gastou em média 4.893 tokens (pedaços de texto que o modelo escreve) e com a skill as mesmas perguntas gastaram 612, mais ou menos 1/8.

02O que você precisa

• Node.js 20 ou mais novo (um programa gratuito que roda a parte que monta a página)
• Um agente de IA: Claude Code, Codex, Cursor, OpenCode ou outro (o instalador funciona com mais de 70 agentes)
• Um navegador (Chrome, Edge, Firefox…) pra abrir as páginas

03Passo a passo

1. Confira se você tem o Node.js 20 ou mais novo. Abra o terminal (no Windows, o PowerShell) e digite o comando abaixo. Se der erro ou mostrar um número menor que 20, instale a versão LTS em nodejs.org.

   Copiar

   node --version

2. Abra o Claude Code e cole este comando. Ele adiciona a loja de plugins (os complementos do Claude Code) onde a skill está.

   Copiar

   /plugin marketplace add QingYunA/answer-me-with-html

3. Agora instale a skill, ainda dentro do Claude Code:

   Copiar

   /plugin install answer-me-with-html@answer-me-with-html

4. Usa outro agente (Codex, Cursor, OpenCode…)? Cole esta frase nele e o próprio agente faz a instalação:

   Copiar

   Install Answer me with HTML: read https://raw.githubusercontent.com/QingYunA/answer-me-with-html/main/INSTALL.md and follow it.

5. Pronto. Pergunte normalmente, em português. Quando a pergunta merece uma página, o agente monta e ela abre sozinha no navegador. Pra pedir a página na hora, diga "explique em HTML". As páginas ficam guardadas na pasta .answer-me-with-html/pages, dentro da sua pasta de usuário.
6. A skill não se atualiza sozinha. De tempos em tempos, peça pro agente:

   Copiar

   update answer-me-with-html

04Pedidos prontos pra colar no seu agente

Explique em HTML como funciona [ASSUNTO, ex.: o Pix por dentro / a declaração de imposto de renda].
Quero uma página pra quem nunca estudou isso: comece pelo resumo em 3 frases, depois um diagrama mostrando as etapas e, no fim, os erros mais comuns.
Escreva tudo em português.

Explique em HTML: [OPÇÃO A] ou [OPÇÃO B] pra [SEU OBJETIVO, ex.: editar vídeos curtos pro Instagram]?
Monte uma tabela lado a lado com preço, facilidade, limites e pra quem cada uma serve.
Termine com uma recomendação clara pro meu caso: [DESCREVA SEU CASO EM UMA FRASE].

Explique em HTML como as partes deste projeto se encaixam.
Quero um diagrama com as pastas principais, o que cada uma faz e como uma conversa com a outra.
Destaque os 3 arquivos que eu deveria ler primeiro e diga por quê. Escreva em português.

Explique em HTML um plano de [NÚMERO] semanas pra eu [OBJETIVO, ex.: lançar meu primeiro curso online].
Divida em etapas numa linha do tempo, com o que fazer em cada semana e o que pode dar errado.
Escreva em português, com frases curtas.