O que é o Flowchart Maker?
O Flowchart Maker é uma ferramenta interativa de arrastar e soltar para criar fluxogramas profissionais, diagramas de processos e visualizações de workflows — tudo direto no seu navegador. Com 37 tipos de formas, incluindo caixas de processo, losangos de decisão, bancos de dados, tabelas, swimlanes e muito mais, você pode criar desde simples árvores de decisão até arquiteturas de sistemas complexas.
Para Quem é Esta Ferramenta?
Desenvolvedores de Software
Analistas de Negócios
Estudantes
Gerentes de Projetos
Seus Dados Ficam Privados
Todo o processamento acontece no seu navegador — nada é enviado para um servidor.
- Sem uploads — seus diagramas nunca saem do seu dispositivo
- Sem rastreamento — não coletamos dados de uso
- Salvamento automático — seu trabalho é salvo automaticamente no armazenamento local do navegador
- 1. O que é o Flowchart Maker?
- 2. Como Usar o Flowchart Maker
- 3. Funcionalidades
- 4. Perguntas Frequentes
- 4.1. Como conecto duas formas?
- 4.2. Como adiciono rótulos como "Sim" ou "Não" às conexões?
- 4.3. Como edito uma célula de tabela?
- 4.4. Como seleciono várias formas de uma vez?
- 4.5. Como alinho as formas de forma organizada?
- 4.6. Posso salvar meu fluxograma?
- 4.7. Quais formatos de exportação estão disponíveis?
- 4.8. Como trabalho em vários diagramas?
- 4.9. Quais atalhos de teclado estão disponíveis?
- 4.10. Meus dados são privados?
Como Usar o Flowchart Maker
Começar é simples. Veja um guia completo das interações principais — desde posicionar formas até exportar seu diagrama finalizado.
Criando Formas
Escolha entre 37 tipos de formas na barra lateral esquerda, organizadas em grupos: Básico, Controle de Fluxo, Dados, Tipos de Processo, Anotações, Adicional, Lógica/Junção, Armazenamento e Mais Formas.
- Clique em uma forma na barra lateral para posicioná-la no centro da tela
- Arraste uma forma da barra lateral e solte em qualquer lugar da tela
- As formas se encaixam automaticamente em uma grade de 20px para um alinhamento organizado
Conectando Formas
- Passe o mouse sobre uma forma para revelar os pontos de conexão azuis nas suas bordas
- Clique em um ponto e depois em outro ponto em uma forma diferente para criar uma conexão curva
- Adicione rótulos (como "Sim" ou "Não") às conexões pelo painel de propriedades
- Escolha entre 4 tipos de seta: frente, trás, ambas as direções ou sem setas
Editando Formas
- Dê um duplo clique em qualquer forma para editar seu texto
- Use o painel de propriedades à direita para alterar cores, bordas, opacidade, tamanho da fonte e dimensões
- Arraste as alças de redimensionamento quadradas ao redor de uma forma selecionada para redimensioná-la
Trabalhando com Tabelas
- Adicione uma forma de Tabela do grupo Adicional na barra lateral
- Dê um duplo clique em qualquer célula para editar seu conteúdo
- Pressione Tab para ir para a próxima célula, Shift+Tab para voltar
- Use os botões do painel de propriedades para adicionar ou remover linhas e colunas
Organizando Seu Diagrama
- Selecione várias formas com Ctrl+Click ou arraste um retângulo de seleção
- Use as ferramentas de alinhamento (aparecem quando 2 ou mais formas estão selecionadas) para alinhar ou distribuir uniformemente
- Clique em Layout Automático para organizar automaticamente todas as formas em um layout hierárquico
- Agrupe formas com Ctrl+G para movê-las juntas
Exportando Seu Trabalho
PNG
SVG
JSON
Funcionalidades
37 Tipos de Formas
Uma biblioteca completa com todos os símbolos padrão de fluxograma, além de formas adicionais para casos de uso especializados:
Básico e Controle de Fluxo
- Básico — Processo, Início/Fim, Subprocesso, Processo Predefinido
- Controle de Fluxo — Decisão, Mesclagem, Conector, Fora da Página
- Anotações — Nota, Exibição
Dados e Tipos de Processo
- Dados — Entrada/Saída, Banco de Dados, Documento, Múltiplos Documentos, Armazenamento Interno
- Tipos de Processo — Operação Manual, Preparação, Atraso, Entrada Manual
Lógica e Armazenamento
- Lógica — Porta Ou, Junção de Soma, Coletar, Ordenar, Extrair, Limite de Loop
- Armazenamento — Dados Armazenados, Dados Diretos
Adicional e Mais Formas
- Adicional — Texto Livre, Tabela, Nuvem, Estrela, Balão, Seta, Círculo, Swimlane
- Mais — Cartão, Fita, Losango, Retângulo Arredondado, Hexágono, Linha H, Linha V, Colchete, Chave
Conexões Inteligentes
Conecte formas com curvas bezier suaves. Adicione rótulos de texto às conexões, escolha entre 4 tipos de seta e personalize a cor, espessura e estilo da linha — sólida, tracejada ou pontilhada.
Tabelas Interativas
Adicione formas de tabela com células totalmente editáveis. Dê um duplo clique em qualquer célula para editar, use Tab para navegar entre as células e adicione ou remova linhas e colunas diretamente pelo painel de propriedades.
Ferramentas de Precisão
Guias de Alinhamento
Linhas de alinhamento aparecem automaticamente ao arrastar formas próximas a outras, para um posicionamento perfeito ao pixel.
Alinhar e Distribuir
Alinhe formas à esquerda, ao centro, à direita, ao topo, ao meio ou à base — e distribua-as uniformemente com um clique.
Layout Automático
Organize automaticamente todas as formas em uma estrutura hierárquica limpa com um único clique.
Encaixe na Grade
As formas se encaixam em uma grade de 20px, mantendo seus diagramas sempre alinhados e organizados.
Navegação
- Minimapa — painel de visão geral com clique para navegar em diagramas grandes
- Zoom — roda do mouse, botões ou ajustar à tela (10% a 500%)
- Panorâmica — arrastar com botão direito, arrastar com botão do meio ou ferramenta de mão (H)
- Pesquisa — encontre e substitua texto em todas as formas com Ctrl+F
Área de Trabalho com Múltiplos Diagramas
Trabalhe em vários diagramas em abas separadas. Adicione, renomeie, duplique ou exclua diagramas conforme necessário. Cada aba mantém seu próprio conjunto independente de formas, conexões e estado de visualização.
Exportar e Importar
Exporte seu fluxograma como PNG (alta resolução), SVG (vetorial) ou JSON (dados). Importe arquivos JSON para continuar editando ou compartilhar diagramas entre dispositivos.
12 Modelos Prontos
Comece rapidamente com modelos pré-criados para os casos de uso mais comuns:
Geral
Negócios
Técnico
Perguntas Frequentes
Como conecto duas formas?
Passe o mouse sobre uma forma para ver os pontos azuis aparecerem nas suas bordas. Clique em um ponto e depois em um ponto de outra forma — uma seta curva as conectará. Você também pode pressionar C para alternar para o modo Conectar.
Como adiciono rótulos como "Sim" ou "Não" às conexões?
Clique em uma conexão para selecioná-la. No painel de propriedades à direita, digite o texto do rótulo no campo Rótulo. O texto aparecerá no ponto médio da conexão.
Como edito uma célula de tabela?
Dê um duplo clique em qualquer célula de uma forma de tabela. Digite seu conteúdo e pressione Enter para salvar. Pressione Tab para ir para a próxima célula ou Shift+Tab para voltar.
Como seleciono várias formas de uma vez?
Segure Ctrl e clique em cada forma individualmente. Ou clique em uma área vazia da tela e arraste para criar um retângulo de seleção — todas as formas dentro dele serão selecionadas.
Como alinho as formas de forma organizada?
Selecione duas ou mais formas. Os botões de alinhamento aparecerão na barra de ferramentas. Clique para alinhar à esquerda, ao centro, à direita, ao topo, ao meio ou à base. Com 3 ou mais formas selecionadas, você também pode distribuí-las uniformemente.
Posso salvar meu fluxograma?
Seu trabalho é salvo automaticamente no armazenamento local do seu navegador. Para salvar uma cópia portátil, clique em Exportar → JSON. Você pode importar esse arquivo depois para continuar editando em qualquer dispositivo.
Quais formatos de exportação estão disponíveis?
PNG para imagens (resolução 2x), SVG para gráficos vetoriais escaláveis e JSON para dados do diagrama que podem ser reimportados e editados posteriormente.
Como trabalho em vários diagramas?
Clique no botão + ao lado das abas de diagrama na barra de ferramentas para criar uma nova aba. Cada aba tem sua própria tela independente. Clique no menu de três pontos em qualquer aba para renomear, duplicar ou excluí-la.
Quais atalhos de teclado estão disponíveis?
Pressione ? para ver a lista completa. Os principais atalhos incluem:
- V — Modo de seleção
- H — Modo de panorâmica
- C — Modo de conexão
- Ctrl+Z — Desfazer
- Ctrl+C / Ctrl+V — Copiar / Colar
- Ctrl+F — Pesquisar
- Ctrl+G — Agrupar formas
Ainda não há comentários. Seja o primeiro a comentar!