Neste artigo será apresentado uma ferramenta gratuita utilizada para produção de diversos tipos de diagrama, UML, Infraestrutura, etc.
Draw IO
O Draw.io é um editor de diagramas e fluxogramas online e grátis. Como o Draw.io é online e gratuito, o usuário pode usá-lo no navegador do PC (Windows, macOS ou Linux), sem precisar fazer download.
O Draw.io é um editor gráfico online no qual é possível desenvolver desenhos, gráficos e outros sem a necessidade de usar um software caro e pesado.
Com um layout simples e fácil, o serviço permite ao usuário criar seus próprios processos, inserindo uma grande variedade de formas, textos, setas indicativas, e alterar cores e espessuras de traços.
Para manter seus trabalhos a salvo, é possível conectá-lo com sua conta no Google Drive. Com isso, eles ficam disponíveis para serem alterados. Se não guardar na nuvem, o arquivo fica salvo em um formato fechado (.JPG ou .PNG), assim não é possível fazer nenhuma modificação.
Para acessar o software abasta entrar pelo link: https://draw.io/
Ao acessa irá aparecer uma tela onde poderá escolher onde será gravado o seu diagrama, sendo diversas opções de nuvem ou máquina local.

Após escolher o local onde salvar o diagrama, é aberto a tela inicial do sistema sugerindo algumas opções de diagramas e o nome do seu arquivo:

Como podemos visualizar, temos diversos tipos, software, cloud, gráficos, negócios, uma cadeia diversa de diagramas pré-prontos para serem produzidos.
Ao escolher um modelo é aberto a tela inicial do sistema com o diagrama escolhido:

1. São os menus iniciais:
· Ficheiro: onde possui as funções padrões dentre salvar, compartilhar, renomear, configurar página, imprimir.

· Editar: funções de copiar, colar, substituir, funções de seleção.

· Visualização: com as opções de ativar e desativar os itens de tela.

· Ordenar: com as funções de ordem dos itens, sendo para frente, atrás, para o fundo, sobreposto, rotação, agrupamentos, etc.

· Extras: configurações de linguagem, ferramentas, extensões, tema, exibição de complementos, etc.

· Ajuda: ajudas rápidas para a ferramenta.

2. Barra auxiliar de funções rápidas:
· Primeiro item é de exibição dos painéis de tela, sendo eles: da esquerda de formas e da direita de formatação.

· Os outros itens, são ferramentas rápidas, zoom, desfazer, restaurar, agrupar/desagrupar, ferramenta de cores, ligações, adição de itens e tabela.

4. Menu lateral esquerdo de Formas:
· Neste menu lateral é possível pesquisar as formas, vale lembrar que a ferramenta é em Inglês então o termos devem ser na linguagem americana. Com ele podemos pesquisar diversas formas existentes na ferramenta, não se limitando ao tipo de diagrama específico escolhido.

5. Área de trabalho:
· Na área central se encontra a área de trabalho do Draw.io, onde serão produzidos os gráficos, diagramas, etc.

6. Menu lateral direito Formatações:
· Neste menu encontramos a formatações de acordo com os itens selecionados no diagrama. Como exemplo foi selecionado o “retângulo”.

· Com escolhemos o retângulo, pode-se observar que temos 3 abas auxiliares, sendo elas:
o “Estilo”, onde pode ser alterado toda formatação de cor, preenchimento, bordas, linhas, espessura, arredondamento, etc.
o “Texto”, podemos editar o tipo de letra, tamanho, orientações, formatações especiais, quebras, etc.
o “Ordenar”, onde encontra ajustes de tamanho, ordem do objeto, ângulo, alinhamento, agrupamentos, ajuste de tamanho, etc.