yui / skinbuilder

A tool for creating skins for YUI widgets
Other
30 stars 12 forks source link

Skinbuilder Colors, how to use? #33

Open dpetratsch opened 10 years ago

dpetratsch commented 10 years ago

Hello there,

i don't understand the handling of the skinbuilder. Why can't i enter a hex code for a color in the scheme? I have my fixed color codes for the project and i cant guess the colors by adjusting them from the base-color. This is not usable for me. So please tell me (or us) a way to achieve the exact colors for the different schemes.

Thank you.

jconniff commented 10 years ago

@petewulf The big concept of Skin Builder is to help people to generate skins (many many colors & padding sizes) by only specifying a base (page background) color and a single background color for the visually most-dominant objects. The app then figures out the rest, including making the text readable everywhere. You probably already figured out that this is the big concept. We made this app as an alternative to hand specifying a zillion different hex values, one for every item. We discussed having a way to hand specify individual item's hex values. If we did this, then we asked ourselves what would happen to the automatic generation feature when someone changed one of the base colors. Either the hand-entered hex values would be lost, or they would be blocked from changing. If blocked from changing, then readability of text, and the harmony of colors feature would be fractured. If you're in a situation where many hex values are dictated to you, you could start by Clicking the "Schemes" tab, then click the "Create Custom Scheme" radio button, then add your hex colors for page background, and most visually dominant background. do this by clicking the small icons that look like this picker_icon entering the hex value then clicking away.

skin_builder_00 fiddle with the other background relative controls, by clicking the color-ring icons scheme_icon until it's close to what you want.

skin_builder_01 then grab the CSS that Skin Builder generates, from the "Code" tab, and hand replace the hex values that you are mandated to use.

If you're on a project with a strictly proscribed, detailed color scheme, Skin Builder may or may not be the tool for you. you may just have to do a bunch of CSS work. Let me know how it goes.

Hope this helps.

dpetratsch commented 10 years ago

Hello Jeff, thank you for your fast and detailed reply. I already understand the concept of the skinbuilder which focuses on automation. It's no problem for me to apply the color settings directly in CSS although this is a little bit of work which i'd like to minimize through the use of the skinbuilder.

I was just wondering why all colors must relate to a base color and the option for entering a hex-value is only available in the first and last color definition.

Maybe this is an impulse for you to extend the skin builder to offer more detailed options so exact values could also be used in future. In my opinion this would be a great improvement.

Regards, Daniel

jconniff commented 10 years ago

@petewulf Thanks for the suggestion Daniel. If we added the feature of specifying all other values by hand, what would be your expected/desired behavior for the auto-generation of colors? For example,

  1. User sets the 2 base colors and a scheme auto generates
  2. User specifies an exact hex (#00ff00) for the text color of a button
  3. User wants to change one of the base colors. Doing so will make the text on the button in step 2 unreadable. What should Skin Builder do: a. Disable the auto color generation after step 2 b. Override the users work in step 2 c. Make the auto generation of colors ignore all hand customized colors, (read, "things can visually go bad really fast")

Thanks in advance for your feedback.

What Skin Builder tries to do is save the user from manually managing the couple hundred colors it takes to create a color scheme, and avoid the whack-a-mole experience of "every time you change a color, something else doesn't look good in relation to it, or is no longer readable."

les113 commented 10 years ago

I think the point the op is making is that the color picker doesn't always work, likewise entering hex values for colors frequently has no effect.