Who is Banksy?

Today’s bellwork: If you were trying to become a famous artist, would you keep your true identity visible or would you hide it? Explain your answer.

Today we will begin working on our t-shirt design projects. You will have the opportunity to purchase an actual t-shirt with your design. In order to make the t-shirts as affordable as possible, we will create a one-color design. We will examine the work of graffiti artist Banksy to receive inspiration on how to create simple yet visually interesting designs.

Video – Who is Banksy?

Some of Banksy’s artwork

banksy_clipstone_crop

street_art_or_more_specifically_banksy_desktop_1280x800_hd-wallpaper-1091976

16-girl-searching-soldier

banksy-maid-canvas

banksy_change

graffiti-banksy-street-art-hd-wallpaper

banksy_street_art_desktop_1920x1200_hd-wallpaper-1091975

Tshirt design guidelines (how you will be graded):

  • 1 color
  • show balance of positive & negative space
  • show an interesting variation in line weight
  • Beautiful design drawn by Darla,  but all the lines are the same thickness
    Beautiful design drawn by Darla, but all the lines are the same thickness
  • Lauryl did a great job including a variety of line thicknesses in her design
    Lauryl did a great job including a variety of line thicknesses in her design
  • submit two files
    • the design on its own (what you would submit to a t-shirt printing company)

      T-shirt design by Betty

      T-shirt design by Betty

    • the design Photoshopped onto a t-shirt

      T-shirt design by Betty

      t-shirt design by Betty

If you would like your design printed on a t-shirt, give Ms. Lawson $10 for a white t-shirt or $16 for a colored t-shirt by Thursday, December 18th (our last class before break).

Today we will:

  • watch a video about the graffiti artist Banksy
  • look at examples of Banksy’s artwork
  • write a 150 word blog post that answers the following question: Do you think Banksy is an artist or criminal? How does Banksy’s artistic style and celebrity status influence your idea for your t-shirt design?
  • create 4 thumbnail sketches of potential t-shirt designs and mark the design you will turn into a t-shirt (You will place your sketches in your purple folder for Ms. Lawson to photograph between classes. You will need this digital photograph of your image to trace over it in Illustrator next class.)

More Vector Practice

Today’s essential question: How has using the pen tool affected your potential t-shirt design? (We will make our t-shirt designs in Adobe Illustrator with the pen tool.)

Today we will continue to improve our skills with the pen tool by tracing over a 2-3 color image. We will once again post our progress to our blogs.

How to create a multicolor vector image:

  1. Download one of the images pictured below (Right-click on the image of your choice -> Save Image As -> Save to your student number)

    jordans

    vector-cat

    vector_cookies

  2. Create a new file in Adobe Illustrator and place the downloaded photo in that file. (File -> place) (DO NOT try to open your downloaded image in Illustrator! This will cause strange things to happen.)
  3. 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. new_layer_button
  4. 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 transparency_icon on the right side of the screen and decreasing the opacity so it is below 100. transparency_window)
  5. Bring the opacity back 100% and adjust the color if necessary.
  6. Repeat steps 3 and 4 until you are happy with your vector illustration.
  7. Save your Illustrator file, and then save a version as a .pdf
  8. Create a new blog post with the following:
    1. your source photo and the .pdf of your vector illustration
    2. a brief paragraph describing your image, any difficulties you had creating the image, and how you worked through them.

Vector Art & The Pen Tool

Today’s essential question: Do you think it is possible to create a computer image that could be enlarged without getting blurry? Why or why not?

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

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:

air-jordan-logo-brand-1000x500   OVO OWL1-B-LOGO-JPG

80s_hard_work_beats_outlines_black   will_run_for_dessert_cream

