Drawnix: uma ferramenta de quadro branco de código aberto com mapeamento mental e fluxograma integrados

O Drawnix é uma poderosa ferramenta de quadro branco on-line de código aberto que integra mapeamento mental, fluxograma e funcionalidade de desenho à mão em uma tela infinita, proporcionando aos usuários a liberdade de criar. A ferramenta é gratuita e pode ser usada diretamente no navegador, sem instalação e implantação complexas. O Drawnix foi desenvolvido com base em uma arquitetura de plug-in, o que o torna altamente extensível e capaz de suportar diferentes estruturas de front-end e editores de rich text. A ferramenta oferece suporte ao salvamento automático, que armazena dados no cache do navegador, evitando efetivamente a perda de dados. Além disso, ela suporta a exportação de conteúdo para vários formatos e oferece uma experiência consistentemente boa em desktops e dispositivos móveis. Para os usuários que estão acostumados a gerar diagramas usando código, o Drawnix também oferece suporte à conversão direta para fluxogramas e mapas mentais por meio da sintaxe Mermaid e do texto Markdown.

Lista de funções

• gratuito e de código abertoOs usuários podem usar todos os recursos gratuitamente, bem como o desenvolvimento secundário e a implementação privada de acordo com suas necessidades.
• integração multifuncionalFerramentas de desenho: suporta mapeamento mental, fluxograma, desenho à mão, desenho de formas, linha e texto para atender a diversas necessidades de desenho.
• Arquitetura de plug-inO subjacente é baseado na estrutura Plait, que suporta a integração de várias estruturas de interface do usuário (por exemplo, Angular, React) e estruturas de rich-text.
• Tela ilimitadaOferecendo espaço criativo ilimitado, os usuários podem aplicar zoom e rolar a tela à vontade.
• salvamento automáticoO conteúdo da plotagem é salvo automaticamente no cache do navegador para evitar a perda de dados devido a circunstâncias imprevistas.
• Vários formatos de exportaçãoSuporte à exportação de trabalhos para formatos de imagem, como PNG, JPG, etc., ou.drawnixdo arquivo JSON.
• Modo TemaTemas: Vários temas estão incorporados, incluindo os modos Padrão, Colorido, Suave, Retrô, Noite Escura e Noite Estrelada, que os usuários podem alternar de acordo com suas preferências.
• Uso em várias plataformasDesign responsivo: o design responsivo garante uma excelente experiência operacional tanto em computadores quanto em dispositivos móveis.
• Gráficos gerados por códigoSuporte para conversão de blocos de código em fluxogramas usando a sintaxe Mermaid e para conversão de texto Markdown em um mapa mental (novo suporte 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥).
• Funções avançadas de edição: fornece funções básicas de edição, como desfazer, refazer, copiar e colar.

Usando a Ajuda

O Drawnix foi projetado para oferecer uma experiência "pronta para uso", permitindo que os usuários acessem diretamente seu site oficial em https://drawnix.com para começar a usar sem precisar fazer download ou instalar qualquer software.

Instalação e implementação local

Para usuários que desejam fazer desenvolvimento secundário ou implantação privada, siga as etapas abaixo para instalar o Drawnix em seu ambiente local.

Requisitos ambientais.
Antes de começar, certifique-se de que seu computador tenha aNode.js.

Etapas de instalação.

