Make WordPress Core

Opened 11 years ago

Closed 11 years ago

#23899 closed defect (bug) (fixed)

Assorted UI tweaks to revisions screen

Reported by: lessbloat's profile 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 11 years ago.
23899.2.patch (2.3 KB) - added by ocean90 11 years ago.
23899-show-combined-not-split-view.diff (1.9 KB) - added by adamsilverstein 11 years ago.
23899.3.patch (2.3 KB) - added by ocean90 11 years ago.
Refreshed .2
23899.2.diff (1.9 KB) - added by DrewAPicture 11 years ago.
Help tab
23899.3.diff (1.9 KB) - added by siobhan 11 years ago.
amended help text

Download all attachments as: .zip

Change History (26)

#1 @lessbloat
11 years ago

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

@lessbloat
11 years ago

#2 @lessbloat
11 years ago

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

#3 @bpetty
11 years ago

Related: #23935

@ocean90
11 years ago

#4 @ocean90
11 years 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.

#5 @adamsilverstein
11 years 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

#6 @adamsilverstein
11 years ago

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

#7 @adamsilverstein
11 years ago

looks like this:

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

@ocean90
11 years ago

Refreshed .2

#8 @ocean90
11 years 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.

#9 @ethitter
11 years ago

  • Cc erick@… added

#10 @ocean90
11 years 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?

@DrewAPicture
11 years ago

Help tab

#11 @DrewAPicture
11 years ago

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

23899.2.diff adds a help tab, per IRC.

#12 follow-up: @DrewAPicture
11 years 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.

#13 in reply to: ↑ 12 @adamsilverstein
11 years 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!

@siobhan
11 years ago

amended help text

#14 @siobhan
11 years ago

  • Cc siobhan added

#15 @DrewAPicture
11 years 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 11 years ago by DrewAPicture (previous) (diff)

#16 @ocean90
11 years ago

In 24173:

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

#17 @ocean90
11 years ago

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

#18 @JerrySarcastic
11 years ago

  • Cc fittingsites@… added

#19 @ocean90
11 years ago

Starting new tickets.

#20 @ocean90
11 years 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.