Exploring structured data as graphs in Miro

Benjamin Degenhart
Miro Engineering
Published in
4 min readJan 9, 2023

How visualizing structured data can benefit organizations and a few thoughts on how to do it.

Hi, I am Benjamin. I am a software engineer at DigitalService in Berlin, Germany. We develop digital solutions for and with the Federal administration. Since my Master’s Thesis about the semantics of robotic grasping, I became a big fan of all things related to semantic web, knowledge graphs and ontologies. Therefore, it was only a question of time until I would start to wonder if we might benefit from structured data in the form of graphs in some areas of the DigitalService. So I invited a few colleagues for a small workshop. Since we use Miro a lot in our everyday work, it was a natural choice to use it in this workshop too.

How might we use structured data?
After an introduction and some examples, I asked everyone to brainstorm on areas of the company where structured data could be beneficial.

A flow chart of sticky notes in Miro
Simple exemplary graph in Miro about the coding background of employees

Skills and tech stack experience as graphs
For instance, it could be interesting to build a graph of the skills and tech stack experience our engineers have. In that way, that graph could conveniently be queried in SPARQL with questions like: “In the context of our Spring backend with a PostgreSQL database and a Vue Frontend — who might be able to help me with getting started with Reactive?”.

Furthermore, people could add things they want to learn in the future into the graph. This way it can be taken into account when staffing new projects.

Increased visibility into team challenges
Another area could be attempting to develop a vocabulary for describing challenges teams are facing in their projects. That way patterns and opportunities for shared problem-solving could become more visible.

Map out problems we all face
Yet another area could be to gather structured feedback regarding pain points citizens experience when interacting with the administration.

A lot of us get approached by friends and family with things like: “Oh, please fix XYZ next!”. And of course, we are noticing those things ourselves too. While we can’t just go ahead and solve all of these problems, it could be revealing to map them out and scan them for common root causes and patterns.

Bring it to life with a visualization
We then proceeded to model some of these areas as knowledge graphs: nodes connected by directed edges. In other words, triples consisting of subjects, predicates and objects. I asked the participants to use sticky notes for nodes and draw connection lines between them. By double-clicking on a connection line one can type the predicate on it.

A sample output in terminal based on Miro board items
Output from the script that reads the graph structure from the Miro board

Leveraging Miro
After spending some time on modelling, I used a short piece of JavaScript code to read the graphs from the Miro board and export them as a TGF file (Trivial Graph Format). Originally I wanted to use the Web SDK for this as I’ve used it for another project beforehand and liked how easy it was to just access items via the browser console. However, asking on #web-sdk in the Miro Developer Platform Discord confirmed what I noticed: captions on connectors aren’t currently available via the Web SDK. Therefore I went with the REST API. Shoutout to Discord for the swift and friendly help!

The TGF file I processed via another piece of code I wrote to convert the triples to proper URIs and send them to a graph database. There I was able to query them using SPARQL. The steps from Miro into the graph database took only a few seconds. I was happy when a participant pointed out how cool it is to work in a “programming kind of way” so fast and seamless with something that was just sticky notes on Miro seconds ago. This was the effect I was hoping for.

SPARQL query to rank people with Reactive Spring experience according to whether they also have other matching experiences.

Getting into modelling knowledge graphs and querying them can feel cumbersome and a bit too much for less tech-savvy people. My hope was to make this radically more approachable by starting very casually on Miro, a friendly, colourful and low-barrier environment that everyone knows how to use — and then transition to being able to actively work with this data very fast.

Where could we go next?
If we were to continue with this in a more production-ready kind of way though, I would build a different kind of tooling. It would quickly get very crowded on Miro to fill such graphs in their entirety. But as a prototyping tool to get a shared understanding of this approach and to get a feel of the difference one way of structuring makes over another one, it’s fantastic.

To take this further I was thinking it would be interesting to not even leave Miro for the querying part. After all, a SPARQL query consists of triples too. So these queries could be modelled as a graph in Miro too. Maybe colouring variables in red? This could help lower the entry barrier of SPARQL queries if they are approached in a visual way too. Showing results would then mean highlighting the respective sticky notes and connectors. In this way, one would experience the full loop of how to work with knowledge graphs right within Miro in a very approachable way.

--

--

Benjamin Degenhart
Miro Engineering

Software Developer @DigitalServBund . Into open source/data, ontologies, knowledge graphs, simulations, didactics, sustainability.