50 Ways to become a better designer
Posted by Jennifer Farley | September 18, 2007 | 1 Comment
Liquidicity have a terrific post listing 50 ways to become a better designer. It was actually posted in May of this year but I just came across it today.
Particular tips I like are ;
10] Take a shower.
No, not because you’re odor is putting your colleagues off, but because (apparently) running water increases brain productivity. Try not bring the brief in with you, but spending time in a place that you feel really comfortable in can greatly help those ideas flow.
Never thought of that one before!
And;
46] Do what you do best.
Don’t try to win clients who are going to demand more from you than you can offer. If you’re an amazing web designer, don’t go trying to dabble in professional 3D animation because it just won’t work. Stick to one thing, and show everyone else how awesome you are at it.
Photoshop Tutorial : Hand colouring a black and white photograph
Posted by Jennifer Farley | September 16, 2007 | 8 Comments
You can hand colour a black and white photograph in Photoshop in a number of ways. In this tutorial, I’m looking at how to add colour by making selections and using adjustment layers. Let me preface this by saying, THIS EFFECT DOES NOT LOOK NATURAL! It will not look like a colour photograph, but is great for a retro look and can be good fun on old pictures. However, nobody will mistake it for an original colour picture.
1. Open up a black and white photo. I’m using this image from “Vertigo” by Alfred Hitchcock. I got it from movieweb.com which is a good source of high resolution movie stills.
2. Choose Image > Mode > RGB to change the photo from greyscale to RGB colour mode.
Now we’re going to select different parts of the image and paste them onto new individual layers. The quick mask is helpful here.
3. Select the Quick Mask (Q) and choose a suitable brush size. Start painting on any area of skin in the pic. Painting with black will cover an area in pink-red, this is the part that will be selected.
4. Make sure to leave the eyes out of the selection. If you’ve included them, just change the brush foreground colour to white and paint them out of the selection. You can do this anywhere you’ve made a mistake and “gone outside the lines”.
5. When you’re happy that you have only the skin area selected (no clothes, no eyes, no background!), press Q again to switch from Quick Mask mode back to Normal mode. You will see that the areas you painted in black are now selected. We need to invert this selection now so choose Shift + Ctrl + I (win) or Shift + Cmd + I (mac) to do so.
6. Copy the selection by pressing Ctrl + C (win) or Cmd + C (mac).
7. Paste the selection back in by pressing Ctrl + V (win) or Cmd + V (mac). This will paste the Skin selection into a new layer. Rename the layer in the layers palette (by double-clicking on it’s current name – Layer 1) and call it something like, ehm, Skin.
8. Now repeat steps 3 to 7, so that you have layers for hair, jackets (I did male and female as separate layers), wallpaper and whatever other sections you want to colour in. Your layers palette should end up looking something like this;
9. Now that each part has been isolated, we can start colouring!
10. Click on the skin layer to select it. Choose Layer > New Adjustment > Layer > Color Balance. I’ve named the new adjustment layer “skin” and also hit the checkbox “Use previous layer to create clipping mask” so that a checkmark appears in the box. Click ok
11. Now the Color Balance dialog box opens and here you can decide what kind of colours you want to set up. If you’re going for an alien look, you might want to give your subject green or blue skin. For my image I used the following settings:
Shadows: +81 -8 -31
Midtones: +12 -7 -17
Highlights: +8 +4 -9
Click OK and you will have set up an adjustment layer that doesn’t alter the pixels in your original image. To go back and change any settings, double click on the thumbnail with the shapes in it.
Looks freakishly cool already!
12. Repeat steps 10 and 11 for every part of the image that you have isolated, setting up adjustment layers and colours as you go.
My final image looked like this:
It’s worth spending a bit of time getting your initial selections right, then it’s easy to pick and choose colours with the adjustment layers.
Added a Blogrush widget to this blog
Posted by Jennifer Farley | September 15, 2007 | 2 Comments
I’ve added a new widget to the sidebar. It’s called Blogrush and the idea is that it shows posts from other bloggers in related areas, so in this case it SHOULD show links to other blogs featuring design and photoshop articles.
It’s free to join up and get the widget and it should also hopefully draw some extra traffic to your blog site. There is an excellent informative video on the site that shows you how it all works.
Finding Hidden Transform Handles in Photoshop
Posted by Jennifer Farley | September 13, 2007 | 3 Comments
When you drag a large image onto a smaller one in Photoshop, often you will need to make the larger photograph smaller. To resize the large photograph, you can use the Edit > Free Transform option. However when you choose Free Transform in a situation like this, the corner handles you need to drag to resize will be out of reach. Here’s how to quickly find those handles.
First, just so you can see what I’m talking about, let’s set up the situation.
1. Create a new document with a size of 500 x 500 pixels and a resolution of 72 ppi.
2. Open a photograph or image that’s larger than this. (most high-resolution stock photography will be larger than this and certainly any photograph from a modern digital camera will be larger than this). Note that in the image below, the illustration of the girl LOOKS smaller than the blank image, BUT I was viewing the illustration at 50%.
3. Using the Move tool, click and drag the large image onto the 500 x 500 pixel image. You’ll see that the larger photo will extend off the edges of the document you dragged it onto.
4. To scale the image down, you can use Edit > Free Transform (or hit Ctrl + T/ Cmd + T for Mac). Unfortunately because the image is so large the resizing handles are not visible. You should be able to see crosshairs indicating the centre of the image but not the handles.
5. While the Free Transform is active, hit Control + 0 (zero) on the PC or Cmd + 0 (zero) on the keyboard. Hey Presto, Photoshop will change the view of the document window so that you can see the handles.
6. Resize the image by dragging the handles. Remember, hold down Shift while dragging the corner handles to ensure the proportions are constrained.
Using Colour in Design: Tints and Shades
Posted by Jennifer Farley | September 11, 2007 | 1 Comment
If you’re new to working with colour, it can be tempting to use LOTS of colours, but by sticking with one colour you can gain a nice uniformity in your designs. To get a range of colours based around one colour, you can do two things;
1. Add white to the base colour. This creates a TINT.
2. Add black to the base colour. This creates a SHADE.
Monochromatic Colour Schemes
The monochromatic colour scheme uses variations in shades and tints of a single base colour. You can use this scheme to create a clean elegant look. The monochromatic scheme is very easy on the eyes, especially with blue or green hues.
A monochromatic colour scheme can give a site a clean and classic look, but also provides excellent opportunities to let full colour photographs dominate. Monochromatic schemes are often used for serious political and business sites such as banks and large corporations, but a quick trawl of the web will reveal some very cool and trendy sites using this scheme too.
If you’re using a monochromatic colour scheme i.e. a ONE colour scheme, you can convey an order of importance for items like a menu or a chart on the web or print by using tints or shades.
In the illustration below, I’ve set up a menu for a webpage, using Photoshop, which is based around a kind of moss-green colour. I’m using tints to show the hierarchy, with dark green at the top level, a lighter green for the main menu rollover, lighter again for the drop down menu and almost white for the menu rollover.
A few examples of websites using a monochromatic colour scheme that I like are;
1. http://www.centrigy.com/ - A vision in blue.
2. http://www.manuela-hoffmann.info/ - A mossy green site from Berlin.
3. http://www.ignite-imd.com/ - Producing a warm orange glow.
4. http://www.tubatomic.com/revolver/ - A fiery red.
Any monochromatic colour schemes out there that you like? I’d love to hear from you.
Design Inspiration : Autumn Whitehurst
Posted by Jennifer Farley | September 10, 2007 | Leave A Comment
An illustrator that I’ve come across in the past and then “stumbled” upon again today, is Autumn Whitehurst. Autumn is based in Brooklyn, New York and creates beautiful artwork which is a combination of photography (or photorealism) and line drawing.
You can read an interview with Autumn here and see a gallery of her work here.
-
About
Hi, my name is Jennifer Farley and I am a designer and design instructor based in Ireland. Read more about Laughing Lion Design .
Hire me for illustration work too!
view my portfolio:
coroflot.com/jennyrusks -
Connecting
