New Project: Low-Poly Self-Portraits

Today we will begin our new project – Low-poly self-portraits in Adobe Illustrator

Here are some examples created by SOTA students:

Image Credit: Zion

Image Credit: Zavion

Here are some other examples:

Project Requirements:

• 11×14″ (portrait) or 14×11″ (landscape)
• created in Adobe Illustrator with the pen tool
• Uses a reference photo of yourself, someone you know, or a famous person of your choice. No copyrighted characters or working from cartoon references.
• Shows high-quality craftsmanship and technical skill with the pen tool
• Piece displays unity both in the style of line/shape and color scheme
• Daily progress posted to class blog. Computers malfunction, and it is your responsibility to back up your work to a USB Drive or your Google Drive.

Part 1: Make sure your image is the correct size in Photoshop

1. Open the file in Photoshop
2. Select the crop tool from the toolbar on the left side of the screen 
3. At the top of the screen, set the dimensions to 11×14 inches
   
4. Drag the crop tool to select the area you would like to crop
5. Press the “enter” key to crop your photo
6. Save your reference photo

Part 1: Set Up your File in Illustrator

1. Create a new file in Illustrator (File -> New Print Document)
2. Set the dimensions to 11×14 inches
3. Place your reference photo in the Document (File -> Place)
4. Scale the reference photo so it fits within the edges of the document
5. Lock your reference layer
6. Save your file as a PDF

Part 2: Create a triangular mesh

1. Create a new layer
2. In the bottom left corner, set your fill options to “outline only,” and change the outline color to something bright that will contrast with your skin tone.
   
3. Select the pen tool.
4. Use the pen tool to draw triangles over the entire portrait. Each triangle should represent a shift in value.
   

Part 3: Fill in the triangular mesh

1. Use the black arrow  to select a triangle.
   
2. Use the eyedropper tool  to select a color in the middle of the triangle. This will change the fill color.
   
3. Continue until you have filled in all of the triangles.
   

Part 4: Align points to fill in gaps

1. Open the alignment palette. (Window -> Alignment)
   
2. Select the white arrow.  Hold down shift and select the points you wish to align. Points that are not selected should remain white, and points that are selected should change to a color.
3. Click vertical in the alignment palette.
   
4. Click horizontal align in the alignment palette.
   
5. Continue until you have filled in all the gaps between triangles.
   

Save your file as a PDF and upload your progress to your blog.

Today we will:

• Introduce the low-poly portrait project
• Select and crop our reference photos in Photoshop to the correct dimensions
• Begin creating our projects in Illustrator
• Upload our reference photo and PDF project file to our Google Drive accounts
• Publish a new blog post with a PDF of our progress

End of Marking Period

This is the last week of the marking period. We will finish and submit all incomplete assignments. Please submit the major 100 point projects first, and then complete and submit the 10 point tutorials to further raise your grade. If you have completed all assignments for the marking period and would like to raise your grade, you may choose to do one of the extra credit assignments outlined in this blog post.

Incomplete T-Shirt Designs (100 pts):

Click here for instructions on how to trace over your sketch in Adobe Illustrator.

Then click here for instructions on how to make your design look like it is on an actual t-shirt. (You will use both Photoshop and Illustrator for this step.)

• Caeline
• Aneasha
• Carla
• Armani
• Nylin
• Aquan
• Rickie
• Josalyn
• Javier
• Kyla
• Shani
• Raul

Incomplete Graffiti Walls (100 pts):

Click here for instructions on how to make your artwork appear to be spray painted on a wall.

• Aneasha
• Carla
• Josalyn
• Raul

Incomplete Compound Path Tutorials (10 pts):

Click here for the compound path tutorial.

• Carla
• Joel
• Aquan
• Max
• Charley
• Josalyn
• Javier
• Shani
• Raul

Incomplete Vector Practice Tutorials (10 pts):

Click here for the vector practice tutorial.

• Carla
• Aquan
• Max

Incomplete Cat in Box Tutorial (10 pts):

Click here for the Cat in Box Tutorial.

• Aneasha
• Aquan
• Max
• Josalyn
• Raul

Optional Extra Credit Assignment (choose one of the following and post the completed assignment to your blog):

