Archive for June, 2010

Use colour selection tools for harmony

17.06.2010 0

Colour is an important part of any design, it immediately sets the tone and helps to communicate the mood of your message.

Tones of a colour can be easily matched, but just because a website has the colour red doesn’t mean you add any old red and expect design harmony.

So when a friend, who is creating a slideshow for a class reunioun, asked, “how do I match my school colours?,” I thought that would be a great topic for a post.

There are two easy ways to get the numbers you will need to match your colour to an existing colour. If the colour is online, I would highly recommend using Firefox’s ColorZilla extension.

It assists web developers and graphic designers with color related tasks - both basic and advanced.  With ColorZilla you can get a color reading from any point in your browser, quickly adjust this color and paste it into another program. You can Zoom the page you are viewing and measure distances between any two points on the page. The built-in palette browser allows choosing colors from pre-defined color sets and saving the most used colors in custom palettes. DOM spying features allow getting various information about DOM elements quickly and easily.

With ColorZilla you can get a color reading from any point in your browser, quickly adjust this color and paste it into another program.

I use this handy extension frequently, it’s so easy to grab the RGB or hex colour values from a design element for use in Photoshop, or to use in your CSS.

Speaking of, there is an easy way to grab any colour anywhere on your screen using Photoshop.

Simply select the Eye Dropper tool and take a sample from an area by clicking and dragging from your Photosop document to where the colour is. This will load colour into the foreground colour box of the colour picker, for use in your design.

Once you have your colour, time to create a great palette using Adobe Kuler (as outlined in a previous post).

If you aren’t using Lab colour, you should be

02.06.2010 0

Free online screencasting tool

Note: this demo should really use a low constrast photo for dramatic effect, but I had trouble finding one because the north’s low-angled sun makes for a lot of great lighting!

You can’t always take photos during the magic hours of sunrise and sunset, and sometimes bad lighting makes colours washed out even monochrome.

For these photos, there is an easy fix: Lab colour. The method involves few steps:

  • Go to drop down menu: Image>Mode>Lab Color
  • Go to drop down menu: Image>Adjustments>Curves (Cmd M on Mac)
  • Click Curve Display Options and make sure the grid of 10% increments is selected
  • Find a and b channels (along with Brightness) under the Channels drop down – this is where the magic happens
  • Adjust the Input levels along the bottom and top, either 10 or 20 per cent depending on how much colour boost needed
  • Change your image back to RGB or CMYK once you are happy with the contrast. Lab colour files save as PSD, so’ll you’ll know if you forget this step.

This method can work wonders on washed out scenes for times when you can’t get reshoot and it takes 2 minutes.