Page MenuHomePhabricator

Experimental suggestions: Update the design of the card
Open, HighPublic5 Estimated Story Points

Assigned To
Authored By
bmartinezcalvo
Tue, Jul 14, 5:33 PM
Referenced Files
F95074229: image.png
Tue, Jul 21, 5:09 PM
F95030851: image.png
Tue, Jul 21, 12:00 PM
F95030787: image.png
Tue, Jul 21, 11:59 AM
F95030686: image.png
Tue, Jul 21, 11:59 AM
F95030675: image.png
Tue, Jul 21, 11:59 AM
F93582003: icon_lightbulb_experimental.svg
Tue, Jul 14, 5:33 PM
F93612326: Captura de pantalla 2026-07-14 a las 19.31.02.png
Tue, Jul 14, 5:33 PM
F93612288: image.png
Tue, Jul 14, 5:33 PM

Description

In T429058 we enabled the introduction of experimental suggestions. Once enabling experimental suggestions we should make them clearly distinguishable from normal suggestions while avoid alarming with the error message currently being used.

Requirements

Current design🟢 Desired design
image.png (640×460 px, 29 KB)
image.png (3,764×1,688 px, 1 MB)
NotesUse dashed line icon to indicate that this is an experimental suggestion, introduce a subheading within the suggestion card that reads, Experimental suggestion for testing, and introduce new item within card drop-down that reads View [experimental suggestions](https://en.wikipedia.org/wiki/Special:EditChecks#experimental-checks)

Event Timeline

Next steps

image.png (640×460 px, 29 KB)
Captura de pantalla 2026-07-14 a las 19.31.02.png (2,454×1,160 px, 772 KB)
Current designProposed design

Per offline discussion, we want to try another icon to more obviously signal that these suggestions are experimental. E.g. maybe something like cdxIconLabFlask

Thinking: people might interpret the current "Proposed icon" to signal a suggestion is higher priority rather than experimental.

Sharing other alternatives for the experimental suggestions icon, using in all them the lightbulb as main icon for consistency with normal suggestions:

image.png (3,764×1,688 px, 1 MB)
Use the cdxIconLabFlask as an indicator.
image.png (3,764×1,688 px, 1 MB)
Make the lightbulb half-filled to indicate this suggestion is not finished.
image.png (3,764×1,688 px, 1 MB)
Use dashed line to indicate that this suggestion is not completed. The problem I see with this one is that it could look like less clickable on mobile than the normal suggestion.

Per offline discussion, we're going to move forward with the dashed line approach.

Note: @bmartinezcalvo adeptly noted that, on mobile, people may question whether the icon is tappable. However, we assume mostly experienced volunteers will be trying experimental suggestions and doing so on desktop. With this said, if/when we come to learn people are confused, we can update the icon at that point.

image.png (3,764×1,688 px, 1 MB)
Use dashed line to indicate that this suggestion is not completed. The problem I see with this one is that it could look like less clickable on mobile than the normal suggestion.
ppelberg updated the task description. (Show Details)
ppelberg updated the task description. (Show Details)
ppelberg added a project: OKR-Work.
ppelberg set the point value for this task to 5.Tue, Jul 21, 5:14 PM