WordPress.org

Make WordPress Core

#23899 closed defect (bug) (fixed)

Assorted UI tweaks to revisions screen

Reported by: lessbloat Owned by:
Milestone: 3.6 Priority: normal
Severity: normal Version: 3.6
Component: Revisions Keywords:
Focuses: Cc:

Description (last modified by ocean90)

I've noticed a couple of small things we can do to improve the UI/UX of the new revisions screen:

A couple things to consider:

  • Add a short description (intro sentence) explaining what to do once you land on the page.[24173]
  • Disable previous and next buttons when you're on the first, and last node. [24020]
  • Fix some padding/margin inconsistencies (i.e. unnecessarily large padding on right side of screen)
  • Slider handle (blue down arrow) icon looks a tad rasterized (especially on retina device)
  • Seems like the "Restore this revision" button should be in the proximity of the right side instead of in the middle (as the right side is the visual representation of what will actually be restored).
  • When in "Compare two revisions" mode, the blue highlighted section within the slider, covers all of the revision nodes. We might look at decreasing the height of that blue highlighted area. [24020]

Attachments (6)

23899.diff (2.5 KB) - added by lessbloat 13 months ago.
23899.2.patch (2.3 KB) - added by ocean90 12 months ago.
23899-show-combined-not-split-view.diff (1.9 KB) - added by adamsilverstein 12 months ago.
23899.3.patch (2.3 KB) - added by ocean90 12 months ago.
Refreshed .2
23899.2.diff (1.9 KB) - added by DrewAPicture 12 months ago.
Help tab
23899.3.diff (1.9 KB) - added by siobhan 12 months ago.
amended help text

Download all attachments as: .zip

Change History (26)

comment:1 lessbloat13 months ago

  • Component changed from General to Revisions
  • Keywords needs-patch added
  • Milestone changed from Awaiting Review to 3.6

lessbloat13 months ago

comment:2 lessbloat13 months ago

23899.diff tries to be smart about disabling the next and previous buttons based on where you're at on the slider.

comment:3 bpetty12 months ago

Related: #23935

ocean9012 months ago

comment:4 ocean9012 months ago

  • Description modified (diff)

23899.2.patch refreshes lessbloat's patch and changes the z-index of the slider range to let the revision nodes visible.

comment:5 adamsilverstein12 months ago

  • Cc adamsilverstein@… added

i wanted to point out that i believe you are making a common mistake here:

the right hand column represents what was added in the revision, the left hand column represents what was removed. the restore revision button is near the To: revision because thats whats always restored when you click the button.

its an easy confusion to make and i had proposed a single column mode that was long ago disabled, maybe we can reconsider?

here is an old screenshot:
http://f.cl.ly/items/0b240F0K1a1J3l000o1R/revisions2.png

comment:6 adamsilverstein12 months ago

23899-show-combined-not-split-view.diff: set combined view as default; consider as a screen option - posted for testing

comment:7 adamsilverstein12 months ago

looks like this:

http://f.cl.ly/items/0Q2y3Z153t0z400S2511/Screen%20Shot%202013-04-17%20at%201.36.32%20PM.jpg

ocean9012 months ago

Refreshed .2

comment:8 ocean9012 months ago

In 24020:

Revisions UI: Disable previous and next buttons when you're on the first, and last node. Put revision ticks above the slider range. props lessbloat for initial patch. see #23899.

comment:9 ethitter12 months ago

  • Cc erick@… added

comment:10 ocean9012 months ago

  • Description modified (diff)

Add a short description (intro sentence) explaining what to do once you land on the page.

Should we add a help tab?

DrewAPicture12 months ago

Help tab

comment:11 DrewAPicture12 months ago

  • Cc xoodrew@… added
  • Keywords has-patch added; needs-patch removed

23899.2.diff adds a help tab, per IRC.

comment:12 follow-up: DrewAPicture12 months ago

I linked the Revision Management codex article in the help tab sidebar, which is on the docs team's priority list for the 3.6 Codex Sprint.

comment:13 in reply to: ↑ 12 adamsilverstein12 months ago

Replying to DrewAPicture:

I linked the Revision Management codex article in the help tab sidebar, which is on the docs team's priority list for the 3.6 Codex Sprint.

very nice, thanks!

siobhan12 months ago

amended help text

comment:14 siobhan12 months ago

  • Cc siobhan added

comment:15 DrewAPicture12 months ago

Help tab following changes in 23899.3.diff:

Tab: Overview:

This screen is used for managing your content revisions.

Revisions are saved copies of your post or page, which are periodically created as you update your content. The red text on the left shows the content that was removed. The green text on the right shows the content that was added.

From this screen you can review, compare, and restore revisions:

  • To navigate between revisions, drag the slider arrow left or right or use the Previous or Next buttons.
  • To compare two revisions select the 'Compare two revisions' box.
  • To restore a revision, click Restore This Revision.

Tab Sidebar:

For more information:

Revisions Management
Support Forums

Last edited 12 months ago by DrewAPicture (previous) (diff)

comment:16 ocean9012 months ago

In 24173:

Revisions UI: Add a help tab. props siobhan, DrewAPicture. see #23899.

comment:17 ocean9012 months ago

  • Description modified (diff)
  • Keywords needs-patch added; has-patch removed

comment:18 JerrySarcastic12 months ago

  • Cc fittingsites@… added

comment:19 ocean9011 months ago

Starting new tickets.

comment:20 ocean9011 months ago

  • Keywords needs-patch removed
  • Resolution set to fixed
  • Status changed from new to closed
  • Version set to trunk
Note: See TracTickets for help on using tickets.