Interactive visual documentation explorer for InvenTree concept

[65degrees]

Hi, I'm an instructional designer and I've been looking into ways to make software documentation more visual (I personally struggle with long, text-heavy explanations). So for fun, I built a small proof of concept to visualize relationships between Parts, Bills of Materials, Stock, Build Orders, and Allocations. Users can explore the connections, see how workflows fit together, and also access the corresponding official documentation via links.

Here's the prototype

I'm curious whether an interactive visual layer could complement the documentation and make it easier to understand the processes and dependencies.

It's still an early, independent concept, and I'd be interested in getting your perspective:

• Do you think something like this could be useful to InvenTree users?
• Are there particular workflows or processes where you think this approach would be more valuable?
• Can you see something like this fitting into the documentation system?

I'd appreciate any feedback! Thanks!

[matmair]

Intresting approach in general; in this specific example I am not sure it actually improves understanding as it is hard to assess where one would start.
Having the workflow component that is in the details somewhere more prominent and clickable might held. That would communicate the temporal component better, in the detail pane it already helps.

Cool concept overall. We surely would be intrested in reviewing how such a thing could be supported/included in the official docs. Maybe even working of an automatically extracted state graph (we can do this for some of the objects as we use a finite state machine=

[matmair]

@SchrodingersGat this might intrest you

[65degrees]

Thanks for taking a look and your feedback! I see what you mean about not having an obvious starting point. I'll play around with making the workflow more prominent and clickable, so it's easier to follow while still being able to explore the relationships.
The automatically generated state graph idea is interesting! I hadn't considered pulling that information directly from the software. Are there specific objects you think would be good to test that first?

[matmair]

I will check if we can provide a json somewhat easily so you have something to work from

[65degrees]

Sounds great, thanks!

[matmair]

here is a sample file:
inventree_fsm.json
; generated with #13136

[65degrees]

A little update! I've incorporated the JSON you shared to visualize the state transitions for the different order types. I also made some changes based on your feedback about the missing starting point, including a short instruction pop-up and some navigation guidance.

Here's the updated version

If you get a chance to take another look, let me know what you think, especially if the current visualizations make sense from your perspective.

[matmair]

vrey intresting; not sure how we would include this in the docs but interesting approach

[65degrees]

Re your comment about how this could fit into the documentation. How about simply adding a "View visually" link or something like it to relevant documentation pages? The Explorer could support direct links to specific concepts or workflows, so users wouldn't have to navigate through the whole thing to find what they're looking for.

It already links back to the official docs, so that would make the connection work both ways without having to change the existing doc structure.

Thoughts on that?

[matmair]

not a fan of linking to externally controlled sites from the docs; from experience they go out-of-date or break at some point and it is hard for us to remedy / check regularly

[65degrees]

Makes sense. I wasn't necessarily thinking of linking to something externally hosted, though. More like having the Explorer as part of InvenTree's own documentation