• Option 1: Create a design for the back of your t-shirt. Follow all the requirements for the original t-shirt design project.
• Option 2: Pretend your t-shirt is part of a clothing line. Create a second design that will also be a part of this line. Follow all the requirements for the original t-shirt design project.
• Option 3: Write a letter to the store, website, or clothing brand of your choice convincing them to sell your t-shirt. Your letter should be a minimum of 200 words, use appropriate grammar, and answer the following questions:
  • Introduce yourself as an artist, and explain how will the store, website, or clothing brand benefit by working with you.
  • Why should the store, website, or clothing brand sell your design?
  • What items are you willing to license your design for? (ex. t-shirts, hoodies, tote bags, phone cases, etc)
  • How much should the store, website, or clothing brand charge for each product? Why do you feel this is a fair price for the product?
  • What percentage of the sale should you get? What percentage should the store, website, or clothing brand get?
  • How will you advertise your product?

Vote on the Next Project

I would like your input in deciding the next project. The two options are Low Poly Portraits in Illustrator, or Interior Spaces in Photoshop. To vote, log into your school Gmail account, fill out, and submit the “Next Project” form I have shared with you. Voting ends at the end of today’s class.

Examples of Low Poly Portraits

Examples of Interior Spaces

This week we will:

• Complete and post any missing assignments to our blogs
• Vote on the next project
• Complete and post the optional extra credit assignment to our blog, only if we have already submitted all required projects to the blog

Previewing what our designs will look like on an actual t-shirt

Today we will preview what our designs will look like on a t-shirt.

Here are some print-resolution t-shirt images to start with. You must use one of these images, both because our actual t-shirt color options are limited to black or white, and because they are large enough that they will print at a high resolution.

Follow these steps to get your design on a t-shirt:

1. Open your t-shirt design in Adobe Illustrator.
2. Delete the layer with your original sketch.
   (Click on the layer with the sketch, then press the trash icon  at the bottom of the layers palette.)
3. Unlock all remaining layers.
   (Click on any lock icons  in the layers palette. When the lock icon disappears, it means you have unlocked the layer.)
4. Select the black arrow tool from the top of the toolbar.
5. Click and drag the arrow across the entire design area. This should select all the pieces of your design.
6. Copy your design by pressing control + c.
7. Download the t-shirt image of your choice from this post.
   (Click on the image to view it full size, then right click -> save image as and save it to your student number.)
8. Open Adobe Photoshop.
9. Open the t-shirt file you have downloaded from this post.
10. Paste your design onto the t-shirt be pressing control + v. Several options will pop up. Select “paste as SmartObject.”
11. Scale your design to the correct size by holding down shift AND scaling from the corner.
    (If you don’t do both of these things together, you may distort your design.)
    
12. When you are happy with your design, press the “enter” key.
    Here is an example of what a design might look like on a t-shirt:
    
13. Save your design as both a photoshop file and a jpg.
14. Upload the following two files to your blog:
    1. a PDF of your final t-shirt design (this is what we will print on the t-shirt)
    2. a jpg of your design on a t-shirt

Today we will:

1. create a mock up of what our designs might actually look like on a t-shirt in Adobe Photoshop
2. finish vectorizing our t-shirt designs in Adobe Illustrator
3. create one blog post with
   1. a PDF of your final t-shirt design (this is what we will print on the t-shirt)
   2. a jpg of your design on a t-shirt

Creating our Vector T-shirt designs in Illustrator

Today’s essential question: How can I use Adobe Illustrator to turn my t-shirt design sketch into a vector graphic?

Today we will begin tracing over our t-shirt design sketches in Adobe Illustrator.
We will view a demo at the Smart Board and then follow these steps:

1. Open Adobe Illustrator.
2. Select “New Print Document” from the pop up screen.
3. Create a new file in Adobe Illustrator with the following guidelines:
   
4. Place the photo you took last class the file you just created. (File -> place)
   DO NOT try to open your downloaded image in Illustrator! This will cause strange things to happen.
5. Create a new layer by clicking on the “new layer” button at the bottom of the layers palette on the right side of the screen.
6. Select the pen tool.
   Trace over your first shape. (You may need to decrease the opacity of this layer so you can see what you are tracing. You can do this by clicking on the transparency icon on the right side of the screen and decreasing the opacity so it is below 100. )
7. Bring the opacity back 100% and adjust the color if necessary.
8. Repeat steps 3 and 4 until you are happy with your vector illustration.
9. Save your Illustrator file, and then save a version as a .pdf
10. Create a new blog post with the PDF of your progress. I do not expect you to finish your design, but I do expect you to post what you worked on today.

Today we will:

• begin tracing over our t-shirt design sketches in Adobe Illustrator
• create a new blog post with a PDF of our progress so far

Sketching Our T-Shirt Designs

Today’s essential question: What will my ideal t-shirt design look like?

