Creating a Wildlife logo jma501rev 03/24/2014



Creating a Wildlife logo jma501rev 03/24/2014If you observe logos you will often see that they are round with text around their borders and symbols and shapes in the center. We saw examples in a previous lecture We will have four ellipses: One for the overall outside logo (light green above), a second for text on a path at the top (The American…), a third for text on the bottom, (Pittsburgh …) and a fourth to hold clip art (symbols) and a fill color.Getting StartedStart a new document. The default values are fine. Name the document Wildlife.Open the Layers panel and re-name the single layer BackgroundDeselect the Background layerIf you don’t do this, when you do the next step, you’ll end up with a sub-layer of Background rather than a new layer Use the Create New Layer tool to create an empty layer named Logo Elements: Drag on top of Background Lock Logo Elements: and select the Background layerAnd Creating the Main Ellipse ShapeWe’re going to create a main ellipse and then copy and paste it on top of the original ellipse: That will give us two identical ellipses. We will reduce the size of the copied ellipse. We will use the resulting smaller ellipse for “Text on a Path”Select the Ellipse Tool (be sure you selected the Background Layer )Width: 6.19”Height: 6.26”Fill: blackStroke: noneClick OKMove it so it’s completely on the artboardSelect your ellipse then Edit>Copy and Edit>Paste in front Slide the new ellipse off center:Note we now have two ellipses (<Path>s ) inside the Background layer: These ellipses are called sub-layersName the new ellipse (the top one) Text PathName the other sub-Layer (the original ellipse) Outer EllipseIf you can’t tell which ellipse is which, click the blue dot in the Layers panel: The selected object will be obvious:Move the Text Path layer above the Outer Ellipse: (mine was already)Adding Type on a pathThe Text Path ellipse will be used as a path for some text to follow. Specifically, this text: The American Society for Wildlife AdvancementWe will use Transform panel to make the Text Path ellipse a bit smaller than the original one, because it has to fit inside the outer ellipseUsing the Transform panel to resize objectsSelect the Text path sub-layerClick the blue dot to select the actual artwork in the Text Path sub-layer.Open the Transform panel Use 5.3” x 5.3” as the new width and height:Press Tab keyWith that re-sized ellipse selected, choose Type on a Path tool. Click near the middle anchor point on the left of the ellipse and it will look like the ellipse disappeared. Type on a Path removes fills and strokes. Your document should look like this Hide the Outer Ellipse sub layer to make it easier to work on the Text Path ellipseType “The American Society for Wildlife Advancement” Changing the FontNow we need to change the font. To do so: Select the text :Use the Selection tool (black arrow) and triple click the text to select itOpen the Character panel: Click Character in Control Area or Window>Type>CharacterBecause we will use the logo on a Web site, choose a sans serif font: Trebuchet, 24 points:Select the path (ellipse)Use the handle (bracket) to center the text :If you don’t see the handle, re-select the ellipse with the Selection tool AndWith the text selected, double-click the Fill tool (to color text) and enter #CC2957 as the color value, a light redHere is the Color Picker where you enter the hex value:Click OKResult:Show (unhide) the Outer EllipseDrag the smaller text-ellipse on top of the main ellipse:It is good practice to periodically save your work. As we have done in other modules, we can save the document with a different name so we can revert back to a previous state.So far: Two ellipsesSave as WildlifeV1.ai inside InClass/IllustratorWe want to center- align the two ellipses Select both ellipsesUse the Align tools and center vertically and horizontallyAdding another Text on a path EllipseThis third ellipse will say Pittsburgh PennsylvaniaThe new text is to be at the bottom of the main ellipse (Pittsburgh Pennsylvania) Add another ellipse: 5.3” x 5.3” as shown belowFill color doesn’t matter.No strokeI named it Text Bottom:It’s the same size as the other smaller ellipse and will be used to add the text on the bottom of the ellipseHide The American…” and Outer Ellipse sub-layers, leaving the Text Bottom layer visible:Select Text Bottom sub-layerChoose Type on a path and type Pittsburgh PennsylvaniaFill: Yellow, 24 points, TrebuchetBut, we want the text to be at the bottom of the main ellipse, not the topTry pulling down on the center handle (bracket) on the right…the text is then at the bottom; however, may be upside down. If so, we need to flip (reflect) it If the text is upside down, click the handle and push it in towards the inside of the ellipse, called reflecting), Zoom in to get close up view Show all the sub-layersDrag the new ellipse on top of the othersSelect all and use Align panel or the Control area to center vertically and horizontally:Save as WildlifeV2.aiAdding the logo elementsUnlock the Logo Elements layer and lock the Background layer:Logo Elements layer is where we add another ellipse plus some symbolsWe need a fourth ellipse; this one we will feather, fill with a blue color and add symbols such as: rocks, trees, clouds and so on. This ellipse is to fit insde the other ellipses, so will be smaller than the others.Create a new ellipse: 5.0” by 5.0”Make it a light blue …the CMYK values are belowI used:C: 51.6% M:0%Y:10.98 %K:0%Softening Edges of a ShapeTo soften the edges of the new ellipse:Choose Effects>Stylize>FeatherMake it be 1”Check the Preview boxPosition it inside the other ellipsesAs usual, use the Align panel to center everything (You will probably need to unlock the Background Layer)Now we have four ellipses: Outer container, 2 type-on- a -path and an inner, blue” oneYou might lock the blue ellipse <Path> and Background so you don’t move them accidentally,Unlock logo elements, if necessary, because that’s where we’ll add the symbolsAdding SymbolsLet’s add some nature-related symbols. Select the logo elements layerSelecting a Symbol Library…you should recall how to do thisOpen the Symbol panelClick its panel menuChoose Open Symbol Library>NatureIf you drag the mouse over a symbol, the tool tip provides a brief description of that symbol.Drag a tree or two: and some rocks, grass, bugs, clouds, treesPractice: Scale, change stacking order to move objects around. My current layer stack:Save as WildlifeV3Add a few more symbols, make sure clouds are on top of stacking order:Changing the Stacking OrderNotice anything unusual? It would make more sense if the clouds were behind everything. To do so, drag the cloud elements down in the list you see. That way, clouds will be below the other objectsSave as wildlifev4.aiUsing Related ColorsIn a previous module, we discussed Kuler harmonious colors. Let’s use the concept of using related colors and modify our logo to use nature-related colors. Instead of Kuler, we’ll use some Illustrator harmonious colors. First, we need to open the Swatch panel.There are many ways to show colors of a particular genre. Here is one such method. Open Swatches PanelOpen its swatches panel menuChoose Open Swatch LibraryFind/show the Nature>Landscape This displays the color swatches shown next Lock the Logo Elements layer, and unlock the Background layer because that is what contains the original objects we will re-color the ellipses and text on a path.We will first change the fill color of the large originally black, ellipse. Select the Outer Ellipse Make sure the Fill tool is selected, not the StrokeClick in the Landscape panel on the color you want. I chose a dark green; the last one in the second rowSelect the inner ellipse, the one that’s feathered-blue and named <path> …Make sure it’s at the top of the Background layer Click on the actual blue ellipse to select it, or the small <path> circle:Select the Fill tool:Choose a lighter green: Choose the color that is third from the rightResult:Note: Layers don’t select OBJECTS; they select layers so they can be moved. To select art, click the tiny circlesNow, change the text colors. Let’s make both text items be the same green color. We want a contrasting color so the text stands out from the background.Select both text layers: Shift-Click on the blue circlesSelect the sub layer for “The American…” And shift-click on the Pittsburgh…layerSee that they are both selected (Click the small circles to actually select the text):Click on Fill tool Change the color to a light green (2nd from the left):Result: Let’s add a black stroke to the main ellipse borderSelect the outer ellipse (Click its small circle again)Select the strokeMake it black, 8 points: Decide to change mind: Change stroke color to be a Landscape light green: Choose 4th from rightSave the logo as WildLifeFinal.aiGrouping and ResizingDrag over everythingOr use Select>All or Ctrl-AObject>GroupShow bounding boxHold down Shift key, which maintains the aspect ratio, and drag the bounding box to resize: (or transform, or scale tools)My elements didn’t get selected: Check to see if Logo Elements is locked; If so, unlock OOPs…the stroke didn’t resizeScaling a StrokeYou can force the stroke to scale if you open the menu options menu on the Transform panel, and check Scale Strokes & Effects, as shown nextIf you didn’t scale the stroke, then manually, reset stroke to 2 pointsSave as WildlifeFinal.aiSaving for the WebNow, we want to save the logo for a Web site. We don’t want entire page, just the object. Recall, If you Save for Web, the entire page will be selected.We need to crop the artboard...have shown before… skipCropChoose the Artboard tool Resize the artboardChoose File>Save for WebChoose gif or png-8, and make white the transparent colorOne final reminder: When saved for Web, the vector object becomes a bitmap (usually a gif), which you shouldn’t modify thereafterQuestions? ................
................

In order to avoid copyright disputes, this page is only a partial summary.

Google Online Preview   Download