VídeosPrintsSeleçãode área
Sua tela.Do seu jeito.
Vídeos e prints em um só lugar.
Grava a tela e tira prints com nome e pasta certos.
- Electron 28
- JavaScript
- FFmpeg
- HTML e CSS
Gravação de vídeoCaptura de telasSeleção de áreaSua tela.Do seu jeito.
Vídeos e prints em um só lugar.
- Electron 28
- JavaScript
- FFmpeg
- HTML e CSS
Grava a tela e tira prints com nome e pasta certos.
- Electron 28
- JavaScript
- FFmpeg
- HTML e CSS
O que capturar
Depende de qual monitor você está? Não mais.
Com mais de um monitor, o print padrão é o do monitor onde o cursor está, toque ou passe o mouse na mesa e veja qual acende. Também dá para fixar um monitor, uma janela ou uma área. Capture com o botão ou com a tecla F9 de verdade: antes da foto, o programa sai da frente para não aparecer no print.
Ou aperte F9 com esta parte na tela.
Os prints, já com nome
Nenhum print ainda.
Os cinco alvos
Os alvos, o padrão e a espera de 300 ms são os do código (screenshot.js). Em telas com escala, o print sai no tamanho real dos pixels, não reduzido.
O nome
Cada print já sai com nome e lugar.
Dê um nome ao grupo e o programa cuida do resto: tira o que o Windows não aceita, troca espaço por hífen, foge dos nomes reservados e continua a numeração de onde a pasta parou, mesmo depois de fechar o programa. Escreva um nome e veja.
Proibido no Windows: some. Espaço: vira hífen.
O nome que vai para o discovitrine
Prints/vitrine/
- vitrine-001.png
- vitrine-002.png
- vitrine-007.png
- Próximo arquivovitrine-008.png
As regras são as do código (limparNome e proximoNumero): a numeração lê a pasta e segue do maior número, na pasta de exemplo há um vitrine-007, então o próximo é o 008, não o 003.
Você escolhe o enquadramento.
Tela inteira, janela ou área, com atalhos para cada passo.
Tela, janelaou áreaÁudio e
microfoneQualidade
configurável
Na gravação, cada opção do programa está aqui: escolha a fonte, o áudio, a qualidade e onde a câmera fica, a prévia obedece. Ligue o destaque e toque ou passe o mouse na prévia; depois inicie, pause e pare.
Fonte
Áudio
Resolução
Quadros por segundo
Formato
Câmera
Contagem antes de gravar
Destaque do cursor
Alt+R inicia · Alt+S para · Alt+P pausa ou retoma
Opções e atalhos são os da tela do programa. A gravação sai em VP9 (ou VP8, se o sistema não tiver VP9); o áudio do sistema e o do microfone são misturados num só. Aqui a prévia é de mentira: nada é gravado.
A gravação longa
Uma hora de vídeo sem encher a memória.
Em vez de guardar o vídeo inteiro na memória até o fim, o programa manda cada segundo gravado direto para um arquivo no disco. Ao parar, fecha o arquivo: no WebM, escreve a duração que o navegador deixa de fora; no MP4, converte. Grave seis segundos e escolha.
temp_1760641620000.webm0 pedaços · ≈ 0 MBestimado pela taxa da resolução escolhida
O pedaço de 1 segundo, a correção da duração em JavaScript puro (sem processo externo), as opções do FFmpeg e o recuo para WebM são os do código (main.js e webm-duracao.js). Os tamanhos são uma estimativa pela taxa-alvo de cada resolução.
Os atalhos
A tecla só vale quando chega.
O sistema responde que a tecla foi registrada mesmo quando ela nunca chega ao programa. Por isso o programa tem um teste: você aperta e ele confirma. Clique no campo e aperte qualquer tecla, a prova acontece aqui.
A prova da tecla
Clique aqui e aperte uma tecla (F9, Scroll Lock, Alt+R…).
- Capturar um printF9Se recusada:F8F7Alt+Shift+PCtrl+Shift+1
- Começar um grupo novoScroll LockSe recusada:Alt+Shift+GCtrl+Shift+2F10Alt+Shift+N
- Gravar vídeoAlt+RAlt+SAlt+P
No Windows 11, a tecla Print Screen abre a Ferramenta de Captura por padrão, um programa de fora só a recebe se essa opção for desligada. Por isso o padrão aqui é F9, com reservas que o sistema disputa menos.
As teclas, as reservas e o motivo do teste são os do código (hotkeys.js). Na seleção de área, Esc cancela e Enter confirma, só enquanto ela está aberta.
Da ideia ao aplicativo.
Interface própria. Arquivos locais.
Captura organizadaPrints em gruposDesenvolvimento autoralA galeria do programa não tem pasta de mentira: criar uma pasta cria no disco, arrastar um print move o arquivo, e a pasta clicada vira o destino dos próximos prints. Apagar manda para a lixeira, print apagado por engano não pode ser irreversível. Experimente.
vitrineArraste um print para uma pasta ou para a lixeira.
As telas do programa
Tudo nas pastas do programa é arquivo de verdade (screenshot.js): a pasta aparece no Explorer, e a galeria se atualiza sozinha quando algo muda lá fora. As miniaturas aqui são as telas do próprio programa.
As tecnologias
Do que é feito, peça por peça
Um programa de computador feito com tecnologia de navegador: o Electron dá a janela, a bandeja e as teclas globais; o próprio Chromium grava a tela e fotografa os monitores; e o FFmpeg entra só quando o vídeo precisa virar MP4. Escolha uma peça para ver o que ela faz aqui e em que arquivo está.
10tecnologias, em 3 camadas
Janela
Tela
Arquivos
Aplicativos desktopWorkBench