WordPress.org

Making WordPress.org

Opened 3 years ago

Closed 3 months ago

Last modified 3 months ago

#1763 closed enhancement (fixed)

Create front-end design for "adopt-me"

Reported by: samuelsidler Owned by: SergeyBiryukov
Milestone: Priority: low
Component: Plugin Directory Keywords: ui-feedback has-screenshots good-first-bug has-patch
Cc:

Description

Once a plugin has been marked as "adopt-me" (see ticket #1762), we need to show something on the front-end so visitors know the plugin is looking for a new owner.

I suggest a banner similar to the green localization banner (but probably another color) with text similar to:

The plugin developer has indicated that they are no longer developing this plugin. If you're interested in adopting this plugin, please email plugins@….

@ipstenu: Does that sound good?

Attachments (10)

#1.png (184.1 KB) - added by Travel_girl 5 months ago.
Option: #1
#2.png (245.8 KB) - added by Travel_girl 5 months ago.
Option: #2
#3.png (270.9 KB) - added by Travel_girl 5 months ago.
Option: #3
purple_box.png (500.5 KB) - added by Travel_girl 4 months ago.
Purple box
yellow_box.png (339.2 KB) - added by Travel_girl 4 months ago.
Yellow Box
purple_button.png (378.9 KB) - added by Travel_girl 4 months ago.
Purple button
blue_box.jpg (241.7 KB) - added by melchoyce 4 months ago.
#1763-screenshot.png (308.3 KB) - added by ck3lee 3 months ago.
#1763.patch (5.7 KB) - added by ck3lee 3 months ago.
1763.2.patch (4.4 KB) - added by ck3lee 3 months ago.
v2

Change History (53)

#1 @Ipstenu
3 years ago

Purple. I say purple.

Blue - waiting approval
green - approved and needs updated
red - you been bad
purple - Love me!

@mordauk do you have any thoughts? You did this more recently that I did (adoption).

#2 @mordauk
3 years ago

Purple has my vote too!

#3 @melchoyce
2 years ago

  • Keywords ui-feedback added

#4 @tellyworth
21 months ago

  • Keywords 2nd-opinion added

This ticket was mentioned in Slack in #design by karmatosed. View the logs.


12 months ago

#6 @joyously
12 months ago

Is there a way to search for plugins with the Adopt-me tag? It would be great for developers, but also to find one to test this with. (When I did a search on the directory, the ones shown didn't have the tag.)
Would it make sense to indicate the Adopt-me status in the summary card, or just on the plugin's page?

#7 @obenland
12 months ago

Let's not add more information to plugin cards. Plugins tagged with Adopt Me can be found at https://wordpress.org/plugins/tags/adopt-me/

Adding links to taxonomy pages is currently not very scalable though, so that is probably the biggest hurdle I see

#8 follow-up: @joyously
12 months ago

Tags in general should be more exposed on the Plugin Directory! I didn't know how to get there...
Clicking on a plugin with that tag, I see no indication yet of the Adopt Me status. I agree that it could be a banner similar to the translation banner, but I think it should be prominent on the Development portion of the plugin page. The tag itself could be colored for more attention, also.
It could be a ribbon diagonally across the upper corner of the plugin portion of the page, or just something on the Development tab link.

#9 in reply to: ↑ 8 @marybaum
12 months ago

Replying to joyously:

Looks like the adopt-me plugins all say that on their front page, in the first sentence of the description copy.

Agree that it should also occur on the dev page, possibly with more specific discussion of what maintaining that plugin might entail.

Some plugins are mostly just style changes; a competent front-ender could probably take them on. Others need full REST API and/or other advanced dev support for cron jobs, JSON, you name it - things that are just words to me but daily life to full-stack folks.

And definitely needs some sort of meaningful imagery that shows up in several places ... will Slack some thumbs.

Tags in general should be more exposed on the Plugin Directory! I didn't know how to get there...
Clicking on a plugin with that tag, I see no indication yet of the Adopt Me status. I agree that it could be a banner similar to the translation banner, but I think it should be prominent on the Development portion of the plugin page. The tag itself could be colored for more attention, also.
It could be a ribbon diagonally across the upper corner of the plugin portion of the page, or just something on the Development tab link.

This ticket was mentioned in Slack in #design by marybaum. View the logs.


11 months ago

This ticket was mentioned in Slack in #design by marybaum. View the logs.


10 months ago

@Travel_girl
5 months ago

Option: #1

@Travel_girl
5 months ago

Option: #2

@Travel_girl
5 months ago

Option: #3

#12 @Travel_girl
5 months ago

  • Keywords has-screenshots added

I thought about different variations to display "Adopt this plugin".

Option 1:
A Notification under the "Translate Me" Message. I think it is a good spot to display it under, so the call to action for contribution is together. The translation call to action would probably effect more people, so it should be displayed first.
This is my favourite.

Option 2: A Message under the Warning. Would be also a good spot, but not sure if this could worried other people to use it, as the style looks more like a warning.

Option 3: The Message could be displayed in the Sidebar. Is a bit less prominent and it would not be purple, to make the Design more consistent.

An other (or additional) option would be, to display the message in the tab "Contribution" on the top. I think it would be a good spot to show it also there. But I think it would not ne visible enough, if this is the only place to see it.

The tag "adopt-me" on the side is really easy to miss. So I vote for an extra message, beside that.

As @obenland mentioned it is hard to include links, I was not sore, what would be possible to include as a button or link. But it would be nice to link to a handbook-page that explains maybe, how the process is to take over a plugin.

#13 @Travel_girl
5 months ago

Backround color for notifications: D5CAF2
Border-Color: 826EB4 (https://make.wordpress.org/design/handbook/design-guide/foundations/colors/)

Both passes AAA standards with font-color 32373c

#14 @joyously
5 months ago

I vote for combining 1 and 3, so that there is an action that the user can take. The screenshot shows a purple message, but nothing actionable (well, it says to email plugins, but I think a link to the page explaining it would be much better).

I also see nothing wrong with having a purple box in the sidebar, if the banner is not at the top.

#15 @Ipstenu
5 months ago

Instead of saying "Email Plugins..." we should link to https://developer.wordpress.org/plugins/wordpress-org/take-over-an-existing-plugin/

That will walk them through the process without having to micromanage everyone :D

I like option 2 the best. It's up at the top and highly visible. With a good link, we won't need the button.

#16 @SergeyBiryukov
4 months ago

  • Keywords good-first-bug added

#17 @Travel_girl
4 months ago

I was discussing the design with Tammie @karmatosed, Sergey @sergeybiryukov and Dominik @ocean90:

Tammies meant, that the notification on top (#1 and #2) would be too noisy, of we have multiple notifications (like 2 years not updated and translating note). So she voted for solution in the Sidebar.
But she was concerned about the color und was not sure if purple is the right color to go.

Because the widget could easily be missed on the bottom of the sidebar, we think, that it would be better to place it on top of the sidebar. I think below the Plugin Details would be a good spot, cause the plugin details are really relevant for users and should be stick on top.

To make the note a but more obviouse I have added color to the box. My favorite would be the yellow one, cause thats a notification color, that we already use.

I have also tried out a purple button, but I have not liked it at all, cause the other buttons are grey and it would not be consistent.

See Mockups below:

Last edited 4 months ago by SergeyBiryukov (previous) (diff)

@Travel_girl
4 months ago

Purple box

@Travel_girl
4 months ago

Yellow Box

@Travel_girl
4 months ago

Purple button

This ticket was mentioned in Slack in #meta by travelgirl. View the logs.


4 months ago

#19 @SergeyBiryukov
4 months ago

  • Keywords needs-patch added; 2nd-opinion removed

yellow_box.png looks great to me. Anyone willing to work on a patch?

#20 @karmatosed
4 months ago

This is awesome work thanks. My feelings on this are the yellow option but without a border.

#21 @Ipstenu
4 months ago

Can we put the yellow box on the TOP of the sidebar? First thing?

I know 'above the fold' is not a real thing anymore, but it's still more visible there :)

Also is it going to confuse users that the 'adopt' button is a link to a directions page and not a form? (And no, I don't want it to be a form!)

#22 @joyously
4 months ago

I prefer the purple, so that it is different and stands out as much as possible. I'm all for making it as noisy as possible so that it can attract the eye of a developer to adopt it.
A lot of plugin banners are very colorful, even the generated ones, so it needs to be able to compete with that, and look different from the other standard messages so that it is not lost to "banner blindness".

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


4 months ago

@melchoyce
4 months ago

#24 @melchoyce
4 months ago

Riffing on @Travel_girl's concepts in blue_box.jpg. Tried out blue since we generally use it for "hey, this is information!" while yellow usually means a warning. Also moved it to the top, per @Ipstenu's suggestion.

I think we should update the copy to say what adopting a plugin means, since we never actually say it.

#25 follow-up: @Ipstenu
4 months ago

"This plugin is seeking new, active, developers. Are you interested in assuming that responsibility?"

And the button would be "Read More" or something to that effect?

#26 in reply to: ↑ 25 @Travel_girl
4 months ago

Replying to Ipstenu:

And the button would be "Read More" or something to that effect?

"Read more" would not be accessible for screen reader users, unless we add that information vie Aria Labels.
But in Terms of a better UX for everyone, I would suggest

  • Adopting Process
  • Adopt Plugin
  • Details for Adopt Plugin

or something similar.

@ck3lee
3 months ago

#27 @ck3lee
3 months ago

  • Keywords has-patch added; needs-patch removed

Sample screenshot for #1763.patch

"Read more" would not be accessible for screen reader users, unless we add that information vie Aria Labels.

@Travel_girl, I took your consideration too. The current "Read more" button is actually an anchor tag styled as a button. So, I think it would work nicely for screenreader to direct the users to another page if they want to read more about the process. Your thoughts?

Last edited 3 months ago by ck3lee (previous) (diff)

#28 @SergeyBiryukov
3 months ago

  • Owner set to SergeyBiryukov
  • Status changed from new to reviewing

#29 @tellyworth
3 months ago

In 8641:

Plugin Dir: add a new Adopt Me widget.

Props ck3lee.
See #1763

#30 @tellyworth
3 months ago

In 8642:

Plugin dir: register the Adopt Me widget.

See #1763

#31 @tellyworth
3 months ago

In 8643:

Plugin dir theme: styles for Adopt Me widget

See #1763

#32 @tellyworth
3 months ago

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

In 8644:

Plugin dir theme: load the Adopt Me widget

Also bumps the CSS cache.
Props ck3lee
Fixes #1763

#33 @Otto42
3 months ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

The adopt me widget is now showing up for plugins that don't have the adopt-me tag. Example: https://wordpress.org/plugins/strong-testimonials/

#34 @Otto42
3 months ago

In 8648:

Plugin dir theme: Turn off the adopt me widget. Partially revert [8644] temporarily. See #1763

#35 follow-up: @Otto42
3 months ago

Seems like this relies on the taxonomy being updated, which, it isn't, perfectly. Maybe relying on the actual tags from the readme makes more sense, or fixing the taxonomy updating. Either way.

#36 in reply to: ↑ 35 @dd32
3 months ago

Replying to Otto42:

Seems like this relies on the taxonomy being updated, which, it isn't, perfectly. Maybe relying on the actual tags from the readme makes more sense, or fixing the taxonomy updating. Either way.

It seems that plugins go into the section once they set the tag, but never leave the category once they've had the tag removed..

oops :) [3357]

I guess we'll have to clear their plugin_section tax in an else-branch there and manually re-assign the others

@ck3lee
3 months ago

v2

#37 @ck3lee
3 months ago

Attached v2 patch here.

  • Fixed the importer to remove the category if adopt-me tag is not set.
  • Re-enabled Adopt Me panel.
  • Added url rewrite for plugins/browse/adopt-me/ to list all "Adopt Me" plugins

Please review, @dd32 @Otto42. Let me know if there is anything else needs to be fix. I'd be happy to help.

This doesn't clean the existing "bad data" though. Suggest to do that manually before/after commit.

#38 @dd32
3 months ago

This doesn't clean the existing "bad data" though. Suggest to do that manually before/after commit.

I've sync'd the category to the tag (manually), all plugins in the adopt-me section now have the tag.

#39 @dd32
3 months ago

In 8654:

Plugin Directory: Import: Clear the plugin from the Adopt Me section once the adopt-me tag is removed.

Props ck3lee.
See #1763.

#40 @dd32
3 months ago

In 8655:

Plugin Directory: Allow access to the /browse/adopt-me/ section view, this isn't exposed or linked to from anywhere yet.

Props ck3lee.
See #1763.

#41 @dd32
3 months ago

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

In 8656:

Plugin Directory: Re-enable the adopt-me widget, as the data powering it is now correct.

Reverts [8648].
Props ck3lee.
Fixes #1763.

#42 follow-up: @SergeyBiryukov
3 months ago

@dd32, thanks for the commits :) In the future, could we give props to everyone who contributed to the ticket in a significant way (including design, text suggestions, etc. and not just code), same as the Core Team does?

#43 in reply to: ↑ 42 @Travel_girl
3 months ago

Replying to SergeyBiryukov:

@dd32, thanks for the commits :) In the future, could we give props to everyone who contributed to the ticket in a significant way (including design, text suggestions, etc. and not just code), same as the Core Team does?

That would be great!

Note: See TracTickets for help on using tickets.