100% FREE · NO SIGNUP · UNLIMITED

Criador de Diagrama de Estado Grátis Online

Modele o que seu sistema É em qualquer momento — estados, transições, guardas e eventos. O BPMN diz o que ele faz; o diagrama de estado diz o que ele é.

auto-detect · we pick the diagram type for you  ·  ⌘↵ to run

Free forever · no signup · no credit card · unlimited diagrams

Live sample · CI/CD pipeline — type above to make your own
CI/CD Pipeline — Flowchart Flowchart with 13 nodes and 15 edges. CI/CD Pipeline A → B B → C C → D D → E: no no E → A D → F: yes yes F → G G → H H → I: no no I → E H → J: yes yes J → K K → L: no no L → E K → M: yes yes CI Passes? CI Passes? Build Image Build Image Deploy Staging Deploy Staging Stage OK? Stage OK? Rollback Staging Rollback Staging Deploy Prod Deploy Prod Canary OK? Canary OK? Rollback Prod Rollback Prod Released Released Notify Author Notify Author Dev Push Dev Push Lint Lint Unit Tests Unit Tests

Como fazer um diagrama de estado

  1. Liste os estados que seu sistema pode ter

    Comece com uma frase em português claro: nomeie o objeto (um pedido, uma sessão de usuário, um dispositivo) e liste os estados pelos quais ele passa. Inclua estados terminais como entregue ou cancelado.

  2. Gere o diagrama de estado

    Clique em Gerar e o FreeDiagram produz um diagrama de máquina de estado UML com pseudo-estado inicial, caixas de estado com formato correto e setas de transição rotuladas.

  3. Adicione guardas e ações

    Refine com prompts complementares — adicione uma condição de guarda ('somente se pagamento confirmado'), uma ação de entrada ou um estado composto que aninhe subestados.

  4. Exporte para documentação ou implementação

    Baixe como SVG ou PNG para documentos de design, ou copie o código Mermaid para colar diretamente no GitHub, Notion ou sua wiki.

Sobre diagramas de estado

Frequently asked questions

Para que serve um diagrama de estado?

Diagramas de estado modelam o ciclo de vida de um objeto ou sistema — cada condição em que pode estar e cada evento que o move entre condições. Usos comuns incluem status de pedidos de e-commerce, gerenciamento de sessão de usuário, estados de componentes de UI, protocolos de rede e firmware de dispositivos embarcados.

Qual a diferença entre um diagrama de estado e um fluxograma?

Um fluxograma modela um processo — uma sequência de passos. Um diagrama de estado modela um objeto — o conjunto de condições que ele pode ocupar. Fluxogramas respondem 'o que acontece depois?'; diagramas de estado respondem 'o que o sistema é agora?'. Use um diagrama de estado quando o mesmo evento pode ter efeitos diferentes dependendo do estado atual.

O que é uma condição de guarda em um diagrama de estado?

Uma condição de guarda é uma expressão booleana que deve ser verdadeira para que uma transição ocorra. É escrita entre colchetes na seta de transição — por exemplo, 'pagamentoRecebido [saldo >= total]'. As guardas permitem modelar transições condicionais sem adicionar estados extras.

Posso modelar estados compostos com subestados aninhados?

Sim. Descreva o aninhamento no seu prompt — por exemplo, 'o estado Processando contém os subestados Separando, Embalando e Etiquetando'. O FreeDiagram renderizará um estado composto com os subestados dentro e uma transição compartilhada para fora.

A saída segue os padrões UML?

Sim. O FreeDiagram usa a notação UML State Machine — pseudo-estado inicial (círculo preenchido), estados (retângulos arredondados), estado final (alvo) e setas de transição rotuladas. A saída é compatível com padrões de documentação usados em arquitetura de software e design de sistemas.

Criador de Diagrama de Estado Grátis — UML Online com IA