4 ms·

Work with grayscale first. Design your UI with contrast in mind rather then color. Then when all the main elements are in place, pick a good color scheme. I'

Work with grayscale first. Design your UI with contrast in mind rather then color. Then when all the main elements are in place, pick a good color scheme. I've always found colourlovers.com to be an invaluable resource.

alabut 18y ago
That's pretty much my approach and it seems to work well. I find that it helps to concentrate on color last, and not only that, but to set the overall color scheme first and then introduce highlight and alert colors last (like cilantro on top of the main salad) rather than trying to choose the entire palette at once.
jfornear 18y ago
What about for images? Rounded corners, gradients, logos, etc. I would imagine going back and messing with all those later would be a real pain, which is why I think choosing and settling on a color scheme from the start is important.
- alabut 18y ago
  Not at all - it just depends on how good a designer you are and/or comfortable with html/css.
  - jfornear 18y ago
    images don't have anything to do with html/css
    - alabut 18y ago
      It depends - are you prototyping by making wireframes in an image editor or prototyping by coding up a rough working copy? If you're a designer and prefer mocking stuff up in Fireworks or Photoshop, then you should have the chops to build upon the gray boxes and text and layer in effects to add visual polish. If you're a coder and would rather create crude functional demos first, then you should have the html/css chops to layer in visual polish via background images or etc. 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/ 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/ http://www.fivesimplesteps.co.uk/

alabut 18y ago

That's pretty much my approach and it seems to work well. I find that it helps to concentrate on color last, and not only that, but to set the overall color scheme first and then introduce highlight and alert colors last (like cilantro on top of the main salad) rather than trying to choose the entire palette at once.

jfornear 18y ago

What about for images? Rounded corners, gradients, logos, etc. I would imagine going back and messing with all those later would be a real pain, which is why I think choosing and settling on a color scheme from the start is important.

alabut 18y ago
Not at all - it just depends on how good a designer you are and/or comfortable with html/css.
- jfornear 18y ago
  images don't have anything to do with html/css
  - alabut 18y ago
    It depends - are you prototyping by making wireframes in an image editor or prototyping by coding up a rough working copy? If you're a designer and prefer mocking stuff up in Fireworks or Photoshop, then you should have the chops to build upon the gray boxes and text and layer in effects to add visual polish. If you're a coder and would rather create crude functional demos first, then you should have the html/css chops to layer in visual polish via background images or etc. 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/ 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/ http://www.fivesimplesteps.co.uk/