WordPress.org

Make WordPress Core

Opened 3 years ago

Closed 3 years ago

Last modified 3 years ago

#42087 closed task (blessed) (fixed)

4.9 About Page

Reported by: melchoyce Owned by: melchoyce
Milestone: 4.9 Priority: normal
Severity: normal Version:
Component: Help/About Keywords: ui-feedback needs-patch
Focuses: Cc:

Description

Currently thinking about the design and copy for this.

Attachments (12)

42087.diff (9.6 KB) - added by melchoyce 3 years ago.
42087.2.diff (9.6 KB) - added by Presskopp 3 years ago.
cut out double spaces, see #42292
42087.3.diff (10.0 KB) - added by Presskopp 3 years ago.
about-page-design.png (1.2 MB) - added by melchoyce 3 years ago.
menu-flow-illustration.png (102.4 KB) - added by melchoyce 3 years ago.
newMenuWorkflow-Illustration-dummy.png (48.0 KB) - added by transl8or 3 years ago.
menu-flow-illustration-2.png (342.7 KB) - added by melchoyce 3 years ago.
about.diff (30.0 KB) - added by melchoyce 3 years ago.
4-9_about_images.zip (458.5 KB) - added by melchoyce 3 years ago.
42087.4.diff (30.3 KB) - added by obenland 3 years ago.
42087.5.diff (30.4 KB) - added by melchoyce 3 years ago.
42087.6.diff (30.3 KB) - added by ryelle 3 years ago.

Change History (63)

#1 @melchoyce
3 years ago

  • Owner set to melchoyce
  • Status changed from new to assigned

#2 @mavisllp
3 years ago

May i know where to find resources?

This ticket was mentioned in Slack in #core by melchoyce. View the logs.


3 years ago

#4 @melchoyce
3 years ago

In 41943:

About Page: Commit initial strings for 4.9.

Props kristastevens, dd32, hlashbrooke.
See #42087.

#5 @melchoyce
3 years ago

Hey @mavisllp! What do you mean by "resources?"

#6 @melchoyce
3 years ago

Have a copy update to tone down the colloquialism coming tomorrow (cc @casiepa). Let's try to keep feedback in this thread.

@melchoyce
3 years ago

#7 @melchoyce
3 years ago

  • Keywords has-patch added

42087.diff introduces some updates, simpler strings. @casiepa can you review?

@Presskopp
3 years ago

cut out double spaces, see #42292

This ticket was mentioned in Slack in #core-i18n by melchoyce. View the logs.


3 years ago

@Presskopp
3 years ago

#10 @afercia
3 years ago

#42292 was marked as a duplicate.

This ticket was mentioned in Slack in #core by jeffpaul. View the logs.


3 years ago

#12 @melchoyce
3 years ago

In 41981:

About Page: Revised strings to be easier to translate.

Props kristastevens, Presskopp, swissspidy.
See #42087.

#13 follow-up: @casiepa
3 years ago

Thx Mel, seems much clearer now. I'm sure it will be clear to all languages now how to move forward with the translation.

#14 in reply to: ↑ 13 @melchoyce
3 years ago

Replying to casiepa:

Thx Mel, seems much clearer now. I'm sure it will be clear to all languages now how to move forward with the translation.

Thanks! In that case, I'll move on to design now.

#15 @melchoyce
3 years ago

  • Keywords needs-design added; has-patch removed

This ticket was mentioned in Slack in #core by melchoyce. View the logs.


3 years ago

This ticket was mentioned in Slack in #core by jeffpaul. View the logs.


3 years ago

#18 follow-up: @transl8or
3 years ago

  • Keywords dev-feedback added; needs-design removed

I think, the string in https://core.trac.wordpress.org/browser/trunk/src/wp-admin/about.php?marks=125#L125 does somehow not express what the actual new feature does.

It says: '... and will recommend that you draft and test changes before update your file.'

Wouldn't it be better to have something like '... and will recommend that you refrain from that and backup your files, before they get overwritten by the next update.'

#19 in reply to: ↑ 18 @melchoyce
3 years ago

Replying to transl8or:

I think, the string in https://core.trac.wordpress.org/browser/trunk/src/wp-admin/about.php?marks=125#L125 does somehow not express what the actual new feature does.

It says: '... and will recommend that you draft and test changes before update your file.'

Wouldn't it be better to have something like '... and will recommend that you refrain from that and backup your files, before they get overwritten by the next update.'

Good catch — we've updated the content of the modal since writing this. I'll update.

This ticket was mentioned in Slack in #core by jeffpaul. View the logs.


3 years ago

#21 @melchoyce
3 years ago

In 42044:

About Page: Update the blurb in "Warning: Potential Danger Ahead!" to be more accurate.

Props transl8or, karmatosed, chanthaboune.
See #42087.

#22 @melchoyce
3 years ago

  • Keywords needs-design added; dev-feedback removed

#23 @melchoyce
3 years ago

Uploaded a mockup of the page design: about-page-design.png

#24 @melchoyce
3 years ago

  • Keywords ui-feedback needs-patch added; needs-design removed

#25 @transl8or
3 years ago

@melchoyce Really nice. I like the choice of colors.
Just one thing (actually the tile I liked the most from the beginning, but...):
I think the flatiron could get lost in translation. (In german for example we have a word for "to iron out" but it's difficult to bring that together in the context of the UX and I don't know the expression in all the other languages.)

