top of page

Como começar

Captura

🛠️ Setup de instalação da Extensão

Antes de fazer a primeira gravação é importante realizar o processo de instalação corretamente:

  1. Faça o download da extensão da Getdemo direto na Chrome Web Store

    • Um ponto muito importante é a limpeza dos cookies para garantir que seu navegador tenha a capacidade de processamento necessária para finalizar as capturas. Para isso, existem duas opções:

      • Realizar a limpeza dos cookies.

      • Realizar a instalação da extensão em um novo perfil do Google Chrome.

  2. Feche todas as abas / reinicie o navegador.

  3. Desative o tradutor (selecionar a opção “não traduzir esse site”) para evitar que palavras traduzidas erroneamente acabem em sua demonstração.

  4. (opcional) Fixe a extensão para facilitar o acesso e visualizar a quantidade de frames capturados em tempo real.

📸 Escolha da opção de captura

Existem dois tipos de gravação: por HTML e Print. As principais diferenças são:

  • HTML: captura mais completa que faz o clone de todo o HTML (frontend) das telas exibidas pelo navegador. Copia as animações, hoovers e rolagem, e permite a edição dos elementos. Exemplo.

  • Print: captura simples que tira uma foto da tela a cada clique e permite que você posicione balões de interação para explicar os elementos e criar a experiência de interação. Ideal para telas complexas onde não foi possível capturar por HTML. Exemplo.


Para trocar entre as opções, basta colocar o toggle da extensão para esquerda (Print) ou direita (HTML).

💡Nova demo ou complementar uma demonstração existente

Com o produto que deseja gravar aberto no seu navegador, o botão “Começar a capturar” inicia a gravação. Além de iniciar uma nova captura, é possível adicionar mais telas à uma demostração já existente pelas configurações da extensão: exemplo.

Independente se for uma nova captura ou complementar uma existente, via print ou HTML, assim que começar a gravação, cada clique que realizar (desde que seja no perfil com a extensão instalada), será um frame gravado que aparecerá no ambiente de edição. Portanto, basta navegar pelo seus produtos normalmente com a extensão ativada, que a sua demo será gravada e um balão/tooltip será automaticamente inserido em cada elementro que clicar.

Lembrando que não há a necessidade de rolar até o final das páginas (a captura via HTML clona a página inteira e via Print não permite a rolagem), mas é muito importante esperá-las carregar por completo antes de fazer o próximo clique.

complementardemo.gif
bottom of page