# Criar diagramas de fluxo online com conectores inteligentes no FlowBoard > Diagramas de fluxo no navegador: 20 tipos de elementos, setas que se prendem a 8 âncoras e rotas retas, ortogonais ou curvas que desviam das caixas. - **Fonte (source):** https://aistohire.com/pt/flowboard-quadro-branco-infinito-diagramas-131/f/criar-diagramas-de-fluxo-online - **Plataforma (platform):** AIstoHire - **Idioma (language):** pt ## Em resumo - Crie diagramas de fluxo online com 20 formas e conectores inteligentes - Retângulos, losangos, terminadores, cilindros e documentos conectados com setas que se prendem automaticamente a 8 âncoras, se dobram onde você quiser e desviam de qualquer coisa no meio. ## Crie diagramas de fluxo online com 20 formas e conectores inteligentes 20 tipos de elementos na mesma folha: as 12 formas clássicas do diagrama de fluxo (losango de decisão, terminador, documento, cilindro, processo predefinido…) e também notas, ícones, imagens, tabelas, cartões e quadros para agrupar. Imã a 8 âncoras: ao aproximar a extremidade da seta, os oito pontos da caixa se iluminam e se prendem ao mais próximo; não importa onde você mova a caixa, a seta vai com ela. Três traçados para a mesma seta: reto para o direto, ortogonal para o diagrama limpo em ângulo reto e curvo para os esquemas soltos, modificáveis com um clique sem refazer a conexão. Waypoints à mão: arraste a linha onde você quiser que passe e ela se dobra ali, até 20 pontos por conector; arraste o ponto para fora e ele desaparece. Desvie do que houver no meio: com “Evitar elementos” o traçado ortogonal é recalculado com uma busca A* em grade de 12 px e rodeia as caixas em vez de cruzá-las. Rótulos na própria seta: clique duas vezes e escreva “Sim”, “Não” ou a condição, em negrito e itálico, e o rótulo viaja com a linha quando você a move. Mude de forma sem refazer nada: um retângulo passa a ser um losango mantendo seu texto, seu estilo e todos os seus conectores, e a grade de 24 px com guias de alinhamento mantém o diagrama reto. Comece com o fluxo já montado: modelo “Diagrama de fluxo” com início, processo, decisão e fim conectados, geração com IA a partir de uma frase e importação de Mermaid, draw.io e Visio. Abra um novo quadro e escolha o modelo “Diagrama de fluxo”, que já traz início, processo, decisão e fim conectados, ou comece em branco. Para adicionar caixas, selecione a forma na barra de ferramentas e arraste-a para a tela; escreva dentro com um clique duplo. Para uní-las, ative a ferramenta de conector (tecla C), saia de uma caixa e solte na seguinte: a extremidade se prende automaticamente à âncora mais próxima. Se preferir partir do texto, descreva o processo em uma frase e a IA do FlowBoard desenhará o primeiro rascunho no quadro. Como faço um diagrama de fluxo online no FlowBoard? As 12 formas de processo são retângulo, retângulo arredondado, elipse, losango (decisão), triângulo, hexágono, paralelogramo (entrada/saída), estrela, documento, cilindro (armazenamento de dados), processo predefinido e terminador (início/fim). A essas se somam nota adesiva, texto formatado, ícone (catálogo de 120), imagem, quadro, tabela, cartão e grupo: 20 tipos de elementos no total. Qualquer uma das formas geométricas ou de fluxo pode ser convertida em outra sem perder seu texto, seu estilo ou seus conectores. Quais formas de diagrama de fluxo estão incluídas? Sim. Cada extremidade de um conector é salva como “elemento + âncora”, não como uma coordenada: quando você move, redimensiona ou gira a caixa, o traçado é recalculado e a seta continua saindo do mesmo ponto. Cada elemento oferece 8 âncoras (os quatro lados e os quatro cantos) e o ímã se ativa a 26 px de distância no mouse e 40 px na tela sensível ao toque. Nas Configurações, você pode ativar também a conexão livre na borda, que permite ancorar a extremidade em qualquer ponto do perímetro da forma. As setas ficam presas às caixas quando as movo? Sim, ativando a opção “Evitar elementos” do conector. Com o traçado ortogonal, o FlowBoard recalcula a rota com uma busca A* em uma grade de 12 px e a linha contorna os elementos que encontra no meio em vez de atravessá-los. Funciona quando o conector não tem waypoints próprios: se você dobrou a linha manualmente, dita seu percurso. Os traçados reto e curvo vão sempre do ponto A ao ponto B, e aqui você controla os detalhes finos arrastando a linha para criar waypoints (até 20 por conector). Posso evitar que as setas passem por cima de outras caixas? Em ambas as direções. O FlowBoard importa código Mermaid (colado ou de arquivo), arquivos .drawio do draw.io, .vsdx do Visio e cópias em JSON, e exporta para PNG, SVG, PDF, JSON e Mermaid. Você também pode mostrar o diagrama em tela cheia em modo apresentação sem sair do aplicativo. Cada quadro suporta até 1.500 elementos e 1.500 conectores, se autossalva enquanto você trabalha e conserva até 30 versões caso precise voltar atrás. Posso exportar o diagrama de fluxo ou trazê-lo de outro programa? FlowBoard é o editor de quadro branco e diagramas da AIsToHire, e os diagramas de fluxo são o que ele faz de melhor. Cada quadro suporta 20 tipos de elementos: 12 formas projetadas para processos —retângulo, retângulo arredondado, elipse, losango de decisão, triângulo, hexágono, paralelogramo, estrela, documento, cilindro de armazenamento, processo predefinido e terminador— além de notas adesivas, texto formatado, ícones, imagens, quadros, tabelas, cartões e grupos. Você escolhe a forma na barra, arrasta para a tela e ela se alinha a uma grade de 24 px com guias de alinhamento; se depois você mudar de ideia, a mudança de forma converte um retângulo em losango mantendo o texto, o estilo e as setas que já tinha. As setas são desenhadas com a ferramenta de conector (tecla C): você sai de uma caixa e solta em outra. Ao se aproximar a menos de 26 px de um elemento (40 em uma tela sensível ao toque), suas 8 âncoras —norte, sul, leste, oeste e os quatro cantos— se iluminam, e a extremidade se prende à mais próxima, então quando você move a caixa, a seta a segue sem se soltar. Se você preferir não depender dos 8 pontos, nas Configurações você pode ativar a conexão livre na borda, que permite colar a extremidade em qualquer ponto do perímetro. Uma extremidade também pode ficar solta em um ponto da tela ou começar em outro conector para ramificar um caminho sem tocar nas caixas. Cada conector suporta três traçados: reto, ortogonal (em ângulo reto) e curvo. Arraste qualquer ponto da linha e um waypoint é criado que a dobra bem ali —até 20 por conector— e arrastá-lo para fora o remove. Se você ativar “Evitar elementos”, o traçado ortogonal é recalculado com uma busca A* em uma grade de 12 px e a linha contorna as caixas que houver no meio em vez de atravessá-las; assim que você adiciona waypoints manuais, você dita seu percurso. O restante também se ajusta: clique duas vezes na linha para escrever o rótulo (“Sim”, “Não”, a condição) em negrito e itálico, cinco extremidades por lado (nenhuma, triângulo, triângulo aberto, losango e círculo), linha contínua, pontilhada ou de traços, quatro espessuras, cor e uma nota com links e arquivos anexados. O diagrama não fica no navegador. Cada quadro suporta até 1.500 elementos e 1.500 conectores, salva automaticamente enquanto você trabalha, tenta novamente se a conexão cair e mantém até 30 versões para as quais voltar. Você pode começar com o modelo “Diagrama de fluxo” —início, processo, decisão e fim já conectados— descrever o processo em uma frase e deixar que a IA o desenhe, ou importar o que você já tem no Mermaid, draw.io (.drawio) ou Visio (.vsdx); “Reorganizar automaticamente” reposiciona as caixas por camadas quando o fluxo fica bagunçado. E quando estiver pronto, pode ser exportado em PNG, SVG, PDF, JSON ou Mermaid, ou projetado em tela cheia no modo apresentação. - [FlowBoard — Quadro Branco Infinito para Diagramas e Ideias](https://aistohire.com/pt/flowboard-quadro-branco-infinito-diagramas-131) ## Sobre a plataforma **FlowBoard — Quadro Branco Infinito para Diagramas e Ideias** — uma aplicação de AIstoHire. Disponível em: https://aistohire.com/pt/flowboard-quadro-branco-infinito-diagramas-131/f/criar-diagramas-de-fluxo-online ### Outros idiomas - `es`: https://aistohire.com/es/flowboard-pizarra-infinita-diagramas-131/f/crear-diagramas-de-flujo-online - `en`: https://aistohire.com/flowboard-infinite-whiteboard-diagrams-131/f/create-flow-diagrams-online - `fr`: https://aistohire.com/fr/flowboard-tableau-blanc-infini-diagrammes-131/f/creer-des-diagrammes-de-flux-en-ligne - `it`: https://aistohire.com/it/flowboard-lavagna-infinita-diagrammi-131/f/creare-diagrammi-di-flusso-online - `de`: https://aistohire.com/de/flowboard-unendliche-tafel-diagramme-131/f/flussdiagramme-online-erstellen