WordPress / wp-autoupdates

Feature plugin building a UI for opting-in to plugin, theme, and core auto-updates.
https://wordpress.org/plugins/wp-autoupdates/
GNU General Public License v2.0
56 stars 18 forks source link

Make it visually clearer which plugin/theme rows have auto-updates enabled #93

Open pbiron opened 4 years ago

pbiron commented 4 years ago

The plugin/theme list tables make it really easy to tell which rows are for active plugins/themes, but making the background-color a light blue and a 4px dark blue left border:

current

I'm wondering if there is anything similar we can do to make it easier to which which have auto-updates enabled.

I'm certainly not a designer and am not really thrilled with any of the following, but I'm gonna throw them out just to get the discussion going:

proposed

alt-proposed

alt2-proposed

pbiron commented 4 years ago

and "It's fine just the way it is, we don't need to change it" is a perfectly reasonable response :-)

abuyoyo commented 4 years ago

I actually am a designer :)

IMO, having a separate column for the auto-updates might have been a good idea when initially working on this feature, But the Enable/Disable action really needs to find its way organically next to the other "Bulk-able" actions. Next to Activate/Deactivate/Delete etc. Perhaps with Auto-Updates Enabled text being bold. While Disabled being normal.

Another option would be to have a notice (green-left-bordered) inside the plugin row. Something that plays nice/alludes to the "Update Available" notice that we're already accustomed to.

kebbet commented 4 years ago

To me it would be nice to group all activation/inactivation actions to the same area. And in some way visually distinguish active auto-update from inactive. Personally I'm a fan of coloring backgrounds, but maybe thats not an option for accessibility?

In hindsight, adding color like the screenshot below is not clear enough. :) What does the green mean?

image

kebbet commented 4 years ago

Or change the layout by moving actions to a center column?

image

pbiron commented 4 years ago

I actually am a designer :)

Thanx for the feedback

  • img 1: The alternating green/blue borders just add noise/clutter. They don't make it clear what means what.
  • img 2: Having borders on the "outside" breaks the design-language overall. I don't see it passing.

The green right border is "inside", just the blue left border that core already adds for active plugins is "inside".

The suggestion there is motivated by the following:

Not great motivation, I know, but that was my thinking.

  • img 3: Is the clearest of the lot. But not really a design.

It's not really clear from that screenshot, but this one changes the background color (of just that one column, so that the blue background for active plugins isn't obscured) to green with roughly the same "opacity" as the blue background for active plugins (i.e., roughly the same modification of the color between the blue left border and the blue background).

IMO, having a separate column for the auto-updates might have been a good idea when initially working on this feature, But the Enable/Disable action really needs to find its way organically next to the other "Bulk-able" actions. Next to Activate/Deactivate/Delete etc.

I've said this before, but personally, I would prefer the Enable/Disable links to be row actions as well. But as pointed out in [https://core.trac.wordpress.org/ticket/48850#comment:36 this comment on the trac ticket], where you can also see many of the other designs that were tried before this feature plugin even got started.

wittwitsan commented 4 years ago

This is a solution that I'm thinking of for the auto-update status indicators.

auto-update-indicator

There is a design exploration in Gutenberg for using the blue dot as an indicator. (https://github.com/WordPress/gutenberg/issues/19909)

I think this can be explored in the future after merging into Core.

pbiron commented 4 years ago

I like that, it's subtle but not too subtle.

If/when that gets accepted for Gutenberg it is definitely worth considering for this.

audrasjb commented 4 years ago

Yeah, I also love that design proposal 👍