Wp-calypso: Image Editor: 'Save' instead of 'Done'?

[roundhill]

Just a thought about the Done button that you click when you have finished editing an image. I wonder if Save might be more appropriate since you are changing/modifying an image?

Referring to the lower-right button here:

[retrofox]

In fact I'd like suggest Create as another option because that's what the user is doing: creating a new image.

cc @adambbecker @folletto

[folletto]

I agree. "Done" is too neutral. Given the fact it's actually creating a new one, a better wording is necessary.

Both Save and Create work, but I'd suggest one that is also an accepted standard, at least on OSX and some cross-platform softwares: Save copy.

[davewhitley]

I think there was a reason for this, but it's been a few months... these suggestion don't work currently, because the user can click Reset (resets changes and doesn't close window). Once the user clicks Reset, "Save" wouldn't make sense because there were no changes. Done is nice because it means both "close without changes" and "save changes".

Options:

• Remove the Cancel button altogether and make the Done button dynamic. If there are no changes, the blue button is "Cancel". If there are changes, then it becomes Save or Save Copy. I don't like this option because "Cancel" makes it seem like there were changes and now you are discarding them.
• Sort of unrelated, but the Cancel button could be removed separate from this issue, since Done does the same thing.

Also, this was design before file management was considered. I hoped that it wouldn't save a copy and it would just be one image like in Google Photos and iOS.

[folletto]

this was design before file management was considered

Yeah, this is understandable. I think a Photos/iOS management style would require (as I think both do) an undo system built-in somewhere: the image is still there, just doesn't show up, and you can "undo" the changes.

Done is nice because it means both "close without changes" and "save changes".

This seems the issue then.

Remove the Cancel button altogether and make the Done button dynamic. If there are no changes, the blue button is "Cancel". If there are changes, then it becomes Save or Save Copy. I don't like this option because "Cancel" makes it seem like there were changes and now you are discarding them.

I'm not sure I understand why. To me it's just a matter of having both "Reset" and "Save copy" to be disabled if there are no changes, while "Cancel" is always active. No?

[davewhitley]

To me it's just a matter of having both "Reset" and "Save copy" to be disabled if there are no changes, while "Cancel" is always active.

That'd work, but I liked having the clear blue primary action there not disabled at all times.

After discussing image versioning (not really possible right now) on Slack, I think this will be fine for now:

• If edits are not present: Cancel Reset(disabled) Save Copy(disabled)
• If edits are present: Cancel Reset Save Copy

Because Cancel is now being moved to the right, i think it will need to become red if changes are made.

To be consistent with the previous window, the Cancel button should probably keep it's black text.

Thanks for the help, @folletto

[gwwar]

@iamtakashi what do you think about this one? Note that we have 3 usages of the image editor so far:

• Cropping images for Site Avatars (creates a new copy if it has changes)
• Cropping images for Gravatar ( not saved to media, but uploaded to gravatar )
• Editing (not copying) images in the media modal

We may want to have a neutral default here with the option of overriding the primary action text.

[davewhitley]

"Done" could be a nice default.

I don't think it's necessary to know that it's saving a new copy if changing the Site Avatar. "Save" might be just fine.

[iamtakashi]

I don't think it's necessary to know that it's saving a new copy if changing the Site Avatar. "Save" might be just fine.

I like "Save" because it's simple, but "Save Copy" is reassuring that the original stays safe in the library after cropping.

[v18]

We may want to have a neutral default here with the option of overriding the primary action text.

FWIW, there is now a way to alter the text as needed for different uses of the ImageEditor component, by using the doneButtonText prop.