Visibone Adds "Unsafe" Color Chart 35
proub writes "If you're one of the zillions of designers who love your Visibone web-safe-palette mouse pads or posters, thought I'd mention that they seem to have added an "unsafe palette" poster as well. If you haven't seen them before, suffice to say it's a great way to find safe color combinations that work (the Color Lab doesn't suck, either). I refer to the web-palette poster constantly when doing www work, nice to have a similar version for GUI design where you have the whole big messy world of colors available."
The original was a good idea, but... (Score:3, Insightful)
The "safe" poster was truly handy for picking common palettes along HSB (hue/saturation/brightness) lines. e.g., "Wow, that's the perfect web-safe shade of blue. Now if I could only find a more subdued version of the same exact hue to use elsewhere in my site."
Once you break free of those 216-color constraints, however, you're probably much better off using any color picker's HSB sliders to create your site palette. Not only do you give yourself more flexibility, but you avoid potential problems caused by picking a color that looks great on a CMYK printed poster, but looks entirely different on an RGB monitor.
Re:The original was a good idea, but... (Score:2, Informative)
Re:The original was a good idea, but... (Score:2)
Yup, bought mine from ya back in the summer of '99. Like I said, it's still on my office wall and still pretty damned handy. I even import the Visibone palette into all my design apps. =)
Honest, I've got the utmost respect for your products, but I just feel this one is a little off the mark for your target audience (of which I am a member). You've extended the metaphor of that safe poster, which is successful in representing a full range of discrete values, to the much broader set of unsafe colors. You can, by neccessity, represent only a sampling these values on the poster, which limits its usefulness as a production tool. I can find a color that's kinda sorta close to what I'm looking for, but I'll still need to go into a desgn app and tweak the color on-screen until it's exactly what I need. In that case, it'd probably be easier to use the app's HSB picker to begin with.
I agree there's a niche that needs to be filled, but maybe a different approach is necessary? For example, I often refer to the Designer's Guides to Color [amazon.com] while developing palettes for print projects. I'd kill for a product that takes a similar approach to "unsafe" web colors.
Anyway, didn't mean to come off as a carping ingrate there. I thoroughly appreciate your products, use them daily, and owe you untold amounts of gratitude. Thanks for all the hard work!
Re:The original was a good idea, but... (Score:2, Interesting)
Really!? Oh boy, do I have a pleasant surprise for you. The newer poster (since 12/99) has much brighter dark colors, like burnished ceramic instead of sunbleached roadkill. And it has decimal codes on each chip. And the logo is MUCH brighter!
Please write me and tell me where to send it. I am certain you'll find it more accurate in the darker shades.
Do I understand correctly, you're saying that 1068 colors is not enough to be useful? Obviously it's a subset by a factor of 16,000. The whole of 24-bit color would take a foot-ball-field size poster.
What I tried to do in the KiloChart was spread the colors out even perceptually not mathematically. Notice how quickly the web safe colors transition from red to yellow? And how many limey greens there are that all look alike? I tried to correct that. I've tried picking from it a few times and have only once found the need to do the tweaking you mention. Once I did want a really subtle pastel color. I didn't find it on the KiloChart and had to tweak.
So my question is, can a paper color picker be useful even with only 1000 colors. (If you'll grant me for the time being, until you see it at least, that it's accurate.) Can it get you to a color that's good enough say more than half the time?
Have I understood your point right?
Say thanks for all the kind words. I'm really glad you found the poster useful. Please don't be too polite to tell me straight. I really want to get this right. If not this batch the next one. All the email I get is so schmaltzy I need to hear some thoughtful criticism.
Did I say I really want to get you the newer poster?
-- Bob Stein, VisiBone [visibone.com], stein@visibone.com [mailto]
Re:The original was a good idea, but... (Score:1)
Mr. Stein, have you guys considered putting this new palette on your page as a download for Photoshop? I use the web-safe ones, and like them very much. I'd like to play with this new colorset you have, too.
Re:The original was a good idea, but... (Score:1)
Are you sure that would be useful? Having to scroll through all the hues? It would be hard to tell looking at the screen and the KiloChart which mapped to which, you know. (Unlike the VisoBone2 swatches in Photoshop matching the web-safe Color Chart for example, which map exactly.)
-- Bob Stein, VisiBone, stein@visibone.com
I would like to know... (Score:4, Insightful)
And why are these so freaking popular? Lets see...
Just do what I did and do a search on google for "web safe colors"...
It turns up tons of pages like This One [web-source.net]...
And in this case, it is simply much easier to look up the color you want and just do a Copy and Paste...
The other thing I don't quite get with this is that it if you use a web page with the "safe color" palette to find colors, wouldn't that be a more accurate interpretation of the end result (monitor instead of a poster)?
I know some ppl claim they are helpful...however, I personally think they are just an excuse for a decoration.
By all means, if you want a poster to hang on your wall, go for it...as for me, I'm gonna save the $$$ and use a web page...
bookmarklet (Score:1)
http://www.bookmarklets.com/tools/design/ind
a few lines of javascript that can be saved as a bookmark and runs anytime you pick it from your favourites - generates all 216 safe colours.
andy
Re:I would like to know... (Score:2, Informative)
(1) OneFix said: "How is a list of unsafe colors going to help?" Just to have a quick way to get a color you have in mind with more choices, that's what I was hoping. Web safe colors give short shrift to earth-tones and pastels for example.
(2) Re looking up a color is easier online. For me, sometimes it is easier online, sometimes it isn't. I make both (color lab [visibone.com]). Most software when it is running and in front of you still takes twiddling to get what you want. Personally, when I have a poster in front of me I just happen to use it to pick colors. It's like the HTML Popup reference I give away for free versus the HTML Card I sell. When I have both in front of me, I reach for the card. (Was that a shameless self-promotion? Ok, I know, but do you think it was an effective shameless self-promotion?)
A chart is one way to envision all the options at once. Personally I like seeing the totality of a thing. I've never seen a color picker that does that. The best show a 2D pattern (HS or SB) with a knob for the 3rd dimension (B or H). So you can only see one slice of the choice-space at a time.
(3) Accuracy of poster versus monitor. I think you'll find the stuff I made using 8 inks matches screen colors far better than anything else. Have you seen one next to a monitor? It's way more faithful than Pantone's ColorWeb for example. First I picked six inks to match the extremes, R,Y,G,C,B,M, and added a seventh because pink is too hot to make with just red and magenta (my pink ink is very close to process magenta actually). Four of those colors were custom blended by Superior Ink. They assigned 6-character pseudo-Pantone numbers for them. The rest are PMS spot colors. Then whenever I print something I'm in the pressroom the whole time and after wrestling with the registration I get the pressman to tweak the 7 colors (plus process black) so they look like the colors between a PC and a Mac but favoring the PC. I've read a lot about monitor gamma, but actually the PC distortion of colors isn't modeled well by a gamma curve, it's very linear with a discontinuity. I wrote about that a while back here [visibone.com]. Anyway, after the first print-run I got colorimeter measurements for all the inks and then I modelled the multiplicative effects of offset printing in order to determine the best screen percentages of two inks and black to get a specific RGB color. Ok, more information than you wanted? I just wish you would *see* the thing next to its monitor redition and tell me if you don't think it matches well enough to be useful.
(4) An excuse for decoration? Exactly! What, your walls are pristine white and free of marks or something?
-- Bob Stein, VisiBone, stein@visibone.com [mailto]
Flaw in the Visibone concept (Score:3, Insightful)
One big problem with this chart, and all the Visibone products: reflective (printed) color is *never* gonna match up well to screen color. Big show stopper there.
To make matters worse, they overlay text, in white or black, over the color samples, which alters the perception of the colors.
What I'd *love* to see them produce is an on-screen version of their charts, sans labels. See a color you like, roll your cursor over it, and up pops the HTML color value. You could do this with a big GIF on a Web page, with a big honkin' image map over it to supply the pop-up values. Even better, make it so if you click a color, it'll take you to another page that gives you useful options such as viewing text in the chosen color against backgrounds of another color, or v/v. Now THAT I could use.
Re:Flaw in the Visibone concept (Score:2)
Right there you go 7k of JavaScript goodness
This is even viewable in your browser so you can see how it'll look in Mozilla/IE/Konq...
BTW, do what I did and find the page that has a list of all of the colors and their names and use an array to list the name of the color too
Re:Flaw in the Visibone concept (Score:1)
Ah, but it *doesn't* work in Opera, my browser of choice. Still, thanks, it's a Good Link.
If I get really bored sometime, I might try to build that GIF I described. I think it'd be a very useful tool. And I can't believe no one else has done so yet.
Re:Flaw in the Visibone concept (Score:1)
Stealing Gryffin's Color Lab idea (Score:2, Informative)
It has a GIF with plain colors and nothing over them (unlike the site OneFix mentioned at internet.com which has little dots in each color sample). It has a big positively honkin' JavaScript image map so you can pick any of those, and while you're hovering over them you can see the codes in the status bar. Then when you pick colors you see all their combinations of text on background on the right (no new page, same page).
Isn't this darn tootin' close to what you were describing? It gets about 10,000 users a week.
-- Bob Stein, VisiBone, stein@visibone.com [mailto]
Re:Stealing Gryffin's Color Lab idea (Score:2)
The only image I found on the colorlab site doesn't have codes that can be copied and pasted (it goes directly to the purchase page).
Something like this [web-source.net] would be easier to use in that case.
I'm not saying someone couldn't find your posters useful, just that (given the options) I don't see why anyone would choose a paper product over a digital solution.
The only reason I see to have a poster is to decorate a workspace...or possibly (very limited) to use in a board room where design decisions were being made.
Re:Stealing Gryffin's Color Lab idea (Score:1)
The gif image I was talking about was this one [visibone.com] That's the image on the left side of the Color Lab at www.visibone.com/colorlab/ [visibone.com]. It shows each of the web-safe colors in a wheel. When you hover over them, the hex code shows up in the status bar. When you click on a color it shows up on the right, along with the 8 most recent colors clicked, along with clipboardable codes and all combinations of text / background for those 8 colors.
I also make hex and decimal color tables with paste-able codes on top of each color like the one you mention at web-source.net. The hex version is here [html-color-codes.com].
However I will confess that your color references have features mine don't:
Websmithing with paper tools -- why? (Score:1)
"I don't see why anyone would choose a paper product over a digital solution."
It's a funny thing. Reminds me of that Spaceman Spiff cartoon where Calvin tries to fire his blasters with a Windows-like pull-down menu interface.
Computers are still really cumbersome to use, like building a ship in a bottle with buttery boxing gloves. The thing I have found is that when I have an accurate color chart nearby, I'll use it, every single time, before fiddling with an electronic color picker.
-- Bob Stein, VisiBone [visibone.com], stein@visibone.com [mailto]
Re:Websmithing with paper tools -- why? (Score:1)
But there's no denying the differences in color gamut. Designing for the Web means designing for the screen, and even Hexachrome printing doesn't really have the range to do so accurately. What your posters *can* be useful for is comparing colors on a *relative* basis, but there's still no subsitute for seeing your colors on a monitor.
Of course, even previewing colors on screen is somewhat approximate, thanks to the widely varying color accuracy of commodity monitors. Now, if you can help with *that* issue, I'm all ears ;{D
Re:Websmithing with paper tools -- why? (Score:1)
-- Bob Stein, VisiBone, stein@visibone.com
Re:Stealing Gryffin's Color Lab idea (Score:1)
Ah!! That's pretty similar to what I was thinking of, yes. Except for the layout; the one I had in mind used the hexagonal layout of your mousepad. What I like about the hex is that you see every color adjacent to all it's "neighbors," which makes it easier to see the minor differences between them. Your Color lab layout is more haphazard.
I *have* bookmarked the Color Lab, though, and I'll be passing it around to my cow-orkers. Thanks!
But have you *seen* them, good sir? (Score:1)
Want to see a sample? Bet ya it matches close enough to be very useful even to your discerning eye.
The first print run (Feb 99) didn't do dark colors well. And the print run in April 2000 had the pinks a little too hot, cyans a little too weak. Those problems are still in the mouse pads and the Color Chart that are shipping today I confess. But the latest Color Poster, Color Card, and the new Color KiloChart are really great color matches [visibone.com].
-- Bob Stein, VisiBone, stein@visibone.com [mailto]
No hex? (Score:1)
Hex is on me (Score:1)
For what it's worth, the Color KiloChart [visibone.com] shows examples of using decimal instead of hex for precisely this reason:
But thanks for your implicit vote for a hex reference. I am considering a Color KiloFoldout like the HTML Foldouts [visibone.com]. Maybe one all hex and one all decimal. Any suggestions?
-- Bob Stein, VisiBone, stein@visibone.com [mailto]
Re:Hex is on me (Score:1)
I do not understand why you are using the deprecated font tag for your hex example, when you may use either hex or decimal in style sheet definitions?
E.G.
<span style="color:#d2ab4d;">
I found it odd that the color chart only has decimal representation.
FuzzyRe:Hex is on me (Score:1)
The chart has only one type of code in order to fit a thousand colors on it. I chose decimal because more software accommodates it. There is no case I can think of where software accepts hex codes but not decimal, can you? With PhotoShop and ImageReady for example, the decimal windows are only a double-click away if I'm not mistaken.
Does that make sense and answer your implicit questions?
-- Bob Stein, VisiBone, stein@visibone.com
Re:Hex is on me (Score:1)
That does make sense, I had forgotten that the old color assignment method only allowed hex. And I understand about the lack of space for both numbering systems on your chart.
It would be nice if the chart was available in hex, tho. I for one find that hex colors are easier to work with, perhaps due to familiarity.
FuzzyRe:Hex is on me (Score:1)
Let the "web safe" palette die (Score:2)
Now, for this "unsafe palette"... well, color charts are fine, but the HSB color picker in photoshop is much nicer and is interactive. It also contains many colors that are impossible to reproduce in print. Not that I wouldn't like to see even more color models on the computer, but what's the point of this?