silverstripe / silverstripe-cms

Silverstripe CMS - this is a module for Silverstripe Framework rather than a standalone app. Use https://github.com/silverstripe/silverstripe-installer/ to set this up.
http://silverstripe.org/
BSD 3-Clause "New" or "Revised" License
515 stars 333 forks source link

'Save and Add New' button in CMS (4.0) #2047

Closed IsaacInsoll closed 6 years ago

IsaacInsoll commented 6 years ago

Overview

Every single client I've ever had has loved this button in Silverstripe 3.x with BetterButtons. BetterButtons is not currently working for silverstripe 4 and it seems excessive to add a whole module to get this one button.

I think better buttons is great and has so many other great features but just adding 'Save and add new' to the core CMS would make a lot of people happy.

Acceptance Criteria

Designs can be found in our Styleguide.

Notes

chillu commented 6 years ago

Yeah, I can see how batch addition could benefit from this. It's more mental overhead and visual clutter though. Eventually this should be less impactful by preloading the "add new" forms, and switching between the "list" and "add" modes more or less instantaneously, but that shiny new React+GraphQL world is still a fair bit off unfortunately.

@clarkepaul @newleeland what do you think?

tractorcow commented 6 years ago

I wouldn't mind adding it to the gridfielddetailform actions by default.

clarkepaul commented 6 years ago

I thought that Better Buttons had one or two actions which seemed like they should be in core. Its been a while since I've used it so how about we do a mini review to see in which contexts it makes sense the most.

mr-macedawg commented 6 years ago

I’d love to see a “Save and add” button. It’d make data entry significantly quicker.

chillu commented 6 years ago

@clarkepaul @newleeland any more thoughts on this? ("mini review")

clarkepaul commented 6 years ago

I've reserved some time next week to take a look at the module. At the moment I'm feeling pretty confident about its practicality and usefulness.

sachajudd commented 6 years ago

After reviewing the better buttons module we have come up with a few concepts.

"Next & Previous" and "New Record or Add" buttons. These would be placed on the right in the south toolbar: north and south placement

Configurable "BetterButtonsGroups" (Customising the button collections) Using Bootstrap dropdown-toggle-split image

For this change, the core "Save & Publish" buttons would need to be separated rather than be in a btn-group. image

"Draft and Publish" frontend links: Using Bootstrap single dropdown-toggle image

Complete south toolbar: image

cc @unclecheese @clarkepaul @chillu

IsaacInsoll commented 6 years ago

This looks great and adds a level of efficiency and convenience I think all CMS users will love.

chillu commented 6 years ago

This looks awesome @sachajudd ⭐️

sachajudd commented 6 years ago

Cheers @chillu 🙂

In this concept, the "Add" green plus icon does not have the ability to "Save" as well. Before: image

After: image

We should have a warning indicating to the user that they have unsaved changes before they navigate away. We thought the "save/publish and create new" action was better suited in the drop-down area.

The preview frontend links are a feature from Betterbuttons, from my understanding they can be configured to work with some GridField items. image We thought these designs would be useful for showing how these actions could be integrated into the CMS in a nicer way.

On mobile, we could keep Betterbuttongroups if configured and at a certain size not display Previous, Next or Add.

We did consider keeping the "Save" and "Publish" buttons together and having a dropdown on the right for both save and publish additional actions but we weren't convinced it made as much sense based on some feedback we recieved (open to your thoughts on this).

pasted_image_14_02_18__4_03_pm
chillu commented 6 years ago

We did consider keeping the "Save" and "Publish" buttons together and having a dropdown on the right for both save and publish additional actions but we weren't convinced it made as much sense based on some feedback we recieved (open to your thoughts on this).

It minimises space use, which will be particularly important on mobile. Keep in mind that we've designed other things to show in the south toolbar, for example "this will publish other records" warnings (ask Jared for details). So spacings and multiple dropdown triggers need to be well considered. Also don't assume every language will have button labels that short, in German and French they tend to be a third longer.

So in your previous design, you've only got the dropdown trigger on the "save" button, but not the "publish" button - does that mean you decided not to allow "publish and close"?

clarkepaul commented 6 years ago

We took a broader look at the design, rather than just focusing on adding the "Save and add new" action as the issue is titled. We hope to find a way to provide flexibility for the UI to be able to handle additional actions what ever they may be.

We don't intend all of these actions to be turned on by default. If a developer wanted to turn on actions associated to the "save" or "publish" action we initially thought they could be in a dropdown off that button respectively. As a space saver of course we could combine all those additional variations of "save/publish" into a single dropdown if they exist.

We now have more complexity and options with the introduction of a publish action (we don't have any stats on which action(s) would be most useful):

We had initial feedback the dropdown on the combined actions looks like it is only associated to the publish action with that last design, although combining would minimise the impact on the UI.

I did have the feeling that "save and close" and "save and add new" might be more useful during the creation process where as publish needs a bit more care to ensure you have published the right information.

Also its worth noting that we haven't really saved on clicks by moving these action to the dropdown, it would be two clicks either way.

  1. Click save/publish and then the back or add action
  2. Click more options dropdown then an action within The perceived speed might seem faster with opt 2 as you don't need to wait for the saving of the record before triggering the next action.

With mobile we can also remove icons to increase space or put the save action into the dropdown along with the other save type actions (just a thought).

clarkepaul commented 6 years ago

Hopefully if these designs don't make their way to core then they might inspire the better buttons module to some alternative layout options eh @unclecheese :).

In BetterButtons the top right tabs get moved down in preference of the "next/prev/add" actions, we thought it was best to not get into that territory with this issue.

chillu commented 6 years ago

Thanks for looking at the bigger picture! Let's keep this card focused on the "save and add new" feature. I've separated out the prev/next/create button work: https://github.com/silverstripe/silverstripe-admin/issues/436.

I agree that "publish and create new" would require a lot of confidence by the author in the effects of what they're doing. Which means a preview panel that we don't have at the moment for those GridField based views. In general, we should nudge devs to set up their model editing with "save" only functionality, and stick to a cascading publish from the owner record (e.g. save a block draft, then publish the entire page). That's a simpler model for authors, and reduces mental overhead to a certain extent on views like record editing (less action choices).

chillu commented 6 years ago

I've written some ACs for this in the issue description, and suggested excluding "save and close" for now, since the use case for that is a bit weaker than for "save and add new". Happy to hear more user research feedback on this!

Rhym commented 6 years ago

Dope

Is very nice I like it a lot.

Rhym commented 6 years ago

Any update on this, team?

chillu commented 6 years ago

Closing this as a duplicate of https://github.com/silverstripe/silverstripe-admin/issues/436