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:
-
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.
-
-
-
Feche todas as abas / reinicie o navegador.
-
Desative o tradutor (selecionar a opção “não traduzir esse site”) para evitar que palavras traduzidas erroneamente acabem em sua demonstração.
-
(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.