Como Gravar a Tela para Relatórios de Bug: Um Guia Passo a Passo
Uma imagem vale mais que mil palavras, mas um vídeo vale mais que mil imagens. Quando se trata de relatórios de bug, gravações de tela podem ser a diferença entre um ticket que é resolvido em minutos e um que fica na fila por semanas.
Neste guia, mostraremos quando usar gravações de tela, como criá-las com o BugCapturer e as melhores práticas para tornar suas gravações o mais úteis possível.
Quando Usar Gravação de Tela vs Capturas de Tela
Nem todo bug precisa de uma gravação. Aqui está um guia rápido para ajudar você a decidir:
| Tipo de Bug | Captura de Tela | Gravação de Tela |
|---|---|---|
| Problema de layout estático | ✅ Melhor escolha | ❌ Exagero |
| Texto ausente ou incorreto | ✅ Melhor escolha | ❌ Exagero |
| Falha em animação ou transição | ❌ Não captura | ✅ Essencial |
| Problema de estado hover ou tooltip | ❌ Difícil de capturar | ✅ Melhor escolha |
| Bug em fluxo de várias etapas | ❌ Precisa de muitas capturas | ✅ Uma gravação cobre tudo |
| Problema de desempenho / lentidão | ❌ Não mostra velocidade | ✅ Mostra o tempo |
| Bug intermitente / sensível a tempo | ❌ Não captura | ✅ Melhor chance de capturar |
Regra geral: Se você consegue descrever o bug claramente com uma única captura de tela anotada, use uma captura de tela. Se o bug envolve movimento, tempo ou várias etapas, grave um vídeo.
Como Gravar a Tela com o BugCapturer
O BugCapturer v1.2.0 torna a gravação de tela simples e mantém tudo local — sem uploads, sem serviços de terceiros.
Passo 1: Abra o BugCapturer
Clique no ícone do BugCapturer na barra de ferramentas do seu navegador. O popup aparecerá com as opções disponíveis.
Passo 2: Inicie a Gravação
Clique no botão "Record Screen". O BugCapturer solicitará permissão para compartilhar sua tela — selecione a aba do navegador que deseja gravar e clique em "Compartilhar".
Passo 3: Grave o Bug
Execute as etapas que reproduzem o bug. Os controles de gravação aparecem na parte inferior da tela, mostrando o tempo decorrido. Você pode pausar e retomar se necessário.
Passo 4: Pare e Revise
Clique em "Stop Sharing" quando terminar. A gravação aparecerá no popup do BugCapturer para revisão.
Passo 5: Apare (Opcional)
Se a gravação tiver trechos desnecessários no início ou no final, use a ferramenta de corte para reduzi-la. Arraste as alças para selecionar a parte que deseja manter.
Passo 6: Extraia Quadros-Chave (Opcional)
Destaque momentos críticos extraindo quadros da gravação como imagens PNG. Eles podem ser usados junto com a gravação para referência rápida.
Passo 7: Anexe ao Seu Relatório de Bug
A gravação agora está pronta para ser incluída no seu relatório de bug. Ao enviar o e-mail pelo BugCapturer, o arquivo de gravação é anexado automaticamente.
Melhores Práticas para Gravações de Tela
Mantenha Curto
Busque de 15 a 30 segundos. Se o bug demorar mais para ser reproduzido, considere aparar a gravação para mostrar apenas as partes relevantes.
Mostre as Etapas
Inicie a gravação e execute as etapas de reprodução. Isso fornece aos desenvolvedores tanto a evidência visual quanto as etapas em um único pacote.
Destaque o Problema
Use as ferramentas de anotação após a gravação — adicione setas ou caixas para chamar a atenção para a área do problema nos quadros extraídos.
Verifique o Tamanho do Arquivo
Gravações WebM normalmente têm de 1 a 3 MB para 15 a 30 segundos. Se sua gravação for muito maior, tente reduzir a qualidade da gravação ou aparar de forma mais agressiva.
Nomeie com Clareza
Use nomes de arquivo descritivos como cart-counter-stale-on-firefox.webm em vez de recording-001.webm.
Casos de Uso Comuns
Bug de Estado Hover
Um menu suspenso que desaparece quando o cursor se move ligeiramente para fora do alvo é quase impossível de descrever com uma captura de tela. Uma gravação de 5 segundos captura o comportamento exato.
Desempenho de Animação
Uma transição de página que trava ou apresenta lentidão — uma gravação mostra a taxa de quadros e o tempo real, que é muito mais informativo do que uma descrição.
Bug em Formulário de Múltiplas Etapas
Um formulário que falha na etapa 4 de 5 — em vez de cinco capturas de tela, uma gravação mostra o fluxo inteiro e onde ele quebra.
Solução de Problemas
Permissões de gravação não aparecem
Certifique-se de estar usando um navegador compatível (Chrome 100+). Se a caixa de diálogo de permissão não aparecer, verifique as configurações do site do seu navegador para permissões de gravação de tela.
A gravação está muito grande
Tente aparar a gravação para o comprimento mínimo necessário. Se você estiver gravando uma tela de alta resolução (4K), considere reduzir o tamanho da janela do navegador antes de gravar.
Não consigo ouvir áudio
O BugCapturer grava o áudio da aba por padrão. Se precisar adicionar narração, use a ferramenta de gravação de tela do seu sistema operacional.
---
BugCapturer é uma extensão gratuita do Chrome para relatórios de bug e feedback em sites. Todo o processamento de dados acontece localmente no seu navegador — sem servidores, sem contas, sem rastreamento.