search

spyder-ide / ux-improvements

Discussion about UX improvements for Spyder 5 and beyond
4 stars 2 forks source link

Change the color for the tooltips #2

Closed juanis2112 closed 3 years ago

isabela-pf commented 4 years ago

Because the current tooltips are a low contrast black text on medium blue, I’m proposing to change the colors to higher contrast options and increase legibility.

I’ve mocked up three color options see how they look with the rest of the Spyder UI colors. All proposals pass minimum contrast recommendations by WCAG 2.1.

Blue 3 The blue version is closest to the current experience; to meet contrast standards I did have to use a blue that does not currently exist in Spyder.

Dark 1 The dark version blends in the most, which has pros and cons. It fits well with the existing UI, but it also is the hardest one to spot which may not be ideal for a tooltip. I did find some applications using dark tooltips in a dark UI even though it did not seem to be the most common choice.

Light 1 The light version stands out the most. Surprisingly, light tooltips in a dark UI seems to be relatively standard in other applications I explored.

I think any of these options could work well, so feedback is welcome. I’ll be happy to post the exact specs for whichever direction we decide to pursue.

isabela-pf commented 4 years ago

When meeting with @juanis2112 and @ccordoba12, we decided to go with the blue option. I've listed the specs below:

isabela-pf commented 3 years ago

Quickly updating this with some very simple mockups showing the tooltips with the WIP color system as it is now at #13. Many of the colors are the same and were based on this original work. I'll keep coming back to this as more significant changes are made.

Blue 4 Blue 4 Light

juanis2112 commented 3 years ago

We will like to see lighter shades of blue for both themes.

juanis2112 commented 3 years ago

Closing with https://github.com/spyder-ide/spyder/pull/14665