How to draw a beautiful Sankey diagram ? A step by step tutorial

March 31, 2023
How to draw a beautiful Sankey diagram ? A step by step tutorial

Sankey diagrams are powerful tools that help us visualize the flow of information or materials from one source to another. They are widely used in various fields, including engineering, economics, and data analysis. In recent years, Sankey diagrams have gained popularity in user experience (UX) design as a way to understand user behavior and journeys on websites and apps. In this tutorial, we will go step-by-step on how to draw a beautiful Sankey diagram using 'Draw io'.

For the eagers that are searching for a free online Sankey diagram maker

Before starting, did you know there's a tool called Sankey Journey that can magically make all these steps happen in just one click? We will walk you to the draw.io tuto anyway, but if you want quick and beautiful results, this tool is worth considering!

This is the sankey diagrams you can expect using the free online tool Sankey Journey

For the others, here is the Draw.io tutorial to create Sankey diagrams

Step 1: Define the Scope and Purpose of Your Sankey Diagram

Before you start drawing your Sankey diagram, it is important to define the scope and purpose of your diagram. What do you want to show with your diagram? Do you want to analyze user behavior on a specific page or section of your website, or do you want to show the entire user journey? Once you have a clear understanding of your goals, you can start thinking about the different stages in your user journey and how they relate to each other.

Step 2: Choose a Tool to Create Your Sankey Diagram

There are many tools available to create Sankey diagrams, but for this tutorial, we will be using draw.io. Draw.io is a free online diagramming tool that allows you to create flowcharts, diagrams, and other visual representations. You can use it directly in your browser or download the desktop app for offline use.

Step 3: Create a New Diagram

Once you have chosen your tool, it's time to create a new diagram. In draw.io, you can create a new diagram by clicking on the "New Diagram" button. You can also choose from a variety of templates to get started quickly.

Step 4: Add Your Data

The next step is to add your data to your diagram. In Sankey diagrams, the data is usually represented as a flow from one stage to another. You can add your data by using the shape tool in draw.io and drawing rectangles or circles to represent your stages. You can then connect your stages using arrows or lines to show the flow of information or materials.

Step 5: Customize Your Diagram

Now that you have added your data to your diagram, it's time to customize it. You can change the color, font, and style of your shapes to make them more visually appealing. You can also add labels to your shapes to make them more informative.

Step 6: Fine-Tune Your Diagram

Once you have customized your diagram, it's time to fine-tune it. You can adjust the size and position of your shapes to make them fit together nicely. You can also adjust the thickness of your arrows or lines to make them more visible.

Step 7: Review and Refine Your Diagram

Finally, it's time to review and refine your diagram. Take a step back and look at your diagram as a whole. Does it effectively communicate the flow of information or materials from one stage to another? Is it easy to understand and visually appealing? If not, you may need to make some adjustments and refinements.

Conclusion

In conclusion, Sankey diagrams are a powerful tool that can help you understand user behavior and journeys on websites and apps. With draw.io, creating a Sankey diagram is definitely possible and offer a lot of customization. By following these simple steps, you can create a beautiful and informative Sankey diagram that will help you analyze user behavior and make informed decisions about your website or app.

If you're looking for an easy and straightforward tool to achieve beautiful Sankey charts in one minute, consider trying out Sankey Journey. You will thank us later. 

TRY FOR FREEBook a demo