Tuesday, September 30, 2008

Soft-Edged Images For the Web

In printing, halftoning is the effect of using dots of various sizes in primary ink colors to create what appears to be whole bunch of colors. Newspaper photos are a classic example of this. If you look closely at color or black & white photos in a newspaper (the printed kind), you can see these patterns of dots.

We don't think about halftoning much in connection with on-line images, because we can display so-called true colors in a Web image. They're still made up of primary colors, but the process and the dots are mostly invisible to people who create and view Web sites.

However, there is one issue with Web images that can still make good use of halftoning. That has to do with transparency. Images on the Web can have transparent parts, but they can't have semi-transparent parts. In other words, if you use Photoshop to make beautiful soft-edged images, your Web page will have to have a white background to keep that look.

If you want an image to appear to have a soft-edge, but the background is complex, with different colors and/or patterns, you can approximate that soft edge by using halftone dots. An example of this is at:

The interesting thing is that the halftone dot pattern is almost invisible. That's right. The human eye more or less tunes out this regular pattern, so the white box appears to fade more or less smoothly into the background. (Not now, of course, because you're looking for it! Try squinting a bit.)

So, here's how you can get this effect with Photoshop:
  1. Create the basic shape for the image background (rectangle, ellipse, etc.)
  2. Blur the edges with Gaussian blur to get the right edge "fuzziness"
  3. Convert the image mode to "Bitmap," using one of the dither or halftone options. These give you a lot of control over what pattern gets used to approximate the grayscale of the blurred shape.
  4. Now convert the image mode back to "Grayscale". It's grayscale, but all the actual pixels are either black or white.
  5. Use the Select->Color range ... tool to select all the background pixels, and delete them, leaving a transparent background.
  6. You can use Select->Color range ... again to select all the opaque pixels and make them any color you want.

Tuesday, September 23, 2008

Adobe CS4 announced

Adobe's Creative Studio 4 was announced today. I'll post in more detail once I've had a chance to go over the full information.

Thursday, September 4, 2008

Upcoming Adobe CS4 Unveiling

On Sept. 23, Adobe will be taking the wraps off Creative Suite 4, the latest version of its brace of creative software tools. You can sign up for a Web broadcast about it. With their acquisition of Macromedia a few years ago, Adobe has certainly become the leading player in a slew of graphic arts-related technologies, including not only print but Web-based graphics, interactive applications, etc. So this unveiling will be important for anyone in the field.

Two of Adobe's preeminent software products, Illustrator and Photoshop, have sometimes suffered in comparison with the former Freehand (Aldus and then Macromedia) and Painter (Fractal Design, then Metacreations and then Corel). Adobe came close to grabbing Freehand when they acquired Aldus in 1994, but the original developer, Altsys of Texas, sued to regain the marketing rights they had licensed to Aldus, and then was promptly swallowed by Macromedia. Adobe finally gained Freehand as part of the Macromedia acquisition, and they immediately killed it off as a competitor to Adobe's own Illustrator.

Fortunately, I think many Freehand lovers will rejoice at new features in Illustrator CS4.

Likewise, I think fans of Painter will welcome the new additions to Photoshop in CS4. The core set of photo retouching tools will continue to expand more and more into the realm of image creation.

So what features do you think will be in CS4? What would you like to see? Click on 'Comments' below to add your ideas.