Ir para o site

UserSignal  / Tours de produto

Criando um tour no seu app

Abra seu app com o builder no topo, selecione elementos e escreva cada passo no local onde ele aparecerá.

Você cria um tour nas páginas do seu próprio app, de modo que cada passo apareça exatamente como seus usuários o verão. Não é necessário código nem extensão do navegador.

1. Abra seu app

No editor do tour, pressione Edit in your app e insira o endereço da página onde o tour começa. Ela abre em uma nova aba com o builder no topo.

  • Sign in to your app first se a página exigir. Se seu app redirecionar para a sua página de login, o builder não vem junto.
  • Se o builder não aparecer, recarregue a página com Cmd/Ctrl + Shift + R. Seu navegador pode estar usando uma versão antiga do widget.

2. Selecione um elemento

A barra inferior diz Click the element this step should point at. Passe o mouse pela página: o elemento sob o ponteiro é contornado e nomeado. Clique nele para criar o passo.

O builder no modo de seleção, com o link Relatórios contornado e a barra na parte inferior da página

  • Enquanto você seleciona, os cliques não chegam ao seu app. Para usar o app normalmente, por exemplo abrir um menu ou ir para outra página, mude para Use the page, ou mantenha Shift pressionado.
  • Para um passo que não aponta para nada, pressione No element: make it a pop-up.

3. Escreva o passo

Digite o título e o texto no próprio passo. Os ícones abaixo do texto adicionam uma image or GIF (até 10 MB), um video (um link do YouTube, Vimeo ou Loom, ou um MP4 de até 25 MB) e um link button.

Um passo sendo escrito ao lado do link Relatórios, com seu painel de configurações ao lado e os passos do tour na barra

O painel ao lado do passo define:

  • Shows as: uma tooltip que aponta para o elemento, ou um pop-up no meio da página.
  • Position: acima, abaixo, à esquerda ou à direita do elemento. Automatic escolhe o primeiro lado com espaço.
  • Go to the next step when they: clicarem em Next, ou clicarem no próprio elemento.
  • Dim the rest of the page e Let them close it.
  • Next button text e When they click Next. Veja Movendo entre páginas, tours e ações do app.
  • Advanced mostra o seletor CSS do elemento, que você pode editar.

Tudo salva enquanto você digita: a barra indica Saved.

4. Adicione mais passos, visualize e finalize

  • Os números na barra são seus passos. Clique em um para editá-lo, e + para adicionar um passo.
  • Preview reproduz o tour na página como seus usuários o verão.
  • Done leva você de volta ao tour no UserSignal, onde pode reordenar os passos e publicar.

O builder permanece aberto enquanto você navega pelo seu app na mesma aba, por até 8 horas. Depois disso, abra-o novamente a partir do UserSignal.

Atualizado a 14 de outubro de 2026

Este artigo foi útil?