How to vector a logo?

Question

I'm trying to convert the logo I've built in photoshop to a vector so I can resize it to fit different app and mobile screens.

I've tried the live trace in illustrator function but that just distorts the image and makes it black and white which makes it different to the original version, albeit with no pixels.

Does anyone know how to vector a logo?

I want to vector it so it's exactly the same as the original just without pixels so I can resize it without the image going blurry.

Thanks,

Answer 1

I think Image Trace in Illustrator would actually be able to do what you want with less distortion if you adjust the settings. By default, it will not probably work well, but show the Image Trace palette (Window > Image Trace), and you can select the colors and adjust the fidelity of the vectors to get a better result.

Answer 2

Automatic tracing tools can be hit or miss and they're certainly better for when the artwork is well suited for it. It's difficult to offer specific advice without seeing the logo, but logos should typically be manually vectorized (or at the very least, hand tuned after auto tracing). Ideally, logos should be initially created in a vector editing program from the start rather than raster than converting, but that's a different discussion.

To become proficient at vectorizing things, you'll need to get comfortable with the Pen tool and Bézier curves. You can often save yourself a lot of effort by breaking the art down into basic shapes such as rectangles and ellipses. To provide an example of how you should break down the composition, here's the Twitter logo constructed using circles only:

^{Image courtesy of designshack.net}

Admittedly, that's a rather extreme example and you don't need to be that crafty. But the more you break the artwork down into basic shapes, the easier it can be. Anything that remains can be constructed with the Pen tool. It takes some getting used to but with some practice you'll get the hang of it. You can look up videos for guidance or check out Adobe's help docs.