Ask HN: How do you find a colorscheme for your project?
Assuming that you do webdesign yourself, at least initially, how do you go about finding a good colorscheme?
Do you "borrow" from a site you like, get help from design-savvy friends, use online color tools, or do you just have great design sense and come up with breathtaking colorshcemes at the drop of a hat?
If there are any good online resources for this please share them :-)
Thanks!
(
34 comments
| 38 points
| on HN
)
There is a neighborhood full of very well-painted homes that has inspired a few of my designs. One time I pulled a color scheme from macro shots of my backyard. My client said, "Wow, I really like that brown, what is that?"
It was dog poop.
The best advice I know regarding color schemes: spend time up front finding a good 6-8 colors to cover everything from backgrounds to link hovers, and then, stick with that scheme for your first iteration so that you don't get hung up on choosing colors all the time.
As I waste-time on the internet (err, do market research) I bookmark attractive sites. My only scruple is that I try to pick a site that is totally off-topic in a completely different industry. One of my projects recently "was inspired by" http://heroku.com/. I hope they take that as a compliment.
my feed reader is full of design blogs that i use to siphon ideas into my head. i'm not good with creative design. i design like an engineer would -- i look at a lot of things, take the pieces i like, and reassemble them together to the best of my abilities.
most of the things i create are just compilations of things i've seen in the past that i thought were neat.
Kuler has tools that support this workflow too.
What I don't get is the "shopping for color schemes" workflow that sites like Kuler support by default. I have also never liked anything that came out of a "generate split complements" color wheel tool; the real aesthetics of things like triadic schemes depend too much on saturation/value, and not enough on hue.
Either way, designer or coder, it helps to concentrate on the rough functionality first and then layer things in later, like typography, logos, icons, color schemes and other visual polish.
I'm giving a talk at Adobe in about a week and a half on the subject of rapid prototyping in Fireworks, I think there'll be a screencast or video going on, for anyone interested:
http://www.meetup.com/Fire-On-The-Bay/calendar/9583191/
And don't just take my word for it, Mark Boulton's got a great PDF book out with the same approach, if you're interested in improving your process as a designer:
http://www.fivesimplesteps.co.uk/
Another resource I've used to good success is http://kuler.adobe.com (requires flash) which lets people (some of whom are quite a lot more competent than I at this) create and share colour themes.
Finally, a neat tool that I saw make the rounds recently is http://www.gpeters.com/color/color-schemes.php which lets you search on a word and uses Yahoo!'s image search to come up with some colour suggestions. That is not a theme place, but it's a fun way to perhaps stumble across a colour you like to use with tools like those above.
Creating good color schemes and good icons is as much a specific skill as creating good code.
If you're serious about a product, it's worth the investment. The first thing folks see with your project is the UI; the colors and the icons and such, after all.
Also, not everyone has money to spend at the beginning of their startup.
One obvious one is the audience you're expecting. If you're selling to a bunch of other coders, maybe a great design is less important than your feature list and the first-glance at documentation. If you're trying to do something social aimed at college students, or moms, or something, it may become worth considering, depending on the second point.
The other, less obvious (and less insulting than it sounds) one is, frankly, if you're any good at design. This might sound harsh (and will maybe be disregarded coming from a designer), but good design is harder, and more subtle, than most people think. Many programmers (and managers/producers/friends/pets) know just enough about design to be dangerous. Unlike the source code, everyone on a project sees the design, and everyone has seen and interacted with a million designed websites and front-end interfaces. Hell, most people on most teams have probably built their own full site from scratch, often many times over.
What that means is that when it comes to the design of your site and whether or not to call an outsider, you need to be honest with yourself. Do you know enough, or do you know enough to be dangerous? When you're making decisions about how a piece of art looks, or how a point of interaction works, are you thinking first and then acting, or are you acting first on something that seems cool and then retroactively filling in reasons behind that act to reassure yourself that you're being smart? Do you like a widget on that site because it maps to a specific end-user need you're trying to fulfill, or because of their fancy javascript implementaton?
As for wanting to learn to be a better designer, I think my best advice is to not do it on the job. If your motivation is truly to learn and gain skills for the future, it makes no sense to risk your current project by using it as a classroom for your own benefit. Would you let your graphics designer friend check chunks of code into your site to teach him how to program?
If it is a matter of not having the funds, then obviously you must make the best with what you've got! If what you've got is yourself, no free time, and no money, then there is definitely some excellent advice for how to inspire yourself in a pinch spread across this thread.
If you have time, though, I think that as a designer, beginning or seasoned, the most important question to ask at any juncture is "why?" Most of the advice earlier in the thread seems to stop at "I find some colors that I like and just use them." That's sound advice, as long as it takes the next step! Why did the designer of this other bicycles-themed site choose these colors? Were they really trying to communicate some mood or tone or feeling about the product, or has their parent company's logo just been a blue and yellow plaid since 1936? Why did the designer of this site decide to make the login panel side down instead of just appear instantaneously? Further, why wasn't the login panel simply visible the whole time, why was the decision made to hide it by default in the first place? Was there some sort of intended user behavior or control of site flow there, or was someone just excitedly jerking off because they'd discovered ui.jquery.com?
If you have the time to explore, start a smaller or less risky project, personal page, or hobby endeavor, and use that to learn the ropes, to find out what your strengths are, what you like about designing things. That might sound a tad touchy-feely, but finding out what you like about design and what you do well will help you when its time to sit down and do something real.
Also, if after some exploration, you do find that design really just isn't you for whatever reason, your best bet is to instead spend the time learning the language of design so you can properly talk to and problem-solve with people who are really into design and (if they're good) share your goals of building quality things. Learn the basic terms surrounding typography and colors, of desktop publishing and layout. Learn what is complicated for a designer and what is easy, and remember that, like programming, while designers strive to achieve results which look very simple and clean to "outsiders," the path they take to get there is never as easy and simple looking as the output it presents.
That was certainly more rambling than I intended. Sorry, guys.
Usually it's art that I draw from, rather than the work of other designers--Rothko, Hokusai. Recently I saw an understated gem of an exhibition: Vilhelm Hammershøi at the Royal Academy. I would love to incorporate some of his subtle tones and textures into something.
Or if I'm at a loss, i have this widget: http://www.colorschemer.com/galleria_info.php
i guess after a while, you like black as a background so much that it creeps into your projects ("black's da new white, yall!").
our next project, which we should have ready in march, is also themed the same way. dark background, neon'ish colors. i need to get over it. there was a phase i went through where everything was white and blue. i honestly have no idea where i get these fetishes (fetishii?).
but yeah, great artists steal. anarchy has no rules, so declare a form of government and go ballistic ("maybe wrong in YOUR country, but in mine, which i happen to login via root, it's perfectly acceptable.")
Hint : it's good to mix some cold and warm colors. Try to keep some white space (or at least, light tones).
http://colorschemedesigner.com/
http://www.colourlovers.com/palettes/top
but found them pretty wanting..
...unless my project IS www.colr.org.
Then I stick with white and gray.