Create stunning diagrams in Google Workspace™ with onleeAssistant

Unleash the power of visual communication within Google Workspace™!

onleeAssistant now boasts an exclusive feature that lets you effortlessly create a wide variety of diagrams using the popular Mermaid syntax. Whether you need to brainstorm ideas with a mind map, visualize a process with a flowchart, or illustrate a complex system, onleeAssistant makes it easy.

And the best part? You don't need to be a Mermaid expert to get started!

Getting Started - Creating Your First Diagram (Step-by-Step)

1. Access onleeAssistant:

Open any file in Google Docs, Sheets, Slides, or Drive, or an email in Gmail.
Launch the onleeAssistant add-on from the sidebar.

2. Craft Your Prompt:

In the onleeAssistant chat, tell it what kind of diagram you want and be sure to include the phrase "use mermaid syntax".

Example: "Create a flowchart that illustrates the steps involved in publishing a blog post, use mermaid syntax."

Example: "Generate a mind map for brainstorming ideas for our next marketing campaign, use mermaid syntax."

3. Generate the Diagram Code:

onleeAssistant will generate the Mermaid code for your diagram.

4. Visualize and Customize:

A button labeled "Open Diagram" will appear.

Click it to open your diagram on our dedicated customization site: mmdviewer.onlee.xyz

On mmdviewer.onlee.xyz:

You'll see your diagram rendered beautifully.

Customize: Change the labels of any element by simply clicking on them and editing the text.
Change Colors: Modify the colors of individual elements or the entire diagram to match your preferences or brand guidelines.

=> Click render diagram to view change

5. Download as png

Download your diagram as a PNG image to use in presentations, documents, or websites.

Supported Diagram Types

onleeAssistant supports a wide range of diagram types thanks to Mermaid's versatility. Here are some of the most popular:

Flowcharts: Visualize processes, workflows, and decision-making trees.
Mind Maps: Brainstorm ideas, organize thoughts, and explore connections between concepts.
Sequence Diagrams: Illustrate interactions between objects in a system over time.
Class Diagrams: Show the structure of a system in terms of classes, attributes, and relationships.
State Diagrams: Model the different states of an object or system and the transitions between them.
Gantt Charts: Plan and track project timelines and tasks.
Pie Charts: Represent data proportions visually.

And more! Explore the full range of Mermaid diagram types on the official Mermaid website.

Prompt : create a sequence diagram of the differents sessions. Use mermaid syntax

Create diagrams in all your Google Workspace Apps

You can leverage onleeAssistant's diagram creation feature across all the major Google Workspace applications:

Gmail: Generate a flowchart to explain a complex email thread or create a mind map to summarize key discussion points.
Google Docs: Add diagrams to your documents to enhance clarity and visual appeal. Create flowcharts for processes, mind maps for outlining, and more.
Google Sheets: Visualize data relationships or create diagrams to illustrate spreadsheet-based workflows.
Google Slides: Make your presentations more engaging with dynamic diagrams. Use mind maps to brainstorm slide content or flowcharts to illustrate processes.
Google Drive: Generate diagrams from any document in your Drive.

Make advanced diagrams

Custom box color for the diagram generated.

If you're already comfortable with Mermaid syntax, you can take your diagram creation to the next level with onleeAssistant:

Combine with Text Prompts: Mix natural language instructions with Mermaid code snippets to fine-tune your diagrams.

Change design : Ask in the prompt specific colors for text and box

Add comments: Add in your prompt comments to get a more explicit mermaid code generated.

🪜 Example: A product manager could create a detailed flowchart outlining a new feature development process, including subgraphs for different stages (design, development, testing) and styling to highlight key decision points. Then they could easily share it with their team using a direct link to mmdviewer.onlee.xyz.

💡 Example : A teacher could create interactive class diagram for students so that each class item can be clicked to navigate to the course content.

Create an onleeAssistant agent

onleeAssistant is the only application that allow you to create AI Agent in Google Workspace. To get the most from onleeAssistant will be there to help you in the creation.

Create websearch agent that will check on the mermaid site to get the appropriates information.

Agent Name : Give your name

Instruction : Use Mermai Syntax. You are an expert in mermaid syntax and diagram creation. Create a visualisation based on request.

Tool : Web Search

Prefix : site:https://mermaid.js.org/

This agent will search on the mermaid site first to get information and technical details befiore to create the diagram.

✅ Now select your agent in the onleeAssistant interface to get help for creating your diagrams.

1️⃣ Setup

2️⃣ In action