Today we will sketch our t-shirt design on a piece of paper. We will then use Sharpies to color our design with solid areas of color. You can use as many colors as you think your design needs, but you cannot shade or blend any colors. You will then post a photo of your colored sketch to your class blog. You must post a photo of your sketch to receive participation points for today, even if you have not finished your design. Next class, we will begin vectorizing our design in Adobe Illustrator.

T-Shirt Design Project Requirements:

• Your original concept. No copyrighted characters.
• Balance of positive and negative space
  
  

  
• Variety of line weight
  
• Sketch colored in Sharpie (solid color with no shading), then vectorized in Illustrator
• Design does not run off edges of paper
• No copyrighted characters

Here are some Vector t-shirt designs created by students in past years:

Chanet, 10th Grade

Mckenzie, 10th Grade

Ler Tha, 10th Grade

Alyssa, 10th Grade

Alyssa, 10th Grade

Giacomo, 11th Grade

Lauryl, 12th Grade

Lauryl, 12th Grade

Liam, 12th Grade

Jason, Grade 9

Lily, Grade 9

Taylor, Grade 9

 

Today we will:

• Sketch our t-shirt design on a piece of paper
• Color in our t-shirt design with Sharpie
• Tape our t-shirt design to a wall, and take a photo of the design
• Post the photo of our t-shirt design to our class blog

 

Advanced Illustrator: Compound Paths and Shape Tools

Today’s essential question: How can I make a compound path in Adobe Illustrator? 

Today we will complete a tutorial that will teach us to do the following things in Adobe Illustrator: create a compound path, use the built in shape tools, and create a solid color background. We will post a PDF of the completed tutorial to our blogs. We will then finish any incomplete tutorials and post those to our blog (cat in box, vector shapes practice).

If time allows, you can play the space explorer pen tool game.

What is a Compound Path?

If your design has a strong balance of positive and negative space, there is a chance you will need to put a “hole” in the design so you can see the background. You can do this in Illustrator by creating a compound path.

Why should you create a compound path instead of just drawing a shape that is the same color as your background? Well, sometimes you need the negative space to be transparent (window decals, images in the background, etc).

How to Create a Compound Path in Illustrator

1. Right click to save this image to your desktop. DO NOT OPEN THIS IMAGE IN ILLUSTRATOR.
   
2. Open Adobe Illustrator and create a new file. File -> New. Set up the dimensions as follows:
   
3. Place the image in Illustrator. File -> Place.
4. Double-click the layer to and rename it “reference photo.”
   Click the box next to the eye to lock the layer (a lock icon should appear).
   
5. Click the new layer button.  Double-click on the new layer and name it “positive space.”
   
6. Select the pen tool.
7. In the colors palette at the bottom left of the screen, remove the outline by clicking the outline icon to bring it forward, then clicking the square with the red line through it.
   
8. Double-click on the fill icon (the solid square) to change the fill color to something you like.
9. Use the pen tool to outline the shape. Open the transparency window. (Window -> Transparency)
10. Select the black arrow from the tool bar on the left side of the screen. 
    Then click anywhere on the screen away from the shape you have just traced to deselect it.
    
11. Pick a different fill color.
12. Make a new layer. Name it “negative space”.
13. Select the pen tool and trace over the negative space shapes.
14. Select the black arrow from the tool bar on the left side of the screen.
    Click on one shape at a time and make sure the opacity of each shape it set to 100%.
    
15. Select all of the shapes by holding down on the shift key as you click each one.
    At the top of the screen, Object -> Compound Path -> Make.
16. Your “negative space” shapes should now be completely transparent.
    
17. Your “positive space” layer is now empty.
    Click on it and then click on the trash can icon to delete it.
    
18. Double-click on the “negative space” layer and rename it “rabbit”.
    

How to add a background:

1. Make a new layer above your reference photo layer and below your positive space layer.
   Name it “background.”
   
2. Click the rectangle tool in the tool bar on the left side of the screen.
   
3. Change the fill color to be your desired background color.
4. Click and drag to draw a box that covers the entire background area.
   
5. Save your file as a PDF (File -> Save as -> Select “Adobe PDF” as the file format)
   
6. Create a new blog post and upload the PDF.

Pen Tool Space Explorer Game

If you are all caught up, feel free to further practice the pen tool by playing the Space Explorer game.

Today we will:

• complete the compound path/adding a background tutorial, save our file as a PDF, and post the PDF to our blog
• complete and post any missing tutorials to our blog (cat in box, vector shapes practice)
• begin sketching our t-shirt designs

New Project: Vector T-shirt Design

Today’s essential question: How can I use the pen tool to create vector imagery in Adobe Illustrator?

Remember how scaling a raster image larger will pixelate the image (as in the example below)?

