FLASH :: FLEX :: ILLUSTRATION :: ANIMATION
10 Adobe Illustrator Tips – taterboy
June 16th, 2008 | Filed under: Design, Digital Art
With the nature of vectors being smaller than bitmap images in file size, I typically try to illustrate everything I do for Flash in Illustrator first. I love Illustrator as an illustration tool. Although Flash has made some great progress it’s illustration tool set, it just does not come close to the power and features of Illustrator. I also find Illustrator really fast for laying out design projects and more illustrative graphics then modeling and detailing in photoshop. Like any relationship, my affection for illustrator is not without frustration and we have to learn to accept some of the faults, if you can pardon my Dr. Phil type metaphor, to make it work. So here are some workarounds for some illustrator issues and a couple tips to help you work better with this great tool.
1. New Document Profiles:
Tired of deleting all the colors, brushes and symbols every time you create a new Illustrator document? Sick of making a new template because you accidentally saved over that last one? Illustrator uses Template files for each document profile. Those template files are standard .ai files so you can edit the source of each profile with ease. By deleting all those colors, brushes, and symbols out of these template files, all the new documents you create will only contain the elements and setting you want. You can even create new profiles.
On a Mac they are located in the Library/Application Support/Adobe/Adobe Illustrator CS3/New Document Profiles folder.
On the PC look in Documents and Settings /*User Name*/Application Data/Adobe/Adobe Illustrator CS3 Settings/New Document Profiles/
If you add a new file, it will show up in the profile drop down of the new file dialog box.
2. Free Transform Tool (works the same way in Photoshop and Flash):
This is one of the most powerful tools in the tools palette. If you can imagine the Oxy Clean guy going on about this tool, that’s how great it is.
The real power comes in the form of augmenting it’s functionality with keyboard keys. After selecting a node of the free transform tool bounding box, add the following keys to change its behavior. ***The key is to select a node first, then adding the extra keys. These special keys are:
Shift: Constrains scaling to the original aspect ratio, rotation to 45 degrees, free distort to limited angles, and skew to current height or width.
Command (Ctrl PC): Free distort of corner or side. Works well for mapping and tweaking flat artwork onto a plane in perspective.
Command + Option (Ctrl + Alt PC): Skewing
Command + Option + Shift (Ctrl + Alt + Shift PC): Shear, takes an object and lays it back in perspective.
3. Nudging artwork with the arrow keys:
On some older machines this seems to be more of an issue. When you nudge selected items around the art board, sometimes you do not see the results for a second or two. Normally, it happens with large complex artwork. I find that if I tap Shift, Command (Ctrl), or Space bar, the screen refreshes and I can see the results a lot faster. Holding the Shift key while you nudge is like a 10x nudge. To clarify, 10 normal arrow only nudges equal 1 shift + arrow nudge.
4. PathFinder divide and unite:
There are two buttons in the Pathfinder Palette that I use the most, Divide and Unite. From the old days of spot color separations, I have been trained to keep my artwork as clean as possible. This is also important if you want to animate vector artwork and make sure it does not blow up when you bring it over to Flash. Uniting shapes that have the same color helps to keep your artwork organized and clean.
Pathfinder is a huge timesaver while illustrating. The less lines you have to put down saves time. Especially if those extra lines are tracing existing lines. I will give an illustration tutorial and go over this technique in greater detail. But here is a simple tip for now. If you have a single shape that you want to fill with two different colors, do not draw another shape, copy the original and divide it.
In the example below:
A. shows a shape, with it selected, copy & paste in front. Draw a path, select the top copy and the new path & divide. Delete the top half.
B. shows the original shape with a 6 point stroke. Select the original shape, copy & paste behind. Add the 6 point stroke, expand and unite. *for best results, change the gradient to a solid color before expanding.
C. Shows the final button. The benefits of this technique are: 1. I can modify the the bottom shadow shape, like adding an arch or wave without having to match it with a top shape. 2. We preserve the original shape for easier editing later. 3. very clean artwork.
5. Align & Average:
If you ever spend more then a second wondering if something is centered, you are wasting time. Open that align palette and force those objects to be centered, justified or spaced out evenly. Nothing looks worse then artwork that is so close to being aligned, but just a tad off. Align only works on items that are ungrouped or multiple groups.
Average is like align, but only works on path nodes. Sometimes while illustrating a line, it takes a second or two to get a line perfectly straight. Just select the two nodes and use the Average dialog ( Command + Option + J mac) (Ctrl + Alt + J PC) and choose horizontal or vertical. and they will straighten right up.
6. Selection preferences. Arrows and Type:
By default the preference (Selection & Anchor Display) for “Object Selection By Path Only” is not checked, meaning you can select an object by clicking anywhere on the object face. You can select items underneath by toggling preview to wireframe (Command + Y or Ctrl + Y). By enabling this feature, you will be able to select shapes without toggling Preview, hiding or locking other objects, which will make you more efficient. It may take some getting used to if you have been using the default setting all along. Likewise, there is a preference for “Type Object Selection By Path Only”, which is disabled by default. Enabling it will allow you to select paths behind or around text.
7. Colors and swatches:
I would like to do a whole post on color swatches and illustration soon, but until then, color swatches can be your friend. I do not mean the ones that are in the swatches palette when you open a new document. If you read the earlier tip, we should be rid of them by now. Making a custom color palette based on mood, branding or whatever you want to communicate is scores better than making up colors on the fly or picking colors because they just happen to be in the color palette. Most computers can display 16 million colors telling us there are a many more Hughes of green then the lime and forest green in the default color palette. Saving colors to swatches saves us from trying to make the same color over and over. Saving colors as spot color is cool for certain printing jobs and if you ever want to update a color, you can do it one time and every object filled or stoked with that color will be updated as well. The down side is spot colors make horrible gradients. I normally stick with RGB swatches and use Select Same Fill or Stroke Color to update colors if that arrises. Also, if you have an illustrator file with a a bunch of swatches and you need them in a new illustrator document. You can use Window/Swatch Libraries/Other library and a new swatch pallet will appear with the needed swatches from the Previous Illustrator file.
8. Actions (same in Photoshop):
Actions are the coolest thing since Command + Z (Ctrl + Z PC). There are certain combinations of tasks that I perform at least 50 times or more in a single illustration. I make actions of those combos and assign an F key to it. This saves tons of time. My most use actions are probably Expand + Unite, which merges the stoke and fill into one shape. The other is Place just because there is not a default keyboard shortcut for that menu item. I also use actions for special transforms that I will have to do more then once or we can build template files with actions so that anyone with illustrator or Photoshop can recreate the transforms to match the original. ** The most important thing to know about actions is saving them. I keep apps open for weeks at a time. Any crash during that time will erase any actions you have created.
9. Just say no to strokes:
One of the most time consuming things about Flash development is fixing artwork imported from illustrator. With CS3 that chore has been greatly reduced, but there are still a few things that still do not translate the same. Strokes are a large contributer to some vector artwork in flash looking terrible. If you try to Convert Stokes to Fills in Flash, many times most of the stroke will just disappear. It is best to do all that in Illustrator using the previous tip, as well as some good planning to keep your artwork clean. There are some good reasons to use strokes in Flash, otherwise getting rid of them in Illustrator will make life much easier and your graphics looking better.
10. Grouping:
One of the reasons Illustrator is so much more efficient then photoshop for comping up rough layouts is that you do not need to know what layer the artwork is on to move or transform it. You just select the artwork directly and transform away. Using groups wisely will diminish the amount of time it takes to make selections. Once an section of an illustration is complete, you should make it into a group. The next time you need to transform that group, it is only one click away. Using the Command + Option + Tab (Ctrl + Alt + Tab PC) to toggle the open and closed arrow selections tools will make the different types of selections happen a lot quicker. Also Command + Option + Double-Click (Ctrl + Alt + Double-Click PC) with the open arrow selection tool will select a sub-ground within a group. Another click will add the whole group to the selection.
Related Posts:
|
No Comments »
No comments yet.
RSS feed for comments on this post. TrackBack URL
Leave a comment