A spontanous idea for an alternative image could be something like an abstract flowchart from the left to the right that contains arrows, plus signs and a checked mark. Like they do appear in the process to create a menu. Something like a weird Equation. Also because the equals sign doesnt need translation and is already in the headline. Just an idea. (going to do some real ironing now ;) Happy Halloween, y'all.

#26 @melchoyce
3 years ago

Thanks @transl8or, I agree. I struggled a lot with figuring out what to do with that one and I'm not satisfied with the iron. Your flowchart suggestion makes a lot of sense, I'll give that a try. :)

#27 @melchoyce
3 years ago

Uploaded an updated menu flow illustration.

#28 @Presskopp
3 years ago

'confused by the steps' reminds me of st:

https://upload.wikimedia.org/wikipedia/commons/thumb/3/34/Impossible_staircase.svg/372px-Impossible_staircase.svg.png

#29 @transl8or
3 years ago

I think it's really good @melchoyce. More to the point than the flatiron.
Had something quite similar in mind and wasn't able to visualise it yesterday.
I upload what came out of yours and mine.

If you give it the special Mel 'look and feel' in color, proportions and adjustment to all the other squares, I think it's fine.

#30 @melchoyce
3 years ago

Updated!

This ticket was mentioned in Slack in #core by jeffpaul. View the logs.


3 years ago

This ticket was mentioned in Slack in #core by jeffpaul. View the logs.


3 years ago

@melchoyce
3 years ago

#33 @melchoyce
3 years ago

about.diff applies the design mocked up in about-page-design.png to the page, courtesy of @ryelle. The images are temporarily hosted on her site until we upload them to the CDN and replace the source URLs. I'll attach a zip of the images we'll need to upload.

This ticket was mentioned in Slack in #core-committers by melchoyce. View the logs.


3 years ago

#35 @obenland
3 years ago

Just from looking at the diff, we'll need to debounce the callbacks that are registered to the scroll event. I'll do a complete review soon

/cc @ryelle

Last edited 3 years ago by obenland (previous) (diff)

@obenland
3 years ago

#36 follow-up: @obenland
3 years ago

@melchoyce about.diff looks good! I tweaked the JS part a bit in 42087.4.diff to throttle the scroll callback a little and select elements only once.

Just to double-check, the image in the zip are ready to be uploaded?

#37 in reply to: ↑ 36 @melchoyce
3 years ago

Replying to obenland:

@melchoyce about.diff looks good! I tweaked the JS part a bit in 42087.4.diff to throttle the scroll callback a little and select elements only once.

Thanks!

Just to double-check, the image in the zip are ready to be uploaded?

They are :) They've been optimized already, so they should be good to go.

#38 @jmdarts007
3 years ago

  • Resolution set to invalid
  • Status changed from assigned to closed

good

#39 @obenland
3 years ago

  • Resolution invalid deleted
  • Status changed from closed to reopened

@melchoyce
3 years ago

@ryelle
3 years ago

#40 @melchoyce
3 years ago

In 42121:

About Page: Implement design.

Props ryelle, karmatosed, transl8or, obenland, melchoyce.
See #42087.

#41 @obenland
3 years ago

In 42123:

About: Hardcoded image sources.

We're committed to these images now.

See #42087.

#42 @melchoyce
3 years ago

  • Resolution set to fixed
  • Status changed from reopened to closed

Looks like we're done here. If anyone finds any bugs with the About page, please open a new ticket.

#43 @westonruter
3 years ago

In 42157:

About: Synchronize 4.9 tagline across about pages for credits, freedoms, and privacy.

Props dave.pullig.
Amends [41943].
See #42087.
Fixes #42518 for trunk.

#44 @westonruter
3 years ago

In 42158:

About: Synchronize 4.9 tagline across about pages for credits, freedoms, and privacy.

Props dave.pullig.
Amends [41943].
See #42087.
Fixes #42518 for 4.9.

#45 @westonruter
3 years ago

In 42159:

About: Fix grammar typo with pluralization.

Props metodiew, westonruter.
Amends [42121].
See #42087.
Fixes #42476 for trunk.

#46 @westonruter
3 years ago

In 42160:

About: Fix grammar typo with pluralization.

Props metodiew, westonruter.
Amends [42121].
See #42087.
Fixes #42476 for 4.9.

#47 @westonruter
3 years ago

In 42161:

About: Add vertical alignment for developer happiness sections.

Also run CSS autoprefixer to add -ms- prefixes for CSS grid identifiers for IE11.

Props Presskopp.
Amends [42121].
See #42087.
Fixes #42524 for trunk.

#48 @westonruter
3 years ago

In 42162:

About: Add vertical alignment for developer happiness sections.

Also run CSS autoprefixer to add -ms- prefixes for CSS grid identifiers for IE11.

Props Presskopp.
Amends [42121].
See #42087.
Fixes #42524 for 4.9.

#49 @westonruter
3 years ago

In 42173:

About: Fix jumping behavior for titles and columns when scrolling.

Props ryelle.
See #42087.
Fixes #42514, #42526.

#50 @westonruter
3 years ago

In 42174:

About: Fix jumping behavior for titles and columns when scrolling.

Props ryelle.
See #42087.
Fixes #42514, #42526 for 4.9.

#51 @westonruter
3 years ago

In 42182:

About Page: Fix issue with overlapping images and text on IE11 and Edge 15.

Props Clorith, ryelle, afercia, la-geek, SergeyBiryukov.
See #42087.
Fixes #42545 for 4.9

Note: See TracTickets for help on using tickets.