Ferramentas VidGrid-HTML - Grades de miniaturas de vídeo personalizáveis no navegador

Bom, 😌 não consegui. Tô tentando no desktop e infelizmente não rola. Nada grave, claro. Dividi as células igualmente em dois arquivos e eles continuam gerando exatamente os mesmos frames. Tô meio desistindo porque não consigo explicar direito. De qualquer forma, valeu demais, uso a ferramenta sempre mesmo assim
 
RevvingUpkj A menos que tenha algum problema com o vídeo em si (pode ser, alguns formatos de vídeo não são muito bem suportados, principalmente em navegadores de celular), não consigo reproduzir seu problema.
Acabei de testar no Chrome mobile no Android:
1. Carrego um arquivo
2. Carrego o mesmo arquivo de novo (aí ficam dois na fila)
3. Edito os timestamps do primeiro arquivo da fila, coloco todos os timestamps na primeira metade do vídeo e salvo
4. Edito os timestamps do segundo arquivo da fila, coloco os timestamps na segunda metade e salvo
5. Começo o processamento.
Me dá duas saídas diferentes:


Não fiz 48 células, mas duvido que mude alguma coisa. Repara que você PRECISA especificar todos os marcadores, se você especificar só alguns, os que faltam são preenchidos automaticamente e pegos dos padrões a partir do começo do arquivo, então talvez esse tenha sido seu problema? Se você só precisa de 24 células em cada arquivo, faça a grade com 24 células 😅 O VidGrid não suporta grades "incompletas", ele avisa dos marcadores "auto" se você salvar menos do que o número esperado, e o número de marcadores fica em vermelho no editor de timestamps (e o layout da grade mostra as células que faltam):
 
Exatamente! Era isso mesmo. Eu não tava preenchendo os outros marcadores. Por isso começava do início do arquivo e as duas saídas ficavam iguais. Valeu demais pela explicação. Agora sei como fazer os dois arquivos separados com marcadores diferentes e com a mesma quantidade de células.
Então! Beleza! Seria possível automatizar alguma coisa disso? Talvez, se der, fazer as outras células se preencherem automaticamente? Tipo, se eu tenho 12 células, elas se preencherem sozinhas até o último timestamp ou o último marcador? Assim eu poderia fazer outro arquivo com marcadores autopreenchidos de outra parte do vídeo. Acho que seria uma mudança bem legal!
De qualquer forma, valeu pela explicação, agora consigo fazer arquivos separados com marcadores separados. Valeu de novo pelas explicações e pela ferramenta.
 
RevvingUpkj Dá pra explicar de novo por que você não consegue fazer seus arquivos de 48 células de uma vez só? Não entendi essa de as miniaturas ficarem "espremidas". Fazer dois arquivos, se o número de colunas é o mesmo, não muda o tamanho das miniaturas, o valor de "Output Width (px)" é dividido pelo número de colunas... então talvez usar menos colunas e mais linhas? Aí você fica com miniaturas individuais maiores.
Tô olhando seus posts e, sinceramente, as miniaturas parecem bem normais e grandes o bastante (vejo alguns de 30-35 células, se abro com 100% de zoom a qualidade é ótima). Você aumentou a largura de saída pra 3840px, mas pode ir mais alto se quiser, é só digitar o número no campo de texto... o mesmo vale pro número de colunas/linhas, o intervalo/slider só tem um limite "suave" (pros valores mais comuns que o pessoal usa), dá pra digitar valores maiores.
Fora isso, não sei bem como eu poderia automatizar o que você quer sem atrapalhar os usos normais (em 1 arquivo), a interface do editor de timestamps já tá bem carregada, não quero adicionar mais botões nem deixar mais complicado, principalmente no celular.
 
ah, eu definitivamente não tô me explicando direito. agora estamos em páginas totalmente diferentes. Desculpa. não sei mais como explicar. mas tá tudo bem, valeu demais por tentar.
 
