02 November 2005

Getting svg paths into Expression or Photoshop

I've been doing some graphic design work lately, and I've been trying to make a much better effort to do things using vector format rather than raster. Photoshop (Version 6.0, no less!) is still my favorite image editing app, but I've realized just how powerful path/shape layers with effects applied to them are.

I found some shapes at the Open Clip Art Library that I wanted to use in Photoshop. All the things at Open Clip Art are available in raster (PNG) and vector (SVG) format. "Okay," I thought, "I'll get the SVG version, and copy the paths into Photoshop, getting super high quality paths." Right? Not quite.

Photoshop (at least version 6 - I can't speak for later versions) does not import paths from a file. Apparently, the only way you can get paths into Photoshop is by copying and pasting them from certain applications. I'm aware of two applications that Photoshop can import paths from: Adobe Illustrator and Microsoft Expression/Acrylic (aka Creature House Expression). I don't have Illustrator installed on my machine currently (I've got the installation CD somewhere, but I'm not quite sure where...), so that was option was out.

(Side note: Microsoft used to give Expression 3 away for free, but they no longer shows a link to get it. Last time I checked, though, you could get it from them here. It's a pretty snazzy vector graphics program, but it's got some issues.)

Too bad that Inkscape wasn't on that list. Inkscape does, however, save to EPS files, which Expression can supposedly open.

"Sweet," I thought, "I'll resave the SVG as an EPS in Inkscape, then just open up the EPS in Expression and copy it over." Except - all I got when I tried opening the EPS in Expression was a blank page. I opened up the EPS in other programs, and it showed up fine. Expression just doesn't seem to want to open them.

Back to the drawing board. I tried converting the EPS into various other formats using external tools, all to no avail. Boo.

I stumbled across an article that suggested that Expression could understand WMF data copied out of Microsoft Office products. So I fired up Microsoft Word. I was able to insert the EPS file that I saved in Inkscape into a Word document. From there, I tried copying and pasting into Expression - this time I got a blank box. I then experimented with changing the format of the image using the Paste Special feature of Word, and came across workable results when I pasted it as a WMF and copied THAT into Expression.

So, here are the steps I had to take:
  1. Open up the SVG file in Inkscape.
    • Optional: Get rid of any gradients in the image. SVG has some pretty sweet options for gradients that either WMF or EPS can't quite use. Solid colors work best.

  2. In Inkscape, save the file as an EPS file.

  3. Insert the EPS file into a blank Word/Office document.

  4. In Word, copy the image, and then Paste Special. Choose "Picture (Windows Metafile)".

  5. Copy the new image in Word and paste it into a blank Expression document.

  6. To get it into Photoshop, copy it in Expression and paste it into Photoshop. Choose the "Paths" option.

Whew!