search

phetsims / mean-share-and-balance

"Mean: Share and Balance" is an educational simulation in HTML5, by PhET Interactive Simulations.
GNU General Public License v3.0
2 stars 1 forks source link

Fair Share Screen: Sync/Collect/Share button styling #210

Closed emily-phet closed 4 months ago

emily-phet commented 5 months ago

The Sync/Collect/Share buttons seem appropriately implemented as radio buttons, but the styling--where unselected radio buttons are greyed out--may be confusing to learners. They may appear unavailable.

Suggestion: maintain the same "active" blue coloring for all, but add a bolder highlight around the activated button.

I brought this up in today's meeting, other's also had the same feeling about the radio buttons, and suggested I make this issue. Handing over to @amanda-phet to consider.

amanda-phet commented 5 months ago

I didn't see any concerns in interviews (in fact these buttons worked seamlessly in all three). I'm open to redesigning the style of these buttons, but we generally use this paradigm everywhere we use this style of radio button so I hesitate to do something special in this sim. I will add this to the agenda for the next designers meeting.

amanda-phet commented 4 months ago

I lost my summary, I apologize.

We discuss this issue and since this is rectangularRadioButtonGroup and it touches many many sims, we don't want to change that component. However, upon seeing the implementation across sims, we would like the default styling for rectangularRadioButtonGroup to have a bigger stroke on the selected button, rather than a customization.

The concern for this sim specifically may be that the unselected button's opacity blending with gray might not provide enough contrast with the text, so I will confirm that contrast ratio is good.