: User Input Color Restrictions What is an appropriate restriction to place on a color gamut for user defined colors? I am helping build a website that will offer organizations to create their
What is an appropriate restriction to place on a color gamut for user defined colors?
I am helping build a website that will offer organizations to create their own pages. We want to allow them the option to customize the background color, as well as the 'highlight' color on their page.
The 'highlight' color defines the color of all icons and buttons on their page. Because of this, we cannot allow the highlight color to be too light/faint/bright.
We offer the following UI to choose a color:
adaptation of bgrins.github.io/spectrum/#details-ieImplementation
You can see the selected color is reflected in the 'choose' button, and would also be applied to other buttons in the UI.
My potentially naive plan was to restrict the color spectrum in two different ways:
Evaluate the selected color in RGB - check if the combined value of R, G, and B is less than 255 (on a 0 to 255 scale)
Evaluate the selected color in HSL - extract the L value (luminance or lightness) and check if the value is less than 0.5
When a user selects a color that is not in the proper range an error message appears to notify that they need to select a darker color.
This implementation seems to work pretty well. All bright colors get caught by the above restrictions with a few exceptions (full green appears brighter to my eyes than full red for example... not sure why)
My question is if there is a standard restriction that is put in place on similar selections. Is there a better way I should be evaluating and restricting the selected colors?
More posts by @BetL875
2 Comments
Sorted by latest first Latest Oldest Best
I'm going to be very blunt.
We want to allow them the option to customize the background color, as well as the 'highlight' color on their page.
Don't. Seriously, don't. Unless you are certain that the editors of the site are very well-versed in colour theory and have a grasp of the general colour palette of the site, giving your users control over colour is a Bad Idea™.
I'd advise you to create a number of pre-chosen palettes, which the customer can then choose from as a set. This way, you give the user the idea.of choice and freedom, without having.the chance of shipwrecks like #ff0000 on #00ff00 that, believe me, your user will want choose at some point. Your proposed rules will only frustrate them, because they can see the colours in the GUI but are unable to choose them.
I'd stay away from showing all color options in a color picker like this for a couple reasons: 1) it's frustrating for a user to see (or even choose) options that they can't end up having. And more importantly 2) most people would be confused by this setup, at least initially. If a user is using your product in the first place, chances are that they would prefer something simpler but less powerful.
What I'd recommend instead is either give them a choice from pre-made colors, or give them a choice of pre-made pallettes (color combinations). You could also optionally allow customisability later or more hidden for more "power users". I do things like this in my applications all the time. By doing this, you can have more full control while not frustrating users (as often).
Terms of Use Create Support ticket Your support tickets Stock Market News! © vmapp.org2024 All Rights reserved.