Tentei entender o ponto, posso estar errado, mas deixa eu explicar o que eu entendi.
Você precisa de 2 planilhas diferentes, uma pra primeira metade e outra pra segunda.
-
Uma solução melhor e mais fácil poderia ser gerar uma única planilha com o dobro da resolução e cortar a imagem em duas metades iguais usando qualquer software que tenha na internet, acho eu.
-
E eu mesmo tentei fazer exatamente o que você queria, e consegui entender por que é difícil.
Hoje a gente não tem uma opção pro motor gerar timestamps igualmente espaçados pra um trecho do vídeo. Então é difícil editar os timestamps na mão pra marcar em 24 lugares diferentes.
E outro problema que tive fazendo isso é que, quando eu seguro sem querer um timestamp, ele some.
Pensei em umas soluções que podem ajudar os usuários e que poderiam ficar nas configurações avançadas dentro das configurações, pra ferramenta continuar simples.
-
1. Deixar o usuário escolher o trecho do qual quer gerar uma planilha. (Tipo, deixar escolher de segundo a segundo. Por exemplo, num vídeo de 1200 segundos, deixar ele escolher se quer que os timestamps automáticos igualmente espaçados sejam gerados só pro trecho de 600-900 segundos. Assim resolve fácil).
2. O lance de apagar o timestamp com toque longo dá pra resolver fácil no desktop. Mas é difícil no celular com os elementos apertados. Então um botão pra desativar isso nas configurações avançadas ajudaria. Aí só dá pra apagar um timestamp tocando no "x" da lista.
3. Dar uma opção de avançar/voltar x segundos. Assim fica fácil pros usuários acharem o melhor frame pra capturar.
De novo, isso deixa a ferramenta complexa, então coloca tudo nas configurações avançadas, pra quem quiser manter.
-
Só pensei que isso podia ser uma opção pra resolver. não faço ideia de quanto tempo/esforço leva pra implementar.
Pode ser que eu tenha escrito mal alguma frase, desculpa se for o caso, a intenção foi totalmente ajudar a melhorar a ferramenta, já que você tem ajudado muito essa comunidade.
 
Valeu por esclarecer.
É exatamente isso que eu quis dizer. A única diferença é que você tem duas imagens, e sendo sincero eu acharia mais confuso, como alguém baixando um vídeo, se me apresentassem duas contact sheets do mesmo vídeo: "é a parte 1? cadê a parte 2?". Se você quiser mesmo, pode usar qualquer outra ferramenta pra cortar/copiar parte da imagem e subir cada parte separada... até no celular isso é bem fácil, por enquanto não vou integrar recursos de manipulação/edição de imagem.

Verdade, e na minha opinião é um caso de uso relativamente avançado/incomum... se você quer gerar uma contact sheet de um vídeo, ela deve mostrar o conteúdo do vídeo inteiro, não um trecho. Acho que eu poderia criar um modal com algumas opções pra adicionar um grupo de marcadores baseado em alguns parâmetros, com a opção de definir tempo de início/fim. Eu também já cheguei a brincar com a ideia de detectar mudanças de cena, mas leva tempo demais de processamento e é relativamente pouco confiável, já dar uma faixa de marcadores igualmente espaçados seria mais fácil.

Eu poderia adicionar uma configuração... mas também dá pra resolver forçando você a selecionar o marcador primeiro no celular antes de poder segurar nele, e talvez adicionando uma notificação toast de "Desfazer" depois de apagar um marcador individual. No desktop o marcador é removido com o clique direito do mouse, então é mais difícil fazer sem querer/sem precisão.
Esse recurso já existe no desktop usando as setas (1 segundo), com Ctrl (quadro a quadro) e Shift (5 segundos) como modificadores. Posso adicionar mais controles do lado do botão de Play.
Valeu pelo feedback, vocês dois, vou trabalhar mais um pouco na interface do editor de Timestamps pra próxima atualização.
 
Oh
Ohhh... O recurso de busca parece legal. Pena que eu não uso desktop.
É, um indicador de desfazer pode resolver, eu acho, porque o problema é que enquanto estou passando o dedo, se eu toco no marcador em vez de num espaço vazio, ele é apagado sem eu perceber que foi apagado. Então um desfazer cumpre as duas funções: avisa e reverte. Ótima ideia como sempre
E valeu por sempre considerar os pedidos de todos os usuários!
 
