Ai: Rasterize Vector Logos

Apple Logo:

I opened the image in Adobe Illustrator and using the process I had before with my self portraits, traced the image and expanded it. I traced this logo using the High Fidelity Photo option. Afterwords I used Save for Web and selected and saved it as a .gif with 256 colors.

Batman Logo:

As before, I opened and traced the image. This time I traced it with 3 Color trace option. I then went to Save for Web and saved as a .gif using 8 colors.

 Firefox Logo:

This time I also traced with the High Fidelity Photo option and when I saved it I saved as a .gif 256 colors.

Sony Erickson Logo:

This one was a bit harder to work with. After scaling the image to a proper size it was extremely pixelated. I traced the image with multiple settings before deciding on Low Fidelity Photo option as the High Fidelity was grabbing too much of the pixelation and using it in the image trace. I saved this image as a 128 color .gif

Vector Self Portrait

What is a Raster?

A raster image is any image made up of pixels.

What is a Vector?

A vector image is created using Adobe Illustrator, or similar program. It is based off of a mathematical formula to create images, not pixels.

Converting Raster to Vector

After opening your Raster image into Adobe Illustrator and scaling it to the proportions you like, select the image and click on Image Trace on the tool bar. Click on the drop down menu will give you alternative options on how you would like the image to be traced out. After the image has been traced, select it once more and click on expand on the tool bar. The image is now composed of vector shapes.

Process with visuals

Original PSD file

I took my self portrait and manipulated it in Photoshop until I had the desired affect. After saving it as a .psd, I opened a new document in Illustrator and placed the image inside. 

3 Colors

I selected the image and from the drop down menu selected 3 Colors. It traced the whole image and filled in in with these three colors based on the major colors it recognized.

6 Colors

While I had liked the three colors I was curious to see what it would look like with the other options as well. For this one I chose the option 6 Colors and as before, the program chose the 6 most prevalent colors of the image to trace. Later, I would work with this one more.

16 Colors

I chose the next option 16 Colors and it chose the 16 most dominate colors from the image to trace. It does provide a bit more in between colors, I liked the 6 color one for the second part of the assignment better.

Modified 6 Colors

Using the image created from the 6 Color image trace, I expanded the image which gave me the vector shapes I could freely modify. I went through and manually selected specific colors and filled them with a different color, changing the color scheme of pink-purple-green to almost all cool colors. I also modified the points on some of the paths, changing how the outline of the images were as well as moving the whole shape back or forward to create a gap between the colors.

Pen Tool

Shapes in Adobe Illustrator

Clone Tool

Defining Clone Area:

After selecting you Clone Stamp tool, use must press down on the OPTION key to select the area you wish to copy from. Once the area has been selected you can then copy, or "clone", that part of the image onto another part.

Brush Sizes:

Brush size is important when it comes to defining the clone area and application. If you brush size is very large then the area being pasted down will be large as well, which if you are working on a smaller surface would make it difficult. 

Liquify Filter

Filter Effects

 

Forward Warp Tool:

Smudges the image.  

Reconstruction Tool:

Restores image to it's previous state.

 Pucker Tool:

Drags the image into the spot clicked, like being sucked into a black hole.

Bloat Tool:

 Expands the area from point clicked, like filling it with water.

An image using all the tools

GIF Colors and Quality

Number of Colors: 6

File Size: 7,891 bytes

Number of Colors: 200

File Size: 27,357 bytes

Both of these images have smaller file sizes compared to their .jpg versions because they are both in Indexed color mode instead of RGB. Since it's in indexed color mode, the amount of colors are restricted to 256 or less colors, in the examples above it is specifically 6 colors and 200 colors.