Today we will practice using the pen tool. After the demonstration, you will:

  1. Download the “vectorpractice.zip” file here.
  2. Move the zipped folder to your desktop.
  3. Double-click the file to unzip it.
  4. Open the unzipped folder.
  5. Drag all the files onto your desktop (they will not work otherwise).
  6. Double click on vectorpractice.ai to open the file in Illustrator.
  7. Relink the images.
  8. Trace over each shape with the pen tool. (They are numbered from the simplest to the most complex.)
  9. Save your file as a PDF. (File -> save as -> PDF)
  10. Create a new blog post with the following:
    1. Answer the following question: “What are some differences between vector and raster art?”
    2. A PDF of the vector images you have traced
    3. A paragraph describing any difficulties you had with the pen tool

The following Media Club members are familiar with the pen tool and may be able to help you if I am busy: Darla, Francheska, Wah, Lily, Javier, Raphael.

If you finish early (or already know how to use the pen tool), practice tracing over an image of your choice.
For example, we can turn a photograph of chocolate chip cookies into a vector illustration:

chocolate_chip_cookies vector_cookies

Students who finish early or already know how to use the pen tool will:

  1. Download a photograph.
  2. Create a new file in Adobe Illustrator and place the downloaded photo in that file. (File -> place) (DO NOT try to open your downloaded image in Illustrator! This will cause strange things to happen.)
  3. 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. new_layer_button
  4. Trace over your first shape. (You may need to decrease the opacity of this layer so you can see what you are tracing.)
  5. Bring the opacity back 100% and adjust the color if necessary.
  6. Repeat steps 3 and 4 until you are happy with your vector illustration.
  7. Save your Illustrator file, and then save a version as a .pdf
  8. Create a new blog post with the following:
    1. your source photo and the .pdf of your vector illustration
    2. a brief paragraph describing your image, any difficulties you had creating the image, and how you worked through them.

In Process Peer Critique

Today’s essential question: What parts of your project are you not sure about, or would like feedback or an opinion on?

2011-06-03-doctor-cat-art-critic

Today we will:

  • meet in assigned groups and critique our projects according to the questions in this blog post
  • create a blog post with the feedback from our group mates (your post should contain the answers the other group members gave you regarding your project)
  • make any changes to your project suggested by the peer critique (you may want to utilize the blog post as a to do list)
  • create a second blog post with your final project

Questions to be answered during the peer critique (this is the same criteria I will use to grade your projects):

  • Unity
    How well do the different parts of your design go together?
    What is working well?
    What can be improved?
  • Contrast
    How well do the inside of the silhouette and the background around the silhouette contrast?
    How can it be improved?
  • Composition
    Is there a clear focal point?
    If objects overlap, do they overlap in a way that makes sense?
    Do the proportions of various images make sense in relation to one another
  • Craftsmanship
    How well have you erased the backgrounds from the various images?
    Is everything proportionally scaled, or have images become pixelated and/or distorted?

Groups

  1. Taylor, Javaughn, Deziree
  2. Kiera, Amari, Brianna
  3. Francheska, Lashawn, D’Asia
  4. Wah, Celi, Morris
  5. Darla, Jenna, Angel, Desean
  6. Dahmeaz, Gennalis, Raph
  7. Jason, Lily, Javier, Keysean

Using a mask to fill in our background with an image

Today’s essential question: What are some things you need to do in order to feel comfortable showing your project to your classmates?

Today we will use the mask tool to fill in our background with an image.

Today we will:

  • learn how to use the mask tool to fill in our background with an image
  • continue working on our projects
  • save our projects as both as .psd and .png, and create a new blog post with the PNG of our progress

Next class, we will critique our near-finished projects with a partner, and then spend the rest of the class period finishing our projects and making the changes suggested by the peer critique.

