Todos os projetos

Produção de vídeo · ferramenta de gravação

Teleprompter para gravar vídeos no navegador

Roteiro com rolagem automática, linha de leitura e espelhamento para vidro de teleprompter, em um arquivo que funciona offline.

Novo desenho do teleprompter: editor do roteiro com títulos e deixas ao fundo e o texto rolando na linha de leitura, com velocidade, fonte e espelhamento.
Nova interface: desenho de referência para a próxima versão do app, com um roteiro fictício.

O desafio

O texto precisa acompanhar quem fala.

Gravar lendo um roteiro pede texto rolando no ritmo da fala, legível a distância e compatível com vidro de teleprompter, sem instalar programa nem depender de conexão.

A construção

Um arquivo para abrir e gravar.

Um único arquivo HTML, com CSS e JavaScript próprios e nenhum recurso externo. O roteiro é colado ou carregado de um arquivo .txt ou .md, com marcação simples para títulos e para deixas que não são lidas. O texto rola sozinho em velocidade ajustável, com linha de leitura, foco na linha, contagem regressiva, tempo restante, espelhamento horizontal e vertical, tela cheia e atalhos de teclado; fonte, cores e demais ajustes ficam salvos no navegador.

  • Colar ou carregar o roteiro e marcar títulos e deixas.
  • Ler na altura da linha, ajustando velocidade e fonte durante a gravação.
  • Espelhar o texto para vidro de teleprompter e manter a tela ligada.

Engenharia aplicada

Decisões que fazem diferença

  1. Um arquivo, nenhuma dependência.

    HTML, CSS e JavaScript ficam no mesmo arquivo, sem bibliotecas nem recursos externos. Ele funciona aberto do disco, sem conexão, ou servido como página estática.

  2. Controles para quem está lendo.

    Linha de leitura com foco, contagem regressiva, tempo restante e atalhos de teclado permitem ajustar a leitura sem interromper a gravação.

  3. Armazenamento que não quebra o app.

    Roteiro e ajustes ficam salvos no navegador, e todo acesso ao armazenamento é protegido: se o navegador bloquear, o teleprompter continua funcionando.

Painel de ajustes no novo desenho, com leitura, texto, cores e espelhamento; ao fundo, o texto aparece espelhado.
Ajustes de leitura e espelhamento no novo desenho.
Interface atual do teleprompter, com o roteiro de exemplo pausado na linha de leitura.
Interface atual: roteiro de exemplo pausado na linha de leitura, com os controles da gravação.
Editor de roteiro com títulos, deixas entre colchetes e estimativa de tempo de leitura.
Editor do roteiro: títulos com #, deixas entre colchetes e tempo estimado na velocidade atual.

Seu próximo projeto

Vamos construir o que sua operação precisa.

Conte o problema, as ferramentas que você usa e o que quer colocar para funcionar.

Conversar sobre meu projetoExplorar outro projeto