Convert vector artwork into different formats
You may have an SVG, PDF, or EPS file that you want to use as a bitmap image.
There’s a gulf of difference between bitmap and vector graphics. Bitmap art is made of pixels and has a scale attached: each pixel represents black or white, or some gray or color tone. The resolution of the file—how many pixels wide by how tall—defines the amount of information in it. Scale it up and you start to see the individual pixels.
A vector graphic, however, defines just the relationship of arcs and lines, which can be colored or filled with tints or patterns, and can be scaled to any size large or small. At whatever size they’re scaled, they render to the screen: the geometrical data gets converted to pixels for display. (Text included in vector files are almost always made of vectors themselves!)
It’s not uncommon that you have vector art that you want to use as an image on a website or in software that can’t import a given format. That vector art could be an EPS (Encapsulated Postscript) file, a format that dates back decades and is associated with Adobe Illustrator; or SVG (Scalable Vector Graphics), a newer spec developed for web display and broadly used. (Why render an SVG when you could just include it on a webpage? SVGS take processing power and have other limitations relative to bitmaps.)
Vector art also sweeps in PDF files, which may combine type, vector, and bitmap images. PDFS are always rendered when viewed as whatever zoom ratio you’re looking at.
I’ve been sent vector art to use as a company’s logo on a project, as well as receiving PDF files that contain a mix of material that I need to flatten into a bitmap for a particular size. Sometimes the material doesn’t exist in another format—it may be archival or created for a particular purpose—or you don’t have time to reach the party who has the files to get another format.
THE PREVIEW APP
The Mac’s Preview app can help with all of this. While it’s often seen just as a PDF viewer, it can read vector formats, render them, and let you either export flat bitmaps—or you can take a shortcut I’ll explain.
You can simply drag an EPS or PDF file onto Preview or choose it from File → Open. SVG files have to first pass through Safari, which will render them, and then you choose File → Export as PDF to create a file that can be read in Preview.
With the file open in Preview, simply select File → Export, and then choose the type of output you want from the Format pop-up menu.
> For the common formats of PNG, JPEG, and TIFF, choose an output
resolution by considering the final size at which you want to reproduce the resulting image. For Retina display on a web page, you want the file to be 144 pixels per inch at 100 percent of its intended size. To find the scale, choose Tools → Show Inspector, and then choose Edit→ Show Markup Toolbar. Click the selection rectangle at upper-left, and wherever you drag, the Inspector will show the size at scale, as in inches. You can also use it to crop by choosing Tools → Crop with an active selection.
> With JPEG, you can move a Quality slider from Least to Best to control how much detail and color fidelity are preserved. By testing different settings, you can slide towards Least and see how much smaller a JPEG export is while preserving the degree of accuracy and clarity you want.
> Preview doesn’t let you pick individual pages when exporting a multi-page PDF file. For a PDF with many pages, you might want to copy individual pages to another PDF before exporting.
If the Export option is too fussy, there’s a quick shortcut: use macos’s built-in screen selection screen capture. Press Command-shift-4 and drag the selection rectangle around the portion of the image in Preview you want to use. The resulting image is saved to the Desktop. ■