How to Use the Mask Tool

  1. Open your project Photoshop file (the one that ends with .psd, NOT .png).
  2. Open whatever image you would like to fill the negative space portion of your project.
  3. Drag whatever image you would like to fill the negative space portion of your project into the project Photoshop file.
    Screen Shot 2014-11-17 at 6.28.51 AM
  4. If it is the wrong orientation (such as my example where it is landscape instead of portrait), rotate the image.
    Edit -> Transform -> Rotate 90 CW (or CCW – your choice)
    Screen Shot 2014-11-17 at 6.29.01 AM
  5. Scale it so it fills the screen (Edit -> Free Transform). Remember to hold down the shift key and scale from the corner so you do not distort the proportions of the image. Also, do not make an image much larger – it will pixelate and look blurry when printed.
    Screen Shot 2014-11-17 at 6.41.29 AM
  6. In the layers palette on the bottom right side of the screen, click on the eye next to this layer to make it temporarily invisible.
    Screen Shot 2014-11-17 at 6.29.59 AM
  7. Click on the layer titled “negative space.” It should turn blue to show it has been selected.
    Screen Shot 2014-11-17 at 6.30.08 AM
  8. Your project should now look like this (you may have images inside your silhouette):
    Screen Shot 2014-11-17 at 6.30.46 AM
  9. Select the magic wand tool form the toolbar on the left side of the screen. magic_Wand
  10. Click on any part of the negative space layer that has been painted. It should now be outlined with dotted lines.
    selection_close_up
  11. In the layers palette on the bottom right side of the screen, click on the eye next to this layer to make it invisible.
    Screen Shot 2014-11-17 at 6.31.28 AM

    Your project should now look like this:
    Screen Shot 2014-11-17 at 6.33.00 AM

  12. Now click on the eye space next to the layer that contains the image you want to fill in your background. This will make the layer visible.
    Screen Shot 2014-11-17 at 6.33.13 AM
  13. Click on the layer itself to select it. It should turn blue.
    Screen Shot 2014-11-17 at 6.33.25 AM
  14. Click on the mask tool at the bottom of the layers palette. mask_tool
  15. This should hide everything but the background area:
    Screen Shot 2014-11-17 at 6.34.02 AM

Combining Multiple Images into One Photoshop File

Today we will:

  • complete the kitten dress up tutorial
  • begin dragging the images we downloaded that represent us into our silhouette file
  • create a new blog post with the following:
    • completed kitten dress up tutorial
    • PNG of our silhouette progress

Kitten Dress Up Tutorial (teaches us how to combine multiple images into one Photoshop file, and how to use the transform tool to scale and rotate objects)

Completed kitten dress up tutorial

  • Click here to view the step-by-step-instructions for the kitten dress up Photoshop tutorial. (If you do not have this file open and cannot tell me what step you need help with, I will not help you.)
  • Click here to download the kitten dress up Photoshop file.
  • Once you finish this tutorial, create a new blog post with a PNG of your fancy dressed up kitten.

Adding Images into your Silhouette

  1. Open your silhouette PHOTOSHOP file (the one that ends in .psd). Your layers palette should look like this:
    dragging_images_layers_screen_shot
    (If you only have one layer named background, you have mistakenly opened the PNG file. If that is the case, close  that file and open the .psd file.)
  2. Now open the first image you would like to drag into your silhouette in Photoshop. Go to the toolbar on the left side of the screen and select the move tool. move_tool
  3. Now click on the image and “throw” it into your silhouette Photoshop file. Your layers palette should now look like this:
    Screen Shot 2014-11-06 at 8.23.07 PM
  4. The image you just dragged should be below the negative space layer and on top of your silhouette layer. Eventually, it will look like the silhouette is filled with a collage of images:
    small_escher_profile_screen_Shot
  5. Scale or rotate the image by going to the top of the screen and selecting “Edit -> free transform. Do not make the image larger, or it will pixelate like the example below:
    pixelated_escher_Screen_shot
  6. Repeat steps until you have placed all your desired images into the silhouette photoshop file.
  7. Select the eraser tool and erase the background from each image. eraser_tool Make sure you are on the correct layer!
  8. Save your photoshop file (File -> save) and then save a version as a PNG (File -> save as).
  9. Create a new blog post with a png image of your progress. (You will not finish your project today, so I am looking for progress rather than perfection).

Creating Our Silhouettes

