Tint Layering
I think I’m pretty good at working with images. From both an aesthetics point-of-view, and when considering optimization. I’ve been working with images a long time and I’m passionate about it so it seems reasonable that I have a high comfort level working with them. But writing about them and writing about making them, as my Imagery & Graphics Category will reveal, is another matter altogether. I’m sorry. I’ll try to do better. Beginning with this new entry I’m calling Tint Layering.
My primary image-working software is Macromedia’s Fireworks. I use the MX version. I rarely use anything else as rarely is anything else needed. I will not be covering the specific use of Adobe’s PhotoShop, though I do have the program, so some of the user-interfaces references may be slightly off, but not by much I bet. However, the techniques I will discuss are easily transferable to PhotoShop and most other quality programs. If you’re at all familiar with image programs, you’ll grasp the concept and do fine with it.
What is Tint Layering?
I have given a technique I use a name. I doubt, though, that it is my technique or somehow original. It is not, or rather I don’t know. Tint Layering is just an image treatment I experimented with when I made the GBHXonline.com website. In fact, the vast majority of the images on that site underwent the treatment described herein. The effects should be immediately obvious. But you may notice a lack of consistency. Partly this is due to the varied images. But it can also be attributed to my experimentation.
The images are tinted or colorized it would seem. And right you would be to think that. But it actually goes further than simple tinting. It also involves overlaying color, and altering a base layer. The object is to offer controlled tinting, hue, saturation, and brightness, more so than one would get playing around with those controls. Here’s what I do.
How do I Tint Layer?
Here are the steps.
- Create a new image. The web layer should be white.
- Import a copy of a quality full-color photographic file, probably a JPEG or native PNG. Using the program’s interface, make a copy and paste it in place (or in Windows use Ctrl+C to copy and Ctrl+V to paste).
- Set the top layer’s transparency, the one you just pasted over to about 20%. Enough so you can still see it as well as the underlying image.
- Position the top image directly over the bottom image until the alignment is dead on.
- Increase the transparency of the top image until it is total — zero opacity.
- Now, using your layers menu, grab the underlying image.
- Using your various tint adjustments: hue, saturation, and brightness, even contrast and opacity, make the bottom image a tint of your choice. You can even “colorize” the whole thing. I used an aqua-blue on the images on the GBHXonline.com website.
- Now, again using your layers menu, grab the top layer and start increasing its opacity (or reducing its transparency).
- As you do this you will start losing the tint and gaining color. You should notice the color comes into view by varying degrees over different parts of the image.
- That’s it. Once you get it the way you like, group the images and export the final (as a JPEG more than likely).
That’s it, that’s the whole process. Some will now be surprised thinking that’s no big trick. It’s not. Others will say you can do this with a single image simply by adjusting saturation, hue, and brightness. And you can, but the results will be different. This seems to provide the artist with a lot more control over the amount of color versus the amount of tint. At least this is my experience.
Need more control. Try adding a sandwich layer and adjust its color and readjusting the settings on all images. The number of variables is infinite so there’s a lot you can do. Quite a bit more than simply tweaking a single image. Or, that’s the idea, anyway. Enjoy! 
Jonathan Fenocchi responds:
Posted: October 22nd, 2005 at 4:27 pm →
Pretty cool, Mike. Normally I just use the simple built-in controls in Photoshop, but when there is a need to do further modifications, there is a very wide range of effects you can achieve with multiple layers, opacity, and blending modes. Good writeup.