Today we will learn about a different type of image called a vector. Vector images can be scaled infinitely and will never get blurry. Logos are usually vector images so they can be printed on everything from buttons to billboards without becoming blurry.

Here are some examples of vector art:

  

  

For our next project, we will create a vector t-shirt design in Adobe Illustrator. You will have the opportunity to purchase a t-shirt with your design. White t-shirts are $10, and black t-shirts are $15. Here are some examples created by students in past years:

Chanet, 10th Grade

Mckenzie, 10th Grade

Ler Tha, 10th Grade

Alyssa, 10th Grade

Alyssa, 10th Grade

Giacomo, 11th Grade

Lauryl, 12th Grade

Lauryl, 12th Grade

Liam, 12th Grade

Jason, Grade 9

Lily, Grade 9

Taylor, Grade 9

T-Shirt Design Project Requirements:

• Your original concept
• Balance of positive and negative space
• Variety of line weight
• Sketch colored in Sharpie (solid color with no shading), then vectorized in Illustrator
• Design does not run off edges of paper
• No copyrighted characters

Today we will learn how to use the pen tool in Adobe Illustrator. This is the tool and software program that we will use in our t-shirt design.

Pen Tool for Beginners: Vector Practice Tutorial

Today we will begin tracing over our t-shirt design sketches in Adobe Illustrator.
We will view a demo at the Smart Board and then follow these steps:

Part 1: Setting Up the File

1. Right-click to save the image below:
   
2. Open Adobe Illustrator.
3. Select “New Print Document” from the pop up screen.
4. Create a new file in Adobe Illustrator with the following guidelines:
   
5. Place the image you just downloaded from this blog post. (File -> place)
   DO NOT try to open your downloaded image in Illustrator! This will cause strange things to happen.

Part 2: Using the Pen Tool to Draw Straight Lines

1. Create a new layer by clicking on the “new layer” button at the bottom of the layers palette on the right side of the screen.
2. Select the pen tool.
3. You can change the color by clicking on the square at the bottom of the toolbar on the left hand side of the screen: 
4. Trace over your first shape (the star). Click once to add the first anchor point. Move your mouse to the next position and click again to create the second point. The two anchor points will be connected together.
5. Continue clicking points around the star IN ORDER until you reach the starting point.
   
   
   (You may need to decrease the opacity of the star you are drawing so you can see what you are tracing. You can do this by clicking on the transparency icon on the right side of the screen and decreasing the opacity so it is below 100. )
   
6. Close the path by clicking on the starting point a second time. Bring the opacity back 100% and adjust the color if necessary.
   

Part 3: Using the Pen Tool to Draw Curves

1. Click to create your first point.
2. Click where you would like your next point to be, but do not let go of the mouse until you have dragged the point to adjust the curve:
   
3. Click on the middle dot. This should make the second half of the tangent line, or handle, disappear:
   
4. Click where you would like your next point to be, but do not let go of the mouse until you have dragged the point to adjust the curve:
   
5. Once again, click on the middle dot. This should make the second half of the tangent line, or handle, disappear:
   
6. Continue adding points around the heart in order. Close the path by clicking on the starting point a second time.
   
7. Follow the same steps to outline the apple.
8. Follow the same steps to outline the dog.

Part 4: Saving your file and posting to the blog

1. Save your file as a .pdf (File -> Save As -> PDF)
2. Create a new blog post with the PDF of your progress.

Finishing our Graffiti Art Pieces

Today’s essential question: How does my graffiti art piece communicate its message?

Today we will use Photoshop to make our oil pastel artwork appear to be on a real wall. If we have time, we can also photograph ourselves in front of a green screen and add ourselves into our artwork. We will then write a 150 word artist statement about our artwork and the message behind it.

Artist Statement

Begin your artist statement by answering the following questions in complete sentences. Then edit them to make them flow as a unified paragraph.

• What is your artwork about?
• How did you make your artwork?
• What challenges did you face? How did you overcome them?
• What do you want people to see, think, or feel when they look at your artwork?
• How does your artwork compare to that of street artists like Banksy and Shawn Dunwoody?
• If given the chance, would you like to paint your artwork on an actual wall? Why or why not?

Today we will:

• Use Photoshop to make our oil pastel artwork appear to be on a real wall
• Photograph ourselves in front of a green screen and add ourselves into our artwork
• Save our completed artwork as both a Photoshop and PNG file
• Upload both our Photoshop and PNG files to our Google Drive accounts and share with Ms. Lawson
• Create a new blog post with the following:
  • a PNG of our final piece (artwork on a wall)
  • a 150 word artist statement about our artwork and the message behind it (use the questions in this blog post as a starting point)