Atualização de versão menor, mesma URL: https://vidgrid-html-87fe95.gitlab.io/
VidGird-HTML v.3.5.3
UX do editor de Timestamps retrabalhada no celular e no desktop:
  • Melhor tratamento do tamanho do vídeo, do layout da grade e da lista de marcadores. No celular eles se empilham de forma mais consistente, role pra baixo pra ver ;-)
  • Apagar marcadores no celular com toque longo agora exige selecionar o marcador primeiro.
  • Ficou mais fácil buscar um tempo específico por toque/arraste, use a parte de baixo da barra de busca (a parte de cima/os números dos marcadores servem pra selecionar marcadores)
  • Novo: Botões de busca (1 quadro, 1 segundo, 5 segundos), antes só disponíveis com teclado/roda do mouse.


  • Novo: Quando a lista de marcadores está vazia aparecem botões de "Quick Fill" pra ajudar a adicionar marcadores igualmente espaçados em toda a duração, na primeira metade ou na segunda metade do vídeo pra todas as células.


  • Novo: Layout da grade e lista de marcadores recolhíveis.
Isso deve resolver os problemas de vocês no celular RevvingUpkj e Yuniqcorn
 
Você conseguiu!! Amei essas adições. A possibilidade de adicionar marcadores facilmente na primeira e na segunda metade é exatamente o que eu queria. A opção de fazer duas saídas separadas com marcadores igualmente espaçados!
Valeu! Só de ter como opção já é fantástico. Pra dividir vídeos mais longos, ou qualquer um, assim dá pra mostrar mais do vídeo de forma limpa. Dá mais prévias sem espremer mais marcadores num arquivo só. Adição incrível
 
RevvingUpkj Sem problema, mas só pra deixar claro, se você fizer uma grade 6x8, ou 2 vezes 6x4 (com cada metade), as miniaturas devem ser praticamente as mesmas... por isso eu não tinha entendido bem a diferença que você queria, mas fico feliz que o novo recurso atenda o que você precisa. Qualquer feedback é bem-vindo!
 
Atualização menor de versão, mesma URL: https://vidgrid-html-87fe95.gitlab.io/
VidGird-HTML v.3.6.1
Um pouco mais de carinho pro Editor de Timestamps, pra quem ama grades enormes com muitas células... e pra celular.
  • Novo: Botão Remover marcador ("-") pra remover o marcador selecionado mais fácil, só fica ativo quando um marcador está selecionado.
  • Novo: Botões de Zoom In / Zoom Out e barra de visão geral. Dá pra dar zoom na linha do tempo de 100% (visão completa) até 1000% pra posicionar os marcadores com precisão quando estão muito juntos. A porcentagem de zoom atual aparece entre os botões.

    timestamp-editor-zoom.mp4.webp

  • Cores do estado "selecionado" mais consistentes em cada tema.
 
Atualização menor de versão, mesma URL: https://vidgrid-html-87fe95.gitlab.io/
VidGird-HTML v.3.7.0
O Goonbox implementou limites de "pixels em todos os frames" e de "total de frames" pra imagens animadas, e pra facilitar gerar saídas que fiquem abaixo disso (pro upload não falhar) eu adicionei essas duas informações como estimativa (antes de gerar) e checagem efetiva (depois de gerar).
Obs: a API do Goonbox ainda não está disponível, então os uploads ainda precisam ser feitos manualmente
  • Novo: Configurações em abas pra acesso mais fácil e adição da aba "Animações":






  • Novo: Detalhes da animação com total de frames e total de pixels entre os frames, com indicadores se passarem dos limites definidos nas Configurações.




 
primeiro de tudo, ferramenta foda. segundo, alguém achou um template de grid animado bom e compatível com goonbox? tive que sacrificar muita qualidade pra conseguir subir, talvez tenha um jeito melhor de economizar?
 
Você precisa entrar ou se cadastrar para responder aqui.
Voltar
Topo