1. Download do código-fonte:
   Visite a página do repositório GitHub do Drawnix (https://github.com/plait-board/drawnix), clique no botão "Code" (Código) na página e selecione "Download ZIP " para fazer o download do código-fonte do projeto localmente.
2. Descompacte o arquivo:
   Extraia o arquivo ZIP baixado para qualquer pasta de sua escolha.
3. Instalação de dependências:
   Abra uma ferramenta de linha de comando (por exemplo, Terminal ou CMD) e vá para o diretório raiz do projeto extraído. Execute o seguinte comando para instalar os pacotes de dependência necessários para o projeto:

npm install

Esse processo pode levar algum tempo, pois ele fará o download e instalará todas as dependências necessárias.

4. Início de projetos:
   Quando a instalação da dependência estiver concluída, execute o seguinte comando na linha de comando para iniciar o aplicativo Drawnix:

npm run start

Após a execução bem-sucedida do comando, você verá na linha de comando que o aplicativo foi iniciado com êxito e será solicitado a acessar o arquivohttp://localhost:4200(ou outra porta, conforme especificado).

5. Acesso a aplicativos:
   Abra seu navegador e digite o endereço acima para começar a usar toda a funcionalidade do Drawnix em seu ambiente local.

Guia de operação das funções principais

1. mapas de pensamento

• Criação de nósClique duas vezes com o mouse em um espaço em branco na tela para criar um nó raiz.
• Adição de nós filhosSelecione um nó e você verá um ícone "+" ao redor do nó; clique nele para criar um nó filho abaixo do nó.
• Editar textoClique duas vezes em qualquer nó para entrar no modo de edição de texto e modificar o conteúdo do texto no nó.
• arrastar e soltar (computação)Arrastar um nó: Manter o botão esquerdo do mouse pressionado e arrastar um nó altera sua posição no mapa mental. Arrastá-lo para outro nó altera sua relação pai-filho.

2. fluxograma

• Criação de gráficosForma do fluxograma: Selecione a forma desejada do fluxograma (por exemplo, retângulo, diamante, círculo etc.) na barra de ferramentas à esquerda e arraste e solte-a na tela para desenhá-la.
• linha de conexãoSelecione um gráfico e passe o mouse sobre as bordas do gráfico e os pontos de conexão aparecerão. Mantenha o botão esquerdo do mouse pressionado e arraste do ponto de conexão de um gráfico até o ponto de conexão de outro gráfico para criar uma linha de conexão.
• Como adicionar setasQuando você arrasta uma linha da borda de uma figura, pode criar setas com direções para indicar o sentido do fluxo.

3. desenho à mão livre e ferramentas de forma

• ferramenta de pincelPincel: Selecione a ferramenta Pincel na barra de ferramentas à esquerda para desenhar à mão livre diretamente na tela, adequada para esboços e etiquetas rápidas.
• Ferramentas de formaBarra de ferramentas: A barra de ferramentas oferece uma variedade de formas básicas, como retângulos, círculos, triângulos etc., que podem ser selecionadas e desenhadas diretamente na tela.
• Inserir imagemImagem: Ao clicar no ícone Imagem na barra de ferramentas, você pode carregar uma imagem local e inseri-la em qualquer lugar da tela.

4. suporte à sintaxe Mermaid e Markdown

• Markdown para mapa mentalSelecione a ferramenta Markdown na barra de ferramentas, cole o texto escrito em Markdown e o Drawnix o converterá automaticamente em um mapa mental estruturado.
• Sereia para fluxogramaDa mesma forma, selecionar a ferramenta Mermaid e colar o código da sintaxe Mermaid pode gerar rapidamente o fluxograma correspondente.

5. operações do Canvas

• panorâmicaArraste a tela para panorâmica: Mantenha pressionado o botão do meio do mouse ou pressione o botão esquerdo do mouse enquanto mantém pressionada a barra de espaço para arrastar a tela para panorâmica.
• zoom (gráficos)Zoom: Use a roda do mouse para aumentar e diminuir o zoom da tela com facilidade para navegação infinita na tela.

cenário do aplicativo

1. Trabalho em equipe e brainstorming
   Em reuniões de equipe, os membros podem usar o Drawnix para fazer brainstorming juntos em uma tela infinita, registrar ideias em tempo real, desenhar mapas mentais e organizar os resultados da discussão em um fluxograma, o que melhora muito a eficiência da colaboração.
2. Planejamento e gerenciamento de projetos
   Os gerentes de projeto podem usar o Drawnix para criar fluxogramas de projeto, mapas mentais da estrutura de divisão de tarefas (WBS) e mostrar claramente as ligações e dependências entre as várias fases do projeto, facilitando a compreensão e a execução pelos membros da equipe.
3. Aprendizagem e organização do conhecimento
   Estudantes e pesquisadores podem usar o Drawnix para organizar suas anotações de aula, construir mapas mentais de seu corpo de conhecimento ou desenhar fluxogramas científicos complexos para tornar o conhecimento abstrato visualmente acessível.
4. Projeto e arquitetura de software
   Os desenvolvedores e arquitetos de software podem usar o Drawnix para desenhar diagramas de arquitetura de sistemas, diagramas UML e diagramas de fluxo de dados para ajudar as equipes a entender melhor o design do software e a lógica de interação entre os módulos.

QA

1. O Drawnix é totalmente gratuito?
   Sim, o Drawnix é uma ferramenta totalmente gratuita e de código aberto. Você pode usar todos os seus recursos gratuitamente e também pode desenvolvê-la duas vezes ou implantá-la de forma privada.
2. Meus dados estão seguros?
   Por padrão, o Drawnix salva automaticamente seus dados de desenho no cache local do navegador. Isso significa que os dados são armazenados em seu próprio dispositivo e não são carregados em um servidor em nuvem, mantendo-os privados.
3. Quais formatos de exportação são compatíveis com o Drawnix?
   Atualmente, você pode exportar o conteúdo da tela para formatos de imagem comuns, como PNG, JPG, etc., bem como para.drawnixpara facilitar a importação e a edição subsequentes.
4. É necessário registrar uma conta para usá-lo?
   Não. O Drawnix foi projetado para funcionar "fora da caixa", portanto, tudo o que você precisa fazer é abrir o site oficial e começar a criar instantaneamente, sem nenhum processo de registro ou login.