I've always found the UX around adding a new config node very frustrating, I regularly see users confused around how to add a new ui-group, etc. within Dashboard 2.0, and it's a similar experience when working with MQTT nodes too.
Current UX
Select the dropdown for the property you want to add a new config node for:
Select the "Add new " option
For what its worth, seems reasonable to me.
This would save one or two clicks but I don't think it makes config setup much less confusing.
Would you remove "Add new ... " from the drop down list?
If there is no config node already, should the pencil button be greyed out? (It's already pretty low key, but I suppose the icon could be greyed out)
What I find confusing about setting up config nodes is when there are two or three levels eg dashboard group, dashboard tab so you have to select add new, then add new again. You have to go via group to get to tab, though tab is the more intuitive concept.
I wonder if both tab and group dropdowns could be shown, with the highest level item first.
Obviously if you changed the Tab selection, Group would have to change to "Unassigned"
Have seen dozens of users get stuck when going to add a config node, whether than be MQTT Broker, Dashboard Gorup or otherwise - it's always a sticking point, and current UX is very unintuitive.
I've never seen someone, using Node-RED for the first time, or at least config nodes for the first time, think that to add a new config node, they need to click the dropdown/select menu, then slick the "Add new" option, and then click edit. A simple "+" button would fix this.
If no config nodes previously defined, yes, I'd remove that entirely.
On first-load, when none have been defined, The dropdown as it is now, with a "+" instead of a pencil icon would be my approach.
Other improvements are being made to Dashboard 2.0 specifically, but I'm trying to constrain this to the general UX of Node-RED Config Nodes, rather than specific Dashboard use case.
Would it be more user friendly to have a plus button in the config sidebar, or in dashboard 2 case in the dashboard 2 sidebar.
Being pedantic, the first time a user has to create a config node "Add new ..." is the only option, so no need to click the dropdown button.
Edit - Hmm maybe I'm thinking too much about an individual home user rather than someone maintaining a corporate system.
For that user, offering both + and pencil buttons would make the confusion worse, so yes you would have to remove the pencil.
Or, in other words, change the button icon the first time.
I don't see it as a significant improvement, sorry.
Definitely more apparent here when the user didn't do the initial setup, but even in cases where they did - I get a handful of questions/issues per week saying how unclear it is to create a new config node. From my time at IBM too, that was a regular complaint for MQTT broker configs, etc. within the team.
doesn't have to be a significant improvement though? Just an improvement, which it would be.
For Dashboard 2.0 - that's exactly what I've done. For core Node-RED though, having the option to add in the sidebar could work, but you're also taking for granted that you know the config nodes have a sidebar, which a lot of Node-RED users do not.
The point at which a user often realises they need to add a configuration is once they've dropped on a node requiring it, e.g. mqtt, ui-group, or our function-gpt node. When editing that node, the user has the tray open, so why not present the option there, rather than expect the user to know about the underlying concept of Config Nodes, and know that there is a "config" side menu where they can be listed?
Ah, yes, a seemingly minor issue that had me confused the first handful of times I had to add a config in any such nodes. Then it became just an 
but I totally agree that it is an unforced error, a quirk, that is better remedied and this seems a substantial improvement to me.
Just my $0.02
The simplest thing I see is to dynamically change the icon: when the "add" option is selected it's the "+" icon otherwise it's the 
icon. 
Yep, thats definitelt an alternative here that would be an improvement, still three clicks though: "open dropdown" > "add new config" > click "+"
And still includes the fairly unintuitive step to select the dropdown and choose the "Add new" option.
Adding a plus button to currently un-used screen real estate makes the action (a) more intuitive and (b) far quicker to perform
I promise, my last comment on this suggestion...
Your image, annotated:
Now the designers have given me another button. It has a + on it.
Suddenly everything becomes clear!
Button 1 had me flummoxed but now I can choose between button 1 or button 2, all is well.
Don't you think this epiphany is slightly improbable?
I notice that unlike the "Show help" button, there is no tooltip on mouse-over of the Edit button. It could say "Edit config or create a new one"
No, the "+" button the row with "Page" would be quite clearly a button to add a new page.
I have seen at least 2 x dozen people hit exactly the list you've put forward in live screenshare sessions, and many more in issues/async sessions.
Most people in this situation do click the "pencil" icon, then change the settings in accordance of the new page/config they want, then send me messages (in the async use cases) complaining that it overrode there old page/config node
@joepavitt I can try to implement it (your idea of the two buttons) - I think there is some benefit
Copyright OpenJS Foundation and Node-RED contributors. All rights reserved. The OpenJS Foundation has registered trademarks and uses trademarks. For a list of trademarks of the OpenJS Foundation, please see our Trademark Policy and Trademark List. Trademarks and logos not indicated on the list of OpenJS Foundation trademarks are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them.
The OpenJS Foundation | Terms of Use | Privacy Policy | OpenJS Foundation Bylaws | Trademark Policy | Trademark List | Cookie Policy
