Iterations to updates screen

[karmatosed]

Currently the updates screen has a lot of information from various sources and depending on if you are running development versions or a combination of different factors, can get quite intense. (Embeds might not be working so I will also add in order as attachments)

Auto-updates is great, but it exposed the problem with adding more to this section. Whilst, redoing the entire section wasn't something that could be done as part of the immediate work there, that's where this ticket comes in to propose a few first steps on that road.

Props to @joen for helping me work through this work as I began to explore where auto-updates could go in that ticket. It lead me to the an exploration which whilst has a variety of copy situations, shows just a few potential combinations that can happen on this page and what could possibly be done design wise to ease those.

It's worth noting the ideas I am proposing are iterations. I do believe that deeper exploring of updates and the experience is very worthwhile.

What I am suggesting in summary (image included to show the specific changes):

• Change the name to Updates. Settings is a good example of where it's not WordPress Settings, perhaps using that format here works?
• Change the first header to say the version.
• Where we have 2 buttons such as 'update to nightly' and 're-install' consider positioning them beside each other.
• Increase spacing between sections to provide sectioning without borders on the page.

I am aware that in suggesting these things I am likely missing some history and plugin nuance. I probably have also moved something that causes an issue, let's work through what that is and how it can be iterated. This page has a lot going on and I understand everything is there for a reason and intent. I think opening up discussion though around what can be iterated and what needs to be in a particular spot or unchanged, is a great starting point.

I think this could be a minor update, focusing on styling changes perhaps to start and some copy iterations. That said, I am always keen to encourage deeper exploration and thinking if anyone is excited by this and see this as the start of maybe looking more at these increasingly important interfaces that need to scale as we add things like auto-updates.

[karmatosed]

I wanted to loop back to this ticket and note the next step. Along with the recent auto-update changes, some of the iterations here have been added, I am attaching a screenshot to show the current situation for 5.6.

What is needed next, is to screenshot all the variations of this screen. @audrasjb, you had agreed to do that so adding a little reminder here. As there are numerous hidden combinations of this page, it's from there a holistic solution can be worked on for 5.7.

[audrasjb]

I have a few screenshots to share indeed :)

[audrasjb]

Default auto-updates screen for existing install

[audrasjb]

After I manually opted-in for major versions auto-updates

[audrasjb]

Core auto-updates programmatically enabled

[audrasjb]

Core auto-updates programmatically disabled

[sabernhardt]

#52538 was marked as a duplicate.

[karmatosed]

@audrasjb I still think this might be a nice to have, what are your thoughts today?

[audrasjb]

Yes it would definitely be nice to clarify this screen!

We should also take into account the WP Beta Tester adjustments, but I guess that as long as we keep the hooks it uses to modify the screen, everything should be fine.

[johnbillion]

This screen has always felt messy to me, I'd like to see an improvement like this made. I like the narrower layout a lot.

I'm not a designer but this screen would probably also benefit from adding boxes or separators around sections for information separation. Maybe add the W logo in there too. The updates screen in Chromium browsers does this quite well.

[karmatosed]

@johnbillion I am absolutely not against adding some boxes around this. The original design was done to be as close as possible but a refresh, we know a bit more visually now so perhaps that could lead to reimagining. I am cautious to not stray too far from the design language we have. Let me assign it to myself to work on.