> For the complete documentation index, see [llms.txt](https://ajudachat.hotmobile.com.br/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://ajudachat.hotmobile.com.br/comecando/crie-um-bot-de-atendimento.md).

# Crie um Bot de Atendimento

Aqui você aprenderá como criar um fluxo básico e como realizar a integração do seu bot de atendimento à plataforma AtendChat.

{% embed url="<https://youtu.be/sLUwAa1oK_E>" %}

## Como criar um Bot de Atendimento

Antes de tudo, caso você já não possua uma conta no Typebot, precisará criá-la. Veja o passo a passo:&#x20;

1. Acesse o link: <https://app.typebot.io/register>, onde você será direcionado para tela de registro. Basta preencher os dados de acordo com o solicitado para criar sua conta.

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FKm471UY6hKYrdY0JcBSU%2Fimage.png?alt=media&amp;token=15cbed87-b93f-4ff0-aa7e-33efafb322c5" alt="" width="375"><figcaption></figcaption></figure>

2. Quando finalizar, será direcionado para a tela inicial do Typebot.

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FlpRw1tDdbgYPkdmAlcyU%2Fimage.png?alt=media&amp;token=5258fcb4-5ca0-4cf2-b84a-7986ae2f6c5f" alt="" width="563"><figcaption></figcaption></figure>

3. Clique em ***Create a typebot*** para criar um novo bot.

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FOf3QgleEHkH05fZaMFgc%2Fimage.png?alt=media&amp;token=0828ad82-962c-4a87-8447-a9998b53c0de" alt="" width="563"><figcaption></figcaption></figure>

4. Uma nova tela se abrirá e nela você encontrará 3 opções:

* Comece do zero (***Start from a scratch***);
* Comece com um template (***Start from a template***);
* Import um arquivo  (***Import a file***).

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FnYLipb6rzfXKT44tXWOD%2Fimage.png?alt=media&amp;token=afc981da-cd25-4e78-9b0f-7f9f1adab8e2" alt="" width="563"><figcaption></figcaption></figure>

### Comece do zero

Assim que clicar nessa opção, você verá o seguinte pop up se abrir. Feche-o e inicie sua criação.

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FSxDyJv2pnq5nFghyVlPW%2Fimage.png?alt=media&amp;token=c38e6b8f-58b9-498c-838b-0e0eb421ee7c" alt="" width="284"><figcaption></figcaption></figure>

Essa é sua área de trabalho:

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FHr2BMKwPUJ7FZFdQjGR3%2Fimage.png?alt=media&amp;token=fefa7225-a526-45ca-a37e-94317e5d4695" alt="" width="563"><figcaption></figcaption></figure>

A principais ferramentas aqui estão separadas em 3 grupos:

* Bubbles. Que são as ações que você realiza;
* Inputs. Que são os espaços para interação com seus contatos;
* Logic. Que são as ferramentas de variáveis dentro do typebot.

Vamos começar pelo grupo ***Bubbles***. Para construir nosso bot, vamos usar as ferramentas de ***texto*** e ***imagem***.

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FkQkBeFHvf9MELBYgLdf8%2Fimage.png?alt=media&amp;token=8b0d2334-7526-4a5e-9db8-4920410102b6" alt=""><figcaption></figcaption></figure>

Para adicionar a ação, basta ***arrastá-la para a área de trabalho***. Nesse exemplo vamos dar boas vindas, enviar um GIF e solicitar os dados do cliente.

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FqMP4tofdZI2K7NpCznJF%2Fimage.png?alt=media&amp;token=fdf94d42-09b3-4618-b120-58fa42df5262" alt="" width="563"><figcaption></figcaption></figure>

Para coletar dados, usaremos as ferrementas do grupo ***Inputs***.

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FpjhdlB9t7xNoTZI4j9Iz%2Fimage.png?alt=media&amp;token=491d4206-9f8a-4fb5-a10b-ad2dbc4fbfda" alt=""><figcaption></figcaption></figure>

Arraste a ação desejava para dentro do ***Group #1***. No exemplo usaremos o e-mail, mas você pode utilizar essa ferramenta para coletar texto, resposta em número, site, data, telefone, etc.

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2F0RzG3pZ6qMeQTf3Dotp5%2Fimage.png?alt=media&amp;token=9ce02594-40b7-4ea8-be12-82620fddcc8d" alt="" width="300"><figcaption></figcaption></figure>

Para a próxima ação, você arrastará a ação para fora do ***Group #1***, gerando uma nova ação. Isso fará com que a próxima ação só seja executada após a resposta do cliente.

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FaHM0b7IyZiCdkjUcljUI%2Fimage.png?alt=media&amp;token=5c481891-b34f-449d-a0e7-84575fa50769" alt="" width="464"><figcaption></figcaption></figure>

Na segunda mensagem, queremos que o cliente nos responda novamente, para isso usaremos a opção de coleta de **texto**.

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2Fa2Vr8P4lDfqMU3DIrNfh%2Fimage.png?alt=media&amp;token=bb48700c-1d39-4480-af6c-312f90429f8a" alt=""><figcaption></figcaption></figure>

Arraste para dentro do ***Group #2***, clique em ***Type your answer*** e um pop up irá se abrir.

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FM4esket5Qx8fy1dS2Y4O%2Fimage.png?alt=media&amp;token=6cabc901-f3e7-481d-98cf-f2a31c093c4d" alt=""><figcaption></figcaption></figure>

Clique no botão destacado (***passo 1***) e insira um nome para essa resposta (***passo 2***). Ex: resposta 1

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FXWYGtxr9ut8Inw7mIvmg%2Fimage.png?alt=media&amp;token=6f44f0e8-92ba-41d7-b18f-f4bfcdc09cf2" alt="" width="342"><figcaption></figcaption></figure>

Clique em ***+ Create*** (***passo 3***), em seguida clique em ***Select a variable*** (***paasso 4***) e insira a resposta que acabou de criar. Vai ficar assim:<br>

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FKnBAW6jrKALIAzaAYjs2%2Fimage.png?alt=media&amp;token=aff7892c-3d6d-434e-a323-479b48722595" alt=""><figcaption></figcaption></figure>

Para que cada resposta traga uma ação diferente, vamos usar a ferramenta ***Condition*** do grupo ***Logic.***

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FCvltsjvTKJKL2KVUWgz1%2Fimage.png?alt=media&amp;token=3047c9fc-f103-4866-8c8a-eb4217b0d96f" alt=""><figcaption></figcaption></figure>

Arraste para dentro do ***Group #2***, clique em ***Configure*** e em seguida ***+ Add comparison.***

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FSrg10bUTA1lFE3FBWuNS%2Fimage.png?alt=media&amp;token=a5071136-b7fb-46e7-b22d-b5d7ed303d70" alt="" width="364"><figcaption></figcaption></figure>

Um pop up se abrirá. Siga o passo a passo.

1. Clique em ***Search for a variable*** e insira a resposta que criou.
2. Em ***Select an operator*** selecione ***Equal to.***
3. Em ***Type a value*** digite o número que deseja na resposta. Nesse exemplo vamos digitar o número 1.
4. Clique fora do pop up.

Para adicionar uma segunda resposta, clique no **+** entre as duas variáveis e repita o passo anterior, substituindo o número 1 por 2. Confira o exemplo:

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FhT58YonxFkxjq9p2jFsv%2FDesign%20sem%20nome%20(2).gif?alt=media&amp;token=d7ce16ad-7d36-4080-9c83-c53be33207c5" alt="" width="375"><figcaption></figcaption></figure>

{% hint style="info" %}
*Lembre-se de conectar todas as ações na ordem que deseja que ocorram, inclusive o **Start**.*
{% endhint %}

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2FGV0Gz1X8lv9w2RxLywL2%2FDesign%20sem%20nome%20(3).gif?alt=media&amp;token=6454299e-f955-4c7b-9e97-d859e31cbdaa" alt="" width="375"><figcaption></figcaption></figure>

> Repare que o **Senão** é conectado a uma mensagem (***Group #5***) e essa mensagem é conectada ao coletor de resposta novamente. Isso significa que, caso o contato responda qualquer outra coisa que não tenha sido cadastrada, nesse exemplo são os número ***1*** e ***2***, ela vai receber essa mensagem e em seguida vai ser solicitado uma nova resposta, criando assim um looping que permanece até que aja o acerto.&#x20;

## Como realizar a integração Typebot

Para fazer a integração é ainda mais simples. Você deverá clicar em ***Compartilhar***, na parte superior da sua área de trabralho, e em seguida clicar em ***Copiar***.

<figure><img src="https://3500494372-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhAxi0khdBH3ucmx9gEjE%2Fuploads%2F0uYH0ySI3zTdOeD3Iw1T%2Fimage.png?alt=media&amp;token=476f95a1-4a20-4b94-9f14-cc89d27f0c72" alt="" width="562"><figcaption></figcaption></figure>

Em seguida você irá colar essa ***URL*** na conversa com um o seu consultor comercial, e ele fará a integração para você. Pronto! Sua conexão agora possui um ***Bot de Atendimento*** personalizado.