I recently migrated all of my automations from node red to Home assistant. I’m quite happy with authoring automations (especially with GPT-4’s assistance) but debugging the could be better.
I like the idea of the debugging trace tool, I actually work on a very similar tool in my day job which this inspired. However I think the UX could be improved. Im not a UX designer but have a bit of a background in that space. Here is some feedback
Tab inconsistency
We have 4 tabs at the top. The first one Step details content is contextual to what step you select in the Execution graph.
The other 3 Automation config, trace timeline and related log book entries are static for the whole trace.
This is quite confusing as it keeps breaking my expectations. E.g I select a different step in the execution and Im wondering if trace timeline should change or not?
A good start would be to split step details from the other 3 visually.
Step details
This is probably the most important content so it makes sense to the the first tab.
- Why is the result: true duplicated across these 2 sections, Also what do these sections mean, its not clear
- The selected state of the current node in the graph is not clear enough imo, its easy to lose where you are in the script graph
- A lot of nodes in the graph are not selectable, e.g the choose node. This is very confusing because it still has a hover state implying its intractable
- There Is no way to know if there is any content to check in the bottom tabs (Changed variables & logbook entries) you are always paging through. It would be great if this content was always visible or if there was some kind of badge indicator on these tabs telling me there is content here
- Tooltips on hover on the script execution nodes would help orientate myself
Trace timeline
I don’t really get what this is and how it’s different from the graph and step details. I don’t understand what causes an entry here
It looks like a high level summary / overview so maybe this would be a good first tab. It seems like some of them are able to select the node they came from in the execution graph which is cool but it doesn’t work for all, again a bit inconsistent
Related log book entries
This is useful and a global version of what is in step details. That said it doesn’t link to the execution step it came from so it’s kind of overlapping with trace time line. plus we already show this in the step details
Summary
Overall the themes of the issues are:
- Inconsistent UX on various features, e.g everything should be clickable and go somewhere
- Too many tabs / panels to dive through
- We show a lot of the same info multiple times in slight different ways, adds to confusion. An interesting idea for your designed would be to try to merge trace timeline, logbook entries and step details into one single script execution tab. And then the other tab is just the full static yaml of what ran.
- Inconsistent information hierarchy between execution graph view and tabs, sometimes they are linked, sometimes not
…