assignment 5text projectpoints:55 - jma.duq. web viewgif and a. dd a. link to your portfolio index...
TRANSCRIPT
Assignment 5Text Project
Points:55
Due:October 16
You are to use Illustrator to create this recipe: It’s purpose is to reinforce Illustrator text
Create a Recipe folder inside Assignments
Create an Images folder inside Recipe:
Once your assignment is finished, save your finished recipe two ways:
1.) As a pdf inside your USB drive’s /Assignments/Recipe /Images folder and
2.) As a gif (To later place on an html page) in that same folder.
You will use Dreamweaver and create a new html page. You will insert the recipe gif and add a link to your Portfolio index page (Home page)
You will also create a link from your portfolio index.htm to the new recipe page
Here is the scoring rubric (the actual instructions show after the scoring portion):
1. 2 columns (10 points)
2. Your name on the path, not mine: 10 points
3. Red text placed and wrapped around the logo: 10 points
4. Green heading (5 points)
5. Fancy border…if you can’t find the one in the instructions, choose another border (5 points)
6. Add Your name in the lower right corner: (5 points)
Recall you are to have a link from your Portfolio index.htm page that says Recipe. When clicked, the recipe page displays. and a link from recipe.htm to your portfolio index page
Instructions follow below…
Objectives: This exercise incorporates:
Opening an existing .ai file
Working with layers
Using the scissors tool
Adding text on a path
Reflecting text
Using text on a path properties
Placing a Word document
Creating a document with two columns of text
Wrapping text around an object
Using the Transform tool
Instructions
Download the zip file (Recipe Assets) from the web site, and unzip to your Assignments/Recipe/Images folder. There are two files: an Illustrator file (Recipe.ai) and a Word document:recipe.doc
Start Illustrator
File>Open and browse to recipe.ai
Choose Window>Workspace>Essentials
Choose View>Fit Artboard in Window
Choose Window>Layers
o Notice there are three layers:
Two are locked, and all three are visible. Experiment with the visibility (eyeballs)
Zoom In to the logo on the artboard
Set the Fill to none.
Select the type on path layer because you’re going to do just that!
To view the layer’s content, toggle the visibility off/on that’s the layer where you’ll add the actual content
Select the ellipse tool and click on the artboard, then specify:
o 2.3” wide
o 1.7” tall
o No fill
o Default stroke
o Use the Selection tool and move the ellipse so it fits over the logo: The box you see (If you’ve set it to display in the View menu) is the bounding box
We’re going to use the scissors tool to cut the ellipse into two halves
o Select the ellipse
o Select the scissors tool…under the eraser tool:
Click the anchor point at the middle-left edge of the ellipse
This should cut the left side of the ellipse .…see the middle anchor point on the left side in the picture above) It helps if Smart Guides
are on, then look for the word anchor as you move the scissors around
With the scissors tool still selected, repeat on the right side (Click the middle anchor point)
You should see this:
And then, if you move the cursor a bit,:
The path on the top half of the ellipse should turn a dark color:
We’re going to add text on the black path
In the Character palette, (Window>Type>Character) choose Arial, Bold, 24pt
Select the Type on a Path tool
Click on the top half (path) of the ellipse
Type Your FirstName’s in uppercase ( I used JOHN’s)
Click the Selection tool. You should see three vertical brackets; they are used to position the text
Next, adjust the position of the text:
o Use the left-most vertical bracket (a line) and slide the text to the right, so it’s centered:
Next, change the Type on a path properties
o Choose: Type>Type on a path>type on a path options
Choose these values:
Effect: Rainbow
Align to path: Center
Spacing: 0
Click the Preview box
You just lowered the baseline (We defined baseline in a previous lecture)
Click OK
Now, for the bottom part of the ellipse
Choose the type on a path tool again
Click on the lower half of the ellipse
Type: KITCHEN
It’s a mess now!
First, move the text as you did your name USE THE BRACKETS…select the text (Black arrow), then slide using the right most bracket:
Reflect the text (click and drag inwards using the center bracket)
You should see:
Move the text around using the brackets to move.
Apply the Rainbow effect, as you did earlier, and center the KITCHEN text
Save as myrecipe1.ai inside Assignments/Recipe/Images
Choose View>Actual Size
In the Layers palette, lock the type on path layer so it can’t be moved
Unlock the logo layer so we can draw on it.
Choose View>Show>Bounding Box
We want to eventually wrap some text (which we’ll place) around the logo. To do this, the text and the graphic must be on the same layer (logo, for us)
Select the logo layer
Select the type tool
Click and drag a Text box in the center of the document…don’t worry about the size, we’ll use the Transform tool to modify the size and location.
Choose Window>Transform
Select the center reference square
Enter these values:
Press Tab key after each value you enter
Be sure the text box is selected, that way when we import (place) the text, that’s where it will go
Choose File>Place and import the .doc file you unzipped earlier
Turn off all the options and Ignore the “missing font” error, if it comes up
Here is what you should see:
Next, let’s divide the text into two columns:
Select the text box
Choose Type>Area Type Options, enter 2 for the number of columns
Select your text box and try to center it on the page:
Next, we want to wrap the text around the logo:
The text and the object (logo for us) must be on the same layer…they are
Expand the logo layer:
The layer we added is now named To achieve…blah blah OR it might show up as “…”, as did mine below
Remember Stacking order?
The text box we just added (and placed the text into) has to be on a (sub) layer, below the logo (the graphic object we want to wrap around)
o Select the layer (To achieve…) in the above palette
o Drag it to the logo layer bottom:
See the result?
The text is behind the logo
Save as recipe2.ai
Select the Compound Shape layer. . . see above (it’s the green portion of the logo…play with visibility to see this)
Show the Bounding box. Select the Logo…You should see:
Now, let’s wrap (no singing!!)
Choose Object>Text Wrap>Make
Click OK (We wrapped text around the selected object)
Save as myrecipe3.ai
Format the text
Select the text box (Selection tool)
Use Type tool and click inside the text box
Choose Select>All (Or Ctrl-A)
Choose these text properties:
Tab key to apply
Let’s work with individual paragraphs next
Select the Type tool and select just the first sentence
Use these settings:
Choose the Fill tool and set the color to a Crimson Red:
The Result:
Choose Window>Type>Paragraph
Select the first sentence
Make sure the paragraph is aligned left: mine was
Try Centered, then back to Left alignment
Select the Type tool, double-click inside the text box and select the ingredients text: …10.5 package of silken tofu…to…soy milk or water, as necessary:…
Change text to Arial, Regular, 12, Kerning: Auto; leading: 16, tracking 0…Tab key to finish
Add a heading:
Select>Deselect
Insert I beam (Text tool) above the text box, after logo and type:” Green Goddess Dressing” (Note: I added the text in the middle of the text box, then moved it to the desired location)
Set its text to Arial , Bold, 22 point, tracking 200, leading auto
Select the recipe name and choose a green
Add a border
Collapse the logo layer and lock it
Unlock the Border layer
Select anywhere in the white area (i.e. in the background for the text box)
Select the Border layer
Select text box by clicking on it with the Selection tool
Choose Window>Brush Libraries>Borders>Borders_Decorative
Select the border of your choice (Use the arrows to jump to the next/previous)
I chose starburst
Adjust the placement of the border so it better fits the white box ( I had to slide the border up a bit)
Choose Select>Deselect to unselect everything
Inside the text box, in the lower right corner, type your complete name and use all caps (you might need to unlock its layer)
Save as Assignments/RecipieReciipeFinal.ai
Save again as recipe.pdf inside Assignments/Recipe on your USB drive
Save for web as recipe.gif
Start Dreamweaver (choose your site)
Create a new page named recipe.htm
Insert>Image and browse to your recipe.gif
Add a HOME link on your recipe.htm page
Add a “Recipe” link on your index.htm page (links to recipe.htm)
Submit via Blackboard