Today we will:

  • Trace over the photos we took last week to create silhouettes of ourselves.
  • Save our file as both a Photoshop (.psd) and .png.
  • Create a new blog post with the png of our silhouette.
  • Complete the kitten dress up tutorial.

Follow these steps to create your silhouette:

Part 1: Saving and Opening the File in Photoshop

  1. Find your photo at the bottom of this blog post. Click on your profile photo to view a larger version of it. Then right click (or control click) -> save image as, and save the image to your username.
  2. Open Photoshop.
  3. Open your photo on Photoshop. (File -> Open).

Part 2: Painting your silhouette

  1. Create a new layer by clicking on the new layer button at the bottom of the layers palette. new_layer_button
    It is located on the bottom right side on the screen.
    Name this layer “silhouette.” Make sure the silhouette layer is selected. You can tell it is selected if it is blue. Make sure you do this step, or you will paint over your face and forever alter your source photo!
    Your layers palette should now look like this:
    silhouette_layer_before_tracing
  2. Select the brush tool from the toolbar on the left of the screen. brush_tool Go to the top of the screen.
    Change the hardness to 100% by dragging the slider all the way to the right.
    brush_tool_slider
  3. Select a color to paint with by double-clicking on the color box on the bottom left side of the screen. color_selector
  4. Select the magnifying glass from the tool bar and click on your image until you have zoomed in enough to be able to trace over your silhouette. magnifying_glass
    If you accidentally zoom in too far, you can zoom back out by going to the menu at the top of the screen, and selecting (View -> Fit on screen).
  5. Select the brush tool again. brush_tool Begin tracing over your silhouette.
    Adjust the brush size as needed:
    Press the right bracket } key to make the brush larger
    Press the left bracket { key to make the brush smaller.
    Once your trace over your entire silhouette, your image should look like this:
    profile_silhouette
  6. Go to the menu at the top of the screen and press File -> Save to save your progress (or press control + S).

Part 3: Painting your background

  1. When you are finished, click on the Background layer in your layer palette, then press the new layer button to create a new layer. Name this layer “negative space.” Make sure the “negative space” layer is selected. You can tell it is selected if it is blue. Make sure you do this step, or you will forever alter your source photo! Your layers palette should now look like this:
    negative_space_before_bucket
  2. Select a color to paint with by double-clicking on the color box on the bottom left side of the screen. color_selector You should pick one that contrasts with your silhouette color.
  3. Select the paint bucket tool from the  toolbar on the left side of the screen.
    Click anywhere on your image to paint the background.
    Your image should now look like this:
    profile_silhouette_bg
  4. Go to the menu at the top of the screen and press File -> Save to save your progress (or press control + S).

Part 4: Cutting the silhouette out of the background

  1. Click on the silhouette layer. Go to the menu at the top of the screen and select Layer -> Duplicate layer. Name this layer “silhouette copy.”
  2. Click on the original silhouette layer in the layers palette so it turns blue.
    The layers palette should now look like this:
    layers_silhouette_copy
  3. Go to the menu at the top of the screen and select Layer -> Merge down. This will merge one of the silhouette layers with your negative space layer. Click on this merged layer to select it. It should be blue.
    The layers palette should now look like this:
    merged_layers
  4. Click on the magic wand tool. magic_wand
    It may be hidden under the quick selection tool. If that is the case, click and hold this quick selection tool until the magic wand tool appears, then select the magic wand tool. magic_wand_quick_selection
    At the top of the screen, change the tolerance to 10.
    magic_wand_settings
  5. Click the silhouette to select it. Then press control + x to remove the silhouette.
    It will not look like anything has happened. To test whether you have actually deleted the silhouette from the inside of the merged layer, go to the layers palette and click on the eye next to the silhouette layer. This will make the silhouette layer invisible, and you will be able to see what remains on the merged “negative space” layer:
    eyeball_layers
    Your silhouette should be cut out of the background like this:
    profile_bg_only
  6. Go to the layers palette. Drag the “negative space layer” to the top of the screen, and click the eyeball next to the “silhouette copy” layer to make it visible again.
    Your layers palette should now look like this:
    eyeball_layers_visible

Part 5: Saving your file

  1. Go to the menu at the top of the screen.
  2. Select File -> Save to save your final Photoshop file (or press control + S).
  3. Then select File -> Save as -> and save your file as a PNG.
  4. Create a new blog post with the PNG of your silhouette.

Kitten Dress Up Tutorial (teaches us how to combine multiple images into one Photoshop file, and how to use the transform tool to scale and rotate objects)

Completed kitten dress up tutorial

  • Click here to view the step-by-step-instructions for the kitten dress up Photoshop tutorial. (If you do not have this file open and cannot tell me what step you need help with, I will not help you.)
  • Click here to download the kitten dress up Photoshop file.

Profile Photos to Download

Click on your profile photo to view a larger version of it. Then right click (or control click) -> save image as, and save the image to your username. Don’t worry if you think you look silly in your photo – we will be drawing over our faces in Photoshop.

Darla B.

Darla B.

Javaughn B.

Javaughn B.

Brianna B.

Brianna B.

Kiera C.

Kiera C.

Francheska D.

Francheska D.

Taylor G.

Taylor G.

Amari G.

Amari G.

Angel G.

Angel G.

Deziree G.

Deziree G.

Deziree

Deziree

Wah H.

Wah H.

Celi M.

Celi M.

Jenna M.

Jenna M.

D'Asia M.

D’Asia M.

Raphael M.

Raphael M.

Lily N.

Lily N.

Gennalis O.

Gennalis O.

Lashawn P.

Lashawn P.

Desean P.

Desean P.

Dahmeaz

Dahmeaz

Keysean R.

Keysean R.

javier

Javier R.

devonee

morris

Morris W.

Jason W.

Jason W.

jason2

Jason W.

Photoshop Mini Lessons

Today’s essential question: For this project, we will create a digital collage. What are some ways a digital collage is similar to a paper collage? What are some ways it is different?

Today we will complete two tutorials. These tutorials will teach us how to remove the background from an image in Photoshop, how to combine multiple images into one Photoshop file, and how to use the transform tool to scale and rotate an object. We will complete both the veggie and kitten tutorials, save a Photoshop version of our file and a png of each tutorial to our username, and post the PNG to our blogs. You must post your work from today in order to receive participation points.

Links to the resources we will use today:

Veggie Tutorial (teaches us how to use a variety of tools to remove the background from an image)

Veggie tutorial starter file

Veggie tutorial starter file

Completed veggie  tutorial

Completed veggie tutorial

  • Click here to view the step-by-step instructions for the veggie Photoshop tutorial. (If you do not have this file open and cannot tell me what step you need help with, I will not help you.)
  • Click here to download the veggie Photoshop file.

Kitten Dress Up Tutorial (teaches us how to combine multiple images into one Photoshop file, and how to use the transform tool to scale and rotate objects)

Completed kitten dress up tutorial

Completed kitten dress up tutorial

  • Click here to view the step-by-step-instructions for the kitten dress up Photoshop tutorial. (If you do not have this file open and cannot tell me what step you need help with, I will not help you.)
  • Click here to download the kitten dress up Photoshop file.

Today we will:

  • Complete the veggie tutorial. Save your file to your username as both a photoshop (.psd) file and a .png file.
  • Complete the kitten dress up tutorial. Save your file to your username as both a photoshop (.psd) file and a .png file.
  • Create and publish a new blog post with the following:
    • a png of your completed veggie image
    • a png of your completed kitten dress up image
    • a paragraph describing how you create each image. Include any challenges you faced, and how you worked through those challenges.

The following students still need to email me (steph@stephlawson.com) the links to their blogs: Celi, Gennalis, Lashawn, Keysean.

The following students still need Deziree to take their photo: Dahmeaz, Devon’ee.