Pablo Picasso and Cubism

Pablo Picasso was a Spanish painter, sculptor, printmaker, ceramicist, stage designer, poet and playwright who spent most of his adult life in France. As one of the greatest and most influential artists of the 20th century, he is known for co-founding the Cubist movement, the invention of constructed sculpture, the co-invention of collage, and for the wide variety of styles that he helped develop and explore. Among his most famous works are the proto-Cubist Les Demoiselles d'Avignon (1907), and Guernica (1937), a portrayal of the Bombing of Guernica by the German and Italian airforces at the command of the Spanish nationalist government during the Spanish Civil War.

Guernica

Cubist Portraits with Collage

Picasso Assignment 1:
Find a "Cubist" painting by Pablo Picasso and post it to your blog. Write a brief outline bio of who Picasso was. Then define Cubism (in your own words).
Then have your portrait taken in the LFAS Photo Studio (Side profile and front).

Information about Picasso: www.pablopicasso.org
Check out this fun Picasso link: http://www.picassohead.com/

Assignment Check List

Make sure you have the following assignments posted to your blog:

1. Banner and banner adaptations, Wordle to finished piece.
2. Illustrator Tutorials- Pear loaded to blog, Tutorials saved to Share folder [or guest if you didn't have an account yet].
3. Morphed Letter. [10s only].
4. Illustrator "Critter" Drawing [ 10s with chosen image].
5. Illustrator "Critter" Drawing Reflections.
6. "Critter" Drawing with background. Save to Critter Share folder for a class sharing.

Final Creature Illustration

Export your final critter illustration [without the original/template and without the background]. EXPORT as a PNG (retains the color better).
Post your critter to your blog.
Write a brief reflection about your critter illustration; include the following prompts:

1. Why did you choose this illustration to trace? 
2. How did you adapt your drawing? What colours (or swatches) did you change?How did you select the colours?
3. Did you change any parts to the animal? If so, why? or if not, why not?
4. How does this drawing represent you? 
5. What sort of challenges did you have in learning how to draw with Adobe Illustrator.

Illustrator Drawing Assignment: Dog, Cat, Bird

Use your new pen tool skills to trace a simple Illustrator. Choose one of the images.
10s select your own, but keep it fairly simple.

1. Open a new Illustrator document.
2. Then >file >place one of these simple images to your document
3. Add a New Layer. from pop-down window on the layer pallet.
4. Start drawing your image using the pen tool.
5. Add your own final touches.

10s- Morphing a Letter

Direct Selection Tool

1. Choose a letter simple sans serif font first Letter of your first name, or last name.
2. Then make the letter a graphic object by:
3. SELECT the letter with the SELECTION TOOL.
4. Then go to OBJECT> CREATE OUTLINES, ~or EXPAND.
5. Use the DIRECT SELECTION TOOL to reform the letter style. Click on points to re-shape10 times to create another shape/image.
6. With each reformation, save the change and then select the form, 
7. COPY and PASTE the new shape to make the next change 
8. Make 10+ variations of the letter. 
9. This is a doodling exercise; be creative, and remember to save each different steps.

Banner Progress

Banner Progress

Finish and Post your Banner

After you create a textured text, and you are happy with the overlapping texture, we are going to experiment with the text tool and positive - negative space on your banner.

First you have to flatten the image. LAYER>FLATTEN

Select an area with the TYPE TOOL, select the font, size, alignment, etc.  Type your name or the title of your blog with the Horizontal Type Mask, or the Horizontal Type Tool.

Crop your banner.

When you are satisfied with your design, SAVE AS your file as a  PSD (Photoshop Document).

Use the CROP TOOL to crop the banner to a size that works in Google. WIDTH: 1000px HEIGHT: 120px RESOLUTION: 72dpi in the option bar at the top of the file.

LAYER> FLATTEN your file and then SAVE AS a JPG. (Joint Photographic Experts Group). You cannot post PSDs to your blog. 

Once you are finished, add your banner to your blog. In Settings>Layout>Heading (Edit)> Browse for your file.

More Photoshop Tricks: Adding Filters

So we have created the Wordle with the 100 words about yourself to create your banner. Now we are going to experiment with some filters that may emphasize something about you.
>LAYER> DUPLICATE a layer on your layers pallet.
>SELECT the LAYER where the image that you want to effect is on (it should be highlighted in blue).
> FILTER try/experiment with a filter and see what happens to a new layer each time:

• Blur-Gaussian Blur
• Stylize- Find Edges
• Brush Stroke- Accented Edges

You can use the erase tool to selectively erase part of the effect from your design
OR
> Use the MARQUEE TOOL [top of your tool bar] to SELECT a part of your image that you don't want and DELETE it. [to de-select- SELECT menu bar> DESELECT].

Marquee Tool

experiment, play and have fun...

Photoshop/Wordle Banner

• We are going to personalize your blog some more. 
• Using Internet Explorer
• Open Wordle: http://www.wordle.net/ 
• Type or copy/paste the write-up about you into the "CREATE".
• Try different colours, fonts, layouts, arrangements.

[There are other free programs that create a shapes from a word group: http://www.tagxedo.com/ BUT you need a Silverlight for it to run and it won't work for the banner, but it is good to know about. A fun, quick and easy graphic idea organizer. And https://tagul.com/ that you can use a photo for the shape, but you need  to sign in with an account.]
For this assignment, I would rather you start simple with WORDLE.

• Once you have your Wordle the way you want it, then Save as "PNG" into your file.
• Then open your Wordle it in Photoshop.
• Go to the start menu on the lower left side of your screen.
• Click All Programs> Adobe Design Premium> Adobe Photoshop
• Open FILE [top left pop down menu]> OPEN> 
• Fine file in "Computer" > student account/guest account.
• Open the >WINDOW menu, click on >LAYER to open layer pallet.
• Open the >LAYER pop down menu on the top of the window> DUPLICATE LAYER.

• Lower the opacity of the new layer copy.
• Then use the "MOVE" tool on the tool bar to shift, spin:

You can play with layer styles, colour and filters- experiment, and most of all, have fun!

Link Scavenger Hunt

<html>

<head> <title> donna's web sites </title>
</head>

<body>

<h1>My Web Sites</h1>
<hr>
<p>Here are some of my chosen web sites- <em>check them out:</em> </p>

<ol>
<li><a href=”http://www.the1staddress.com”>clickhere</a> </li>
<li><a href=”http://www.the1staddress.com”>clickhere</a> </li>
<li><a href=”http://www.the1staddress.com”>clickhere</a> </li>
<li><a href=”http://www.the1staddress.com”>clickhere</a> </li>
<li><a href=”http://www.the1staddress.com”>clickhere</a> </li>
<li><a href=”http://www.the1staddress.com”>clickhere</a> </li>
<li><a href=”http://www.the1staddress.com”>clickhere</a> </li>
<li><a href=”http://www.the1staddress.com”>clickhere</a> </li>
<li><a href=”http://www.the1staddress.com”>clickhere</a> </li>
<li><a href=”http://www.the1staddress.com”>clickhere</a> </li>

</ul>
<a href=mailto:donna.usher@home.com>click here to contact me</a>

</body>
</html>

List of 10 sites:

1. browser
2. map site/travel site
3. music site
4. video site
5. weather
6. news source
7. an amazing site
8. a terrible site
9. html tutorial
10. choice

HTML Vocabulary

We are going to work on HTML vocabulary to further develop your ability to control the design and organization of your web page.

First use one of your self-portrait images photoshop. Open your image and reduce your resolution to lower the overall size of your image, it must be in RGB. Save your image to your "WEB" folder.

Headings: Are bold, bigger and move the next sequence of text to the next line <H1 > the biggest</H1 > to <H6 > the smallest</H6 >.
Text Colour: <font color="blue" >
Text Style: <font face="Arial" >
Text Size: <font size="+1" >

Hexidecimal Colour Code: RR GG BB put a number sign in front and numbers 1-9 or letters A-F to represent the colour. Here is a hexidecimal colour chart.a better hex chart.
A line of text: <p >  and you have to close with </p >
Text Alignment: <div align="right" > or you can align it in the centre </div >
Line Break: <br > is a break to another line, no closing tag required

Image: <img src="name_of_your_photo" >
Link to another page, relative URL= <a href="page2.html" > type something to click on here</a>
Link to another site on the internet, absolute URL= <a href="http://www.website" > type something to click on here</a>

Tags within the opening "BODY" tag
Link tags to change the colour of your links use these attributes in the <body> tag:
link= change the link colour
alink= changes the link colour when you are clicking on it
vlink= changes the colur of your link after you have visited it
bgcolor= changes the colour of your page
background= changes the image on the background of your page

Lists
Numbered List <ol >
Buletted List <ul >
You need to put a <li > before and after each item on te list </li >
then close the ul or ol </ol > or </ul >

Basic HTML

We are going to learn how to make basic web pages using HTML. There are many HTML tutorials that you can explore. http://www.lissaexplains.com/ is a good one; it looks kind of childish, but easy to follow. HTML glossary is nicely organized, and HTML Tutorial  is a good one too.

1. Create a "Webpage" folder in your Design folder.
2. Open "Note Pad" in the Start menu- Accessories-Note Pad.
3. Type the following:

<html>

<head>

<title>Choose your own site title, and type it in here.</title>

</head>

<body>

Everything that appears on your site will be entered here (text, images etc.), between the body tags.

</body>

</html>

Then save as "my_1st_webpage.html". (Make sure you include the extention ".html")

Open Internet Explorer File- Open- Browse for the file in your folder.