First Day of School!

Go over School Rules and Class Procedures
Finish class Introductions

1. Hand Out Computer Rule Sheet
2. Finish Introductions

Second Day of School!

Go over School Rules and Class Procedures
Finish class Introductions

1. Collect Signed Computer Rule Sheet
2. Finish Introductions
3. Turn on computers - Log in with new password
IF you are NEW - password1 is your password
IF you are OLD - use your old password BUT you must reset it immediately.

4.. Log into FOCUS through LaunchPad - Check out other resources

Computer Set-up

Look around computer – note programs.
Set up Start Menu and QuickLaunch settings.
QuickLaunch Taskbar at bottom, Show desktop link.
Chrome shortcut Link

Rules Test coming up at the end of next week. No pressure or anything - it's just to make sure you read the Rules sheet. You don' t need to study, but if you want to.... HERE (PDF) is a copy of my rules.

Review:

1. Tour of computer desktop
2. Adobe Programs
3. Quick Launch
4. Demonstrate QuickKeys to access shortcuts quicker.

Log into and set up OneDrive-BrevardSchools. There are 2 that you have acces to BUT use the Brevard Schools One NOT the Plain One

OneDrive - BrevardPublicSchools YES YES YES
OneDrive Personal - NO NO NO

Folder Set Up:

Dreamweaver, Animate, Photoshop, Premiere, ,LocalSites, OldSites, Stuff, Personal

Remember to store everything on your OneDrive. DO NOT to save anything on the computer/MyDocuments.

START QUICK KEYS ASSIGNMENT.

A,B,C,F,I,N,O,P,S,U,V,W,X,Y,Z, 1,5,2 | F7,F5,Alt+F4, Alt+Tab

Finish Quick Key assignment You can also watch a video of me doing it HERE!

If you are having troubles with the OneDrive - Here is a video to help you set it up.

We (as a class) will print the QuickKeys assignment out when done - please stay with me on this.

Short lesson on how to search for images on Google and download them. Copyright, proper usage discussion.

Printer - it should automatically recognize you in this room BUT it is the "LX360 Printer" (The 2011 is our school number)

PLEASE double check three things before printing:

1. Is the work done to the best of your ability?
2. Is it ONE page?
3. Is your name in the footer?
4. Print if OK - I'll take care of the printer today, but normally you can go get it.
_______

Review Quick Keys worksheet - there will be a test on it at some point in the future - study your printout and practice when you are in class.

Start your Web Browser Sheet HERE. Save it to your stuff folder.

Set up headers and footers.

OK - let's finish out the week -

1. Did you turn in your signed Computer Rules Sheet?
2. Are you using your OneDrive-Brevard Public Schools?
3. Did you set up your Task Bar?
4. Did you set up your Start Menu?
5. LAB FEE next week of $5 - try to remember that.
6. Did you print your finished Quick Keys Sheet?

TODAY
1. Finish and Upload your Web Browser Sheet - did you do the headers and footers?
2. Copyrght Rules Sheet - download both the links below and complete the new worksheet

Copyright Worksheet HERE Use this link HERE You will need to allow the SWF to run.

Check to make sure you have the following completed:

1.Quick Keys printed and returned (if I passed them out)
2. Web Browser sheet Uploaded
3. Copyright Sheet Uploaded

Ice Ice Baby - Copyright HERE

Yes, you can turn these in for full credit BUT you should keep track of what you have turned in. Remember you can do it at home as well. Log into your Drive account at home and use Word.

Make a new folder in your PS folder called PS-Ducky-Beiber and download these files into that folder. Download both Ducky and Beiber.

4 Main things you should learn today Memorize these and put them in the STICKIES!
1. PS is composed of layers!!
2. Unlock a layer to work with it.
3. Show transform controls!!
4. CTRL+ D = Deselect

4 layers for the duck - Hue&Saturation
New Colors for Ducky

DUCKY

Things you will learn/review:

1. Extraction using Marquee Tools,Lasso Tool, QuickSelection and Magic wand
2. Layers and Duplicating
3. Hue and Saturation coloring
4. Images from Internet - How to download and Save
5. Layer Arrangement
6. Text Tool - FX

Videos if you just need a review OR you didn't catch it.

Photoshop Introduction if you missed it!
How to Extract a Photoshop Image HERE NEEED TO LINK UP!

Quick Review of what you learned:

1. PS is composed of layers
2. CTRL+D or deselection for anything selected
3. Show Transform Controls MUST show to resize
4. MUST unlock layers

Other lessons:

1. Marquee Tool
2. Lasso
3. Quick Selection - Magic Wand
4. Crop Tool
5. Eraser Tool
6. T Tool for your name.
7. Saving as PSD
8. Exporting as JPG/GIF/PNG
   

Work on Beiber - give him a new background and put your name on it.

Save as PS_Beiber-After.

REVIEW VIDEOS

PS Introduction

PS Extraction

You can also review or watch my videos on this lesson. by going to my video page HERE.

Keep working on Beiber

We are going to:

1. Duplicate him 4X
2. Use Liquify to modify him
3. Arrange him 4 up all facing the center
4. Put a new background behind him
5. Put your name on it (PS-Beiber - LastName)

WHEN BEIBER IS FINISHED Do one more.

Find and download 2 celebrities and give them the "Beiber Treatment" or basically do the same thing to the new person that we did to Beiber.
2 HINTS
1. Find an image that will make it easy to extract the person from.
2. Use your Google Tools to find a image over 800px.

Save it as PS-Celebrity and be sure to put it in your PS-Beiber-Ducky Folder

Review Worksheets
1. Quick Keys - Next week friday Quiz
2. Web Browser Sheet
3. Copyright sheet

PS-Celebrity Finish

Together -- export 3 ways for the internet - GIF, PNG, JPG and Compare of Images
Use File Export Save for Web. (This is the ONLY time that we will be exporting this many images - you only need one image the rest of the year.)

Start new worksheet on Image Types- remember to set up Headers/Footers and use SAVE AS to put it into the Stuff folder.

HOMEWORK - get an image of yourself and e-mail it to yourself so you can practice your extract skills.

OK QUIZ TIME ON CLASS RULES and other misc things.

JUST A COUPLE THINGS FOR TODAY:

1. Go to Socrative.com and I'll help you log into your first quiz. You may only use your memory on this quiz.... just 17 questions today.Class name is ANGOVE
2. Worksheet on Image Type Comparison HERE (Word 202KB)
Put it in your Stuff folder and put your name in the footer. Use the internet to find out the answers. (Read what the site says, then use your own words to answer.) Use your files you exported PS-Celebrity to answer the questions.
3. I'll come around and check your 3 pictures you've done so far. Please have them open for me! PS-Ducky - PS-Beiber - PS-Celebrity
4. Keep working on your Image Types worksheet - upload when done. Not officially due until Monday, uploaded to FOCUS.

HOMEWORK - get an image of yourself and e-mail it to yourself so you can practice your extract skills.

CHECK YOUR GRADE - ANY ISSUES LET ME KNOW
Lab Fee this week if ready to turn it in = $5.

Keep working on the worksheet on Image Type Comparison --Upload the assignment to FOCUS today - yes, you might need to finish this for homework.

_______

PS DONKEY!!!!! Download this ZIP file and export to your desktop. Make a new folder in your PS called PS-Donkey and put all the files in there. (THIS is what we are trying to make.)

PS-Donkey1-3 First Video HERE
PS-Donkey2-3 - Second Video HERE
PS-Donkey3-3 - Third Video HERE

Things you should do with PS Donkey:
1. Extract and Import (Drag&Drop) the shed to the hills background.
2. Extract and Import the Donkey into the hills.
3.Reverse the Donkey to face to the right.
4.Make a new layer and plant some grass.
5. Burn the sky to mimic a rainstorm.
6. Put your name across the sky with FX on it.
7. Burn or Dodge the shed to reflect a light source.
8. Add shrek after extracting him from an internet image.

HOMEWORK - get an image of yourself and e-mail it to yourself so you can practice your extract skills.

Lab Fee this week if ready to turn it in =- $5.

Ok you should have most of your donkey done - we are going to put a couple more touches on the PS-Donkey (he's gotta have a Shrek friend) and then we will export PS-Donkey for Web.

If not completed, finish Friday's worksheet (Image Comparison.

HOMEWORK - get an image of yourself and e-mail it to yourself so you can practice your extract skills.

Lab Fee this week if ready to turn it in = $5.

Finishing touches on PS-Donkey.
Name, Shrek/Dragon, Burn Shed roof, Filter/Render/LensFlare

Make your own scene using the same skills you used in PS-Donkey
Do the following:
1. Extract yourself & Celebrity and 3 things to a new background - try to tell a story with good interaction.
2. Burn or Dodge the background (or something)
3. Save it as PS-Extract in a PS-Extract folder
4. Export as a JPG High. (Final export should be <1000px wide.)
5> Is your name on it with a warp and FX?
No story-C - Good interaction-B - Totally Interactive-A
Best in Class - A++

Keep working.

QUIZ ON QUICK KEYS!!!!
Log into Socrative.com with class name Angove

Finish your PS-Extract (You and a celebrity with a background) and export it the best way after comparing the sizes and quality.

SHOW ME:
1. PS-Donkey
2. PS-Extract

LAB FEE OF $5 - please turn in this week.

Check your grades.

Try this game HERE to tell the difference between sans-serif and serif fonts.

Go over the worksheet from last week - Image Comparison Sheet

_______

Introduction of W3Schools

Time to jump into HTML - the base language of almost all websites!

We are going to create websites using NotePad (OR Notepad++) (do a search on your computer) and learn about HTML on W3Schools.com - there are many resources there, so go in order and see what you can do!

HERE is your link to get started.

Make a new folder in your LocalSites folder called 1-FirstSite

HERE is what it should look like when done.

NOT ASSIGNED HURRICANE EVAC
Worksheet Grading Websites HERE. DUE FRIDAY Do this either at home OR in between what we are doing in class

$5? Did you PMLYOM ? BHMM.

Re-read yesterday's plans.
(IF you TOTALLY messed up yesterday, you can check out my video page HERE.)

So far - You have learned:
Basic Page setup - heading sizes, paragraphs, linking pages images and image size. "Sandwich Method"

Today you will learn:
1. Inserting Pictures / Controlling Picture size
2.HTML Attributes - ALT
3. HR tag (Horizontal Line)

Finish your first website using the HTML tags you just learned. New site tomorrow!

Website Accessible Standards at WebAIM

LAB FEE OF $5 - please turn in this week.

Keep working on your index.html page on your 1-FirstSite folder.

Yesterday Put your PS-Extract Image on the page
Remember You will need to put a copy of the image in the folder and probably resize the image as well using height and width

NEW NEW

Work through the HTML Basic
You will need to put an OL List on your page of your classes.
(so 7 different numbered list items)

Continue working through HTML Attributes.
Put some color in your words! Color each line (yes it will look like fruit loops)

1. OL and UL Lists
2. Style Attribute

As you are working through the W3Schools lessons, take a short informal quiz to test yourself- take the 4 testing exercises at the bottom of the Attributes page.

HERE is what your page should look like.

LAB FEE OF $5 this week - please turn in this week.

SHOW ME YOUR 1-FirstSite website.

2-QuickKeys assignment NEW WEBSITE!

Make a new folder in your LocalSites folder called 2-QuickKeys and put your html document in there (index.html). Use your current skills to make a new page reviewing the quick keys. Put your 22 quick key commands on it. Use the sandwich method of making a site.

Basic Steps:
1. Open Notepad++
2. Create your basic site with some H1 and H2's, headers and Footers with hr tags using the sandwich method.
3. Copy and Paste your Quick Keys over inside the body. DO NOT number it - You will use an OL list
4. Work through the exercises below.

Online Assignments:

• W3 Schools - HTML Headings - work through the page and do the exercises at the bottom. (How did you do?)
• Keep working through HTML Paragraphs work through the page and do the exercises at the bottom. (How did you do?)

Yes, I made you a video as well! HERE It's the QuickKey1 Video

This is how far you should be at the end of today on W3Schools.

Main Things Today:
1.Take a short quiz HERE onW3Schools at the bottom of the HTML Styles Page. Scroll to the bottom of the page.
2. Work through the second video and enhance your Quick Keys site.

Your 2-QuickKeys website should be looking decent at this time. Work through HTML Styles (Colors) do the exercises at the bottom of the HTML Styles sheet.

Make these changes to your 2-QuickKeys website after going throught HTML Styles:
1. Body background with hexadecimal color (find a nice color that doesn't clash with your background.)
2. Change your font AND font color (Use Word to find fonts.)
3. Headings - align to center (Don't center your QuickKey Info)
4. Use hr tag to put lines in (Sandwich method)
5. Address tag at bottom with your name.
6. Use some compound styles.
7. Switch ALL your colors to hexadecimal.

Yes, I have a video for you as well! HERE QuickKey2 Video

HERE is what my code looks like (DON"T COPY MINE - it's just and example.) I already did the OL list - you probably have not.

Main things today:

1. Check your grades - any issues - see me @ PH-A
2. $5 Lab Fee Due THIS WEEK - LAST WEEK TO TURN IN!!!
3. Keep working on your Quick Keys. You should be on Quick Keys Video #3 ! HERE QuickKey3 Video
4. Short informal quiz on HTML Formatting (Remember the quiz is at the bottom!) in W3Schools.

Use the following commands in addition to the previous lessons in your website.
1. Bold - Use the Strong Attribute
2. Italicize - Use the EM tag
3. Mark Tag (on the hard quick keys)
4. Address for your name at the bottom
5. Comment tag someplace at the bottom.
6.ALL Hexadecimal color codes. HERE

HERE is an image of the code I used - DO NOT COPY - use your own ideas! HERE is what my page looks like.

OK - your site should be looking good at this point and your site should almost be done.

DO NOT GO ON TO QUICK KEY CSS VIDEO YET!

These are the Tutorials that we are working on this week.
You have worked through HTML Paragraphs - keep pushing through to colors.

Main Things Today:
1.Finish up your 2-QuickKeys site (Did you complete both the video AND the list from yesterday?
2. Grade 2-QuickKeys page
3. Start ColorTheory worksheet (bottom of page)

CHECK TO MAKE SURE YOU HAVE ALL THE FOLLOWING:
1. Site is inside LocalSites/2-QuickKeys folder.
2. Page is called index.html
3. Sandwich method
4. Title in top tab
5. H1 at top of page centered
6. Address at bottom
7. Body background with hexadecimal color
8. Font color changed
9. Different Fonts (Make them noticeable! - Use Word to figure out what fonts are installed.)
10. Bold/Strong in text
11. Italicize/EM tag
12.Mark Tag
13.Comment tag someplace at the bottom.
14. 2 Appropriate pictures floated to the right (NEW)

PRINT your HTML version of the website for me to grade. I'll help you print it out. NO 2 PAGERS!

Start Color Theory worksheet HERE. (REMEMBER if you are behind - do can do this at home!)

Use these sites for the last questions on the worksheet -->Go to color.adobe.com OR www.paletton.com (Bookmark these sites!)

Keep working on your Color Theory Worksheet

Check your grades - if you have any issues - I might be able to take care of it in class, but the best bet is to come during PowerHour!

Work on your Color Theory Worksheet Print it out two sided when done. (Of course, you saved it in your Stuff folder AND put your name on it before you printed, right?)

That is all! Review for your Quiz tomorrow on HTML and ImageTypeComparison.

Quiz on Image Types& HTML
25 Questions on Socrative. Room Name ANGOVE

Remember to use your LastName,First Name format. You WILL get points off if you do not.

_____

Check out this site HERE for a quick demonstration of CSS.

HOW DO MODERN WEBSITES RELY ON CSS FOR FORMATTING?

HTML CSS Lesson We'll go through this today. Take your time and be careful of punctuation - yes the brackets matter. Complete the 6 exercises at the bottom of the page. You do NOT need to save them.

• Use the HTML style attribute for inline styling
• Use the HTML <style> element to define internal CSS

Edit your QuickKeys document to internal CSS.
You can also check out a video on my video page. You are on Video #4. HERE is a link to the video page. QK4

MAIN THINGS TODAY

1. Review Color Theory Worksheet
2. Review your 2-QuickKeys Site - address tag

OK - finish up QK #4 on CSS - Remove all your inline CSS (with the exception of the images) and put it at the top.

Work on Monday's work if you are ahead.

You should have completed and understand all these lessons so far - we are starting CSS soon!

Looking for a video? Check HERE!

HOW DOES CSS CLEAN UP YOUR WEB PAGE?

Finish changing your 2QuickKeys into an internal CSS document.

You are on QK5 video HERE.

When done - make sure you understand the following and have added CSS to support all the following.

• Use the HTML <link> element to refer to an external CSS file
• Use the HTML <head> element to store <style> and <link> elements
• Use the CSS color property for text colors
• Use the CSS font-family property for text fonts
• Use the CSS font-size property for text sizes
• Use the CSS border property for visible element borders
• Use the CSS padding property for space inside the border
• Use the CSS margin property for space outside the border

Add CSS to support ALL the following:

1. Body
2. H1
3. H2
4. OL
5. LI
6. Address
7. P

Remember to NOT use any color names, use only hexadecimal colors.
Remove ALL Inline CSS - you should ONLY have internal CSS.
(Your ONLY exception is your images, you will have some code on them. , which is OK.)

You can also check out a video on my video page. You are on Video QK5

Some additional CSS

OK - time to wrap up the 2-QuickKeys site with some finishing touches.
Make sure you have added ALL the items from yesterday to your CSS.

You can also check out a video on my video page. You are on Video QK6

Angove Lesson today on DIV tags
DIV means page DIVisions - or boxes - all modern sites are based on this theory.

Div Id Container.
<div id="container">
</div>

#container {
width:800px; background-color:yellow; margin-left:auto; margin-right:auto;
}

OK - Time to grade yourself - get a rubric, put your name on it and hang onto it. UPLOAD YOUR INDEX.HTML PAGE TO Focus!

NEW WEBSITE NEW WEBSITE NEW WEBSITE!

We are making a new site that will use modern design with HTML5 and CSS combined. Some of the HTML5 tags are a little different = check them out -- HERE if you are wondering why I named things a certain way.

HTML Links Section today HERE

3-ImageTypes Website Video #1 on my video page. 1/10 today. [11Min]
You will learn the following:
1. New Local Site folder
2. Setting up basic DIV tags.
3. Linking CSS.

You can also check out a video on my video page. 1/9 video

Second day 3-ImageTypes website

2-10 Video -Planning out website

Yes, you can work ahead if you want to!

Keep working on your website!

Video Lesson- 3/10 6:41 Minutes
Creating an index page
a. Basic page structure
b. DIV Tags (HTML5)
c. Use External CSS
d. Sandwich Method

Video Lesson 04/10 7:38 Minutes
Linking to Pages that don't exist *yet*

Video Lesson 05/10 10:56 Minutes

Creating Color Scheme using Paletton.com and CoolText.com (Bookmark these Sites!)
Modifying colors and DIV's
Take you time on this lesson!!!

BIG DAY for you - it's all coming together!

Video Lesson 06/10 11:56

Tables! Use W3Schools to check them out.

Video Lesson 07/10 7:22

Making all your pages - don't walk out today without having a complete website!

Video Lesson 08/10 10:20Minutes

Adding Content to your pages - pics and text.

Video Lesson 09/10 7:38Minutes

Images as links - Setting up a table to organize information. YES you have to set up your own table and YES this will take some time.

Video Lesson 10/10 7:40Minutes

Cleaning up website / putting images into folders.

WOW - You should be done - do your last checks...
Grade yourself if you are ready

Your site is NOT officially due today, BUT if you are ready to turn it it, follow these instructions to turn in your site:

1. Right-Click on your 3-ImageTypes folder.
2. Click Send To - Compressed (zipped) folder
3. Rename the zipped file with your period and last name (2-Smith)
4. Upload this file here.
5. Hand in your Rubric sheet.

TURN IN your 3ImageTypes website to Edline.
I will show you how to Rename your folder, zip it and submit it.
(or follow Friday's lesson)
100% STUDENTS TURN IT IN NOW
100% STUDENTS GRADE YOURSELF NOW
If you want to make some of it up, I am here for PowerHour M,T,W and will grade it one time late (yes, you will get points off!).

Do NOT work on the site in class anymore - you need to start the new assignment. Points will be deducted if you do!

NEW SITE 4PersonalSite - This site is like a comprehensive test on how to create an HTML Page so - I generally won't be helping you on this one, you can assist (just a little) your neighbor though.

Video Lesson Lesson01 4-Personal Site [7Min]

General Instructions - follow if you wish:

1. Make a new folder 4-PersonalSite
2. Make an image folder inside of it.
3. Go to Paletton to get some new colors for your personal site. Put the Paletton color scheme into your Images Folder.
4. Sketch site out using DIV tags in Paint like you did before. Save it as 4PerSiteCOMP.jpg
5. Start making your index.html page. Use your 3rd site as inspiration.
6. Set up your external CSS page and link it to your index page.
7. ONLY WORK ON YOUR INDEX PAGE

1. Home Page - index.html
   1. 2 Pictures of you floated- some general information.
2. Personal Page - personal.htm
   1. UL list with 5 links to school sites
   2. OL list with 5 links to personal sites
   3. 2 pictures floated
3. School Page - school.html
   1. 3 column 8 row table with Teacher/Class/Picture
4. Other Page - can be anything you like to do
   1. (NOT other.html) I called mine motorcycle.html
1. 2 pictures with written paragraph
5. Paletton Page -paletton.html
   1. Put your two Paletton Images on this page. \
   2. Put your 4PerSiteCOMP.jpg on this page.
   3. Text is not needed.
   
   

Work on ONLY your index page.
Here is what my basic code looks like - check out the new <nav> div - put your links inside this so you can control them. Use the code in your sketch we did yesterday.

Set up your links - get some content for the main section - your picture (PS-extract?) and some general information about yourself.

Change colors on H1-H3's and other sections.

ONLY WHEN YOUR INDEX PAGE IS PERFECT -
Time to make all your pages - copy and paste the index then rename each page. (If you forget how, check out the 7th video of 3-ImageTypes HERE) Change the Title and header of each page.

Paletton Page - add your pictures.

Personal Page

You should have - H1's, H2's, 2 pictures, and 5 UL links, 5OL links.
Also put 2 pictures floated to the right of the links. (You probably want to use PNG's because of the transparancy - but any pic is OK.)

Remember, you are not going to hurt my feelings if you do some work at home.

Other Page

Whatever you want - Put what you want in this page - 2 pictures, H1, H2 and some text about you or what you like to do. It should be something that you like to do in your spare time - band.html, skate.html, horses.html or whatever. Make sure you have 2 pictures and some text content.

NO SCHOOL TODAY!

Keep working on your site.

Start the table for the school page.
Find pictures for your classes - yes, you will have to control your height and width.

School Page

Add these to your website.

1. Picture of MHS
2. Picture of your class. (I'll take it and put the link below.)

PICTURES

• Period 02 HERE
  
• Period 04 HERE
• Period 07 HERE

DO NOT DO THE VIDEO
Put your class video on your site.
Read about how to input a video HERE. Put your code in so you can just place the video in.

Get your pages done HERE is a rubric that you will use to grade yourself tomorrow.

Other Page - anything you want (Sound file? Optional HERE)

Test on friday - color theory, CSS, HTML etc.

HEY - no more straight HTML coding.

Finish up site - due today at end of class.

Filll out your rubric turn it in to me. 100% YES YOU MUST DO THIS!

I will be grading your site with you on Monday but you will have NO time to work on it.

Points deducted for each class day late is 10% or 20 Points - DON'T BE LATE!

PS-Banner1 today - Paste an image behind text. You will use this on a future site (Halloween). You should use 4 different pictures behind your text (Your Name)and export them as well as PNG's.

Check out how to make a banner here.

After you learn how to make a banner - make 5 new ones (You can use the same background OR you can use different ones. - IF you are a little slow - use the same backgrounds.

Halloween Banners - Find a scary/creepy backgrounds

Use the same method as you did yesterday to create new banners for our 5-Halloween Site (Next week or two.)
1.PS-Halloween
2.PS-Ghost
3.PS-Zombie1
4.PS-Zombie2
5.PS-LastName

Make a new folder called PS-Halloween and put your images in there.

1. Download this zipped file to your desktop HERE. Unzip them into your PS-Halloween folder.
You can check out my video on this here on how to do non-destructive masking.

We are going to be using 2 techniques - Destructive and Non-Destructive editing to make me a mummy/zombie. (You don't have to use me - you could use someone else if you want to.)

DESTRUCTIVE Save this as PS-Halloween1-CF (Example HERE)

NONDESTRUCTIVE Save your scary face one as PS-Halloween2 (Example HERE)

In preparation for Halloween, we are going to make a couple of different creations and different types of that as well.
PS-Zombie-Celebrity

Put all your files into your PS-Halloween folder.

PS-Zombie-Celebrity
Download an image of a celebrity face (~1000px width)- no glasses, no facial hair, should be straight on.

THIS is what we are trying to create - here is one without the background HERE.

I am looking for:

1. Scary background/halloween theme.
2. Famous celebrity - extracted from background
3. Zombie face underneath celebrity layer
4. Layer mask on celebrity layer with zombie showing through.
5. Name of assignment with your name - FX applied to it with halloween colors.
6. Exported as a JPG with 700px width and keep it in your PSHalloween Folder

HOMEWORK - BRING A PICTURE OF YOURSELF with the same characteristics as the Celebrity!!!

Today's work is PS-Zombie-LastName

Put this in your Halloween folder.

PS-Zombie-LastName
Time to Zombify yourself - use your own picture to make a zombie picture of your self, make sure you use non-destructive editing of the picture- Save it as PS-ZombieLASTNAME

1. Save your pic as a JPG and extract yourself from the background (in PS).
2. Get a scary background online.
3. Fit yourself into the background.
4. Put some scary text at the top (Use FX's)
5. Put some more zombies in it.
Save it as PS-ZombieName.psd and export as a JPG 700px PS-ZombieLastName.jpg.

End result should look like THIS.

NEED PLANS FOR TODAY

Looking for a video? Check HERE!

New Folder - PS-Animations

My Video on how to do this is HERE.

PS-Animation-Ghost.gif (My Example HERE)
1. Download a picture of a ghost, bat, and a scary background to your folder.
2. Extract the ghost from the background.
3. Extract the bat from the background.
4. Import all 3 both to the same PS. (PS-Ghost-Animation)
5. Using Frame by frame animation, anuimate the ghost and bat.
6. Put your name on it - all frames.
7. Export as an animated GIF. 500 px width to fit on a website.

CONVERT YOUR ANIMATION TO A MOVIE
1. Change to movie timelime
2. Add a sound file from here HERE or Get your own HERE.
3. Make sure your green audio track is the same length as your animations.
4. File-Export-Render video to make a video. PS-Animation-Ghost.mp4 You only need to change the location (PS-Animations folder) and the size - take it down to 500px height and 300 width.
5. Save/close PS and check out your animations and videos.

Put these files into your PS-Animation Folder

Second Animation - PS-Animation-Zombie

My finished files HERE (GIF) and HERE (MP4)

Instead of making a frame-by frame animation, we can use a tween function to make the figure move.

ANIMATED GIF
1. Download a picture of a Zombie, something else (another zombie,sword or something) , and a scary background to your folder.
2. Extract the Zombie from the background.
3. Extract the other thing from the background.
4. Import all 3 both to the same PS. (PS-Animation-Zombie)
5. Put your name on it - tween that as well.
6. Using tweened animation, anuimate the zombie and other thing.
7. Export as an animated GIF. 500 px width to fit on a website.

CONVERT YOUR ANIMATION TO A MOVIE
1. Change to movie timelime
2. Add a sound file from here HERE or Get your own HERE.
3. Make sure your green audio track is the same length as your animations OR shorter
4. File-Export-Render video to make a video. PS-Animation-Zombie.mp4 You only need to change the location (PS-Animations folder) and the size - take it down to 500px height and 300 width.
5. Save/close PS and check out your animations and videos.

End result should look like THIS *(GIF) (My Daughter)

Finish PS-Zombie-Animation

Export Movie and GIF.

Start Tomorrow's work.

Finish your animated GIF's and Movies

OK - what you should have:

2 Folders PS-Halloween and PS-Animations

1. PS-Banner (with your name on it)
2. Banners for your new website (5 of them)
3. PS-Halloween CF (Angove with destructive editing)
4. PS-Halloween2 - (Angove Non-Destructive editing-Zombie)
5. PS-Zombie-Celebrity (Non-Destructive editing-Zombie)
6. PS-Zombie-SELF (Non-Destructive editing-Zombie)
7. PS-Animation-Ghost (GIF and MP4 animations)
8. PS-Animation-Zombie (Gif and MP4 Tweened Animations)

We are going to use these in our next website that will set up on Friday.

START TOMORROW'S WORK TODAY!

PS-Faces-Halloween

My Video on how to do this is HERE.
This is what you are trying to create HERE.
Save this as PS-Face-Halloween

NEW PS Tools:

Liquify
Spot Healing(Band-Aid) tool to remove selections.
Content Aware Brush
Mulitple Layers
Quick Photoshop 

Just one easy assignment for today:

1. Make a new folder 5-Halloween in Local Sites
2. Make an Images folder inside it.
3. Get some Paletton colors for a halloween site.
4. Clean up your desktop - put all extra files into it's proper folder.
5. Make sure your PS folder is clean as well. - Yours should match mine.
6. Check that you did all the weekly work (and it is in the right folder).

ASSIGNMENTS FOR THE WEEK:

Copy and Paste all these images into your 5-Halloween/Images folder

Banners:
1. PS-Halloween
2.PS-Ghost
3.PS-Zombie1
4.PS-Zombie2
5.PS-LastName

1. PS-Banner (with your name on it)
2. Banners for your new website (5 of them)
3. PS-Halloween CF (Angove with destructive editing)
4. PS-Halloween2 - (Angove Non-Destructive editing-Zombie)
5. PS-Zombie-Celebrity (Non-Destructive editing-Zombie)
6. PS-Zombie-SELF (Non-Destructive editing-Zombie)
7. PS-Animation-Ghost (GIF and MP4 animations)
8. PS-Animation-Zombie (Gif and MP4 Tweened Animations)
9. PS-Faces-Halloween

Quick Introduction to Dreamweaver

Looking for a video? Check HERE!

Dreamweaver Introduction

Workspace - panels - docking -
Custom Workspace

Sketch Site out on Paint to build it. Our 5-Halloween site will be similiar to what we did before on 3-ImageTypes

Review what the site will look like.

New Site - 5-Halloween.

HOW TO START A SITE
1. Turn off the computer.
2. Sketch Site out on paper/computer
3. Figure out names of each page.
index.html -PS-ZombieYOU Picture (JPG) and PS-Faces
halloween.html - PSHalloween1 and PSHalloween2 (2 Angoves) PS-Faces-Halloween
ghost.html - PS-Ghost-Animation (GIF and MP4)
zombie1.html - PS-ZombieAnimation (GIF and MP4)
zombie2.html -PS-ZombieCelebrity (JPG)
4. Paletton for halloween colors
5. Get pictures in one folder.
6. Start DW for NewSite
7. Make the site
8. Test the site
9. Upload the site.

Video for DW Introduction AND How to set up /design a site.

Create DIV tags from design Comp.

Remember - you want to make your index.html page PERFECT before you make your other pages - remember we did this with both the 3-ImageTypes and 4-PerSite - this is no different!!

Complete index page.

Keep modifying your website to match your Comp and your Paletton colors.

Custom Fonts through Adobe
Insert Date Function

Set up PageProperties
Custom Background from Internet
H1-H3 colors
Link Colors
more

Externalize CSS and make all your pages- tomorrow make your entire site.

Page Name - Page Title
index.html - This is your Home Page
halloween.html - Halloween Page
ghost.html - Ghost Page
zombie1.html - Zombie1 Page
zombie2.html - Zombie 2 Page
paletton.html - Paletton Page

After you make all your pages, change the following things on your site:

1. Change your Titles of each page (page properties)
2. Change the words above the pictures
3. Put appropriate pictures on your site

Make sure your site is linked together and working.

OK - Time to make your site:

1. Put content on each page - see Monday's plan for what you put on each page.
2. DO NOT resize your animated GIF's if you do - they will NOT work!
3. Don't worry about the videos - I'll help you with the videos later on Monday.
4. Write a short explaination of how you did each image in PS at the top of each page.
5. You can try a sample upload if you want to.
6. Read Monday's plans.
7. Help some other kids.

You can try to do a sample upload if you want to.

Looking for a video? Check HERE!

3 THINGS TODAY

1. Inserting videos into a website HTML5 - VIDEOS
2. Adding a link to Paletton Page/Comp Sketch
3. Sample uploading

Uploading your site:
1. Do you have a page called index.html in your root folder?
2. There should be NO .psd files in your website. Remove them. (You can delete them BUT make sure you have a copy in the PS folder!!)
3. Connect to Remote Server
4. Expand View to show server and local site.
5. Delete what is in your site (on the left)
DO NOT TOUCH YOUR NAME!!!!
6. Click on your SITE on the right top.
7. Press PUT files to your site.
8. When done, DISCONNECT from site
9. COLLAPSE view
10. Check your website out MHS Web1
11. If it's wrong - go back to Step 3 after fixing it.

www.mhsweb1.com and then click on your link - make sure it is what you want to turn in.

WHEN DONE - complete the worksheet and/or help others.

UPLOAD UPLOAD UPLOAD!!!
Check out websites.

Easy day - just taking care of business.

1. Grade yourself on your website Rubric provided in class. (HERE is a link) but you will get a paper copy.
   
2. Check out your classmate's sites at mhsweb1.com and see how yours compares.
3. 100% MUST TURN IN GRADE SHEET

OK - just cleaning off somethings today - |
1. Short FTP Worksheet HERE.
2. Check out other people's websites.
3. NO POWER HOUR TODAY.
4. Start tomorrow's lessons.

Download New Information for websites.

1. Go to THIS LINK and look at the "Green Book" information available to you.
2. DOWNLOAD and extract these files to your DW folder HERE. Extract them to your DW folder. I'll help you with this.
3. Clean up your files.

Online Worksheet on Chapter 1
HERE IS THE ONLINE WORKSHEET! (Yes, it looks like a test, but it is graded as a worksheet (25 Points)

Take your time and put your finger on the right answer before you answer it!!!

OK - another easy day:

1. Open your FTP worksheet from Wednesday- show me.
2. Previously was linked to Chapter2 Worksheet BUT you will need to do the end of chapter questions to make this up. Page 58 1-17 to make this up. (25 Points)
3. Clean up your drives - move all graded websites to OldSites
4. NO stray files on desktop OR on your OneDrive.

Discuss Chapter 1-2

Looking for a video? Check HERE!

NO SCHOOL VETERANS DAY.

Go back to Chapter 2 and start setting up your next website.

1. Set up your new site 6HD (Site/New Site - 6th website - Hardware Devices.) Remember to use ALL of the 4 tabs on the left to set your site up - especially the images folder. Remember I have a video that will help you if you forgot how HERE. (Around Page 49 in your book)
2.Work through Chapter 2 Hardware Devices Site starting on Pg 49.
3. When done, your site should look like Page 54. (There are NO DIVs' on this site YET - we'll add them later.)

** There are somethings that you will NOT be able to complete, as DW has changed, if you cannot figure it out, move along and keep working on the next item.

When done - Do on this worksheet HERE. We'll do some of this together.

You will be taking screen shots of how to make a new DW website. (Use your 6-HD site to take the pictures - DO NOT FORGET TO DO THE LEFT SIDE!

Keep working on your site if time.

Time to modernize our site:

1. Externalize your CSS on your index page.
2. Delete the css on your software page - link to your external CSS.

Making containers for your pages.

1. Div tag Container around index page. (Double check in code as well)
2. Customize it with a background, 800px width, border, center the DIV(like Halloween), and do the background color #FFFFCC
3. Div tag Container around Software page
4.New body background (Download a repeating background from the internet and make it your background.)

Finish your site and SYNCHRONIZE your site.

Keep working on 6HD site:

You can check out my site at mhsweb1.com

1. Add pictures to Software Applications - Get an image for Dreamweaver and Photoshop and put them in.
2. Chapter 3 - Add the content listed in Chapter 3 - Page 81-87
3. Put a link for each picture to an outside website. (Doesn't matter where) in the text on both the hardware and software page.
4. Upload your site (follow the instructions on your FTP-Worksheet).
5. If time. start tomorrow's work.

IF TIME PERMITS - DO THE FOLLOWING:

OK - you have 2 choices
1. Make 4 Manga characters that will represent you on your site using the links below. Put them in your stuff folder as Manga Characters. Of course, it should look like you as much as possible.

2. OR Make your Manga Characters at home TONIGHT and work on your website.

Try the following sites to make your Manga Character - some are better than others, but you have a choice - you only need to make 4 different characters.

Possible sites to use:
1. FaceYourManga ( I like this one!)
2. Avatar Maker
3. Rinmaru Some wierd choices and a little strange, but why not?
4. AvaChara
5. Cartoonify Nice one here
6. Scratch Not my favorite, but here you go...
7. Dolldivine meh

Make 2 using any of the sites, I like the first two better. Save them to a new folder in your Stuff folder called MangaIcon.

SHORT QUIZ (15 Questions - use JUST your brain!) on Socrative - Log into ANGOVE room.

Looking for a video? Check HERE!

OK - three plans today:

1. Take a short 15 question test - Log into Socrative (Class name ANGOVE)
2. If you are behind - work on late/missing work - especially your website.
3. IF you are on schedule - do some extra credit below OR Relax - work on something else.

Your video is HERE

Your Files are --> PS-Taxi Why so Blue? HERE this is what we are trying to create HERE.

Put this into a folder called PS-Taxi inside your PS folder.

7th Period
Manga Characters
NO TEST

OK - three plans today:

1. If you are behind - work on late/missing work (feel free to ask me).
2. IF you are on schedule - continue with your extra credit below
3. Relax - work on something else.

PS-Taxi # 2 - adding filters.
Your PS-Taxi video is HERE.

Use your finished Blue Taxis to do the following:
1. Make 8 different copies on new layers.
2. Use the filters to put a different effect on each.
3. Export the different images to a folder. (PS-Taxi1.jpg, etc.)

LATER - need to do this with me OR you can try it yourself HERE.
4. Open the images in Picasa to make a collage. PS-Taxi-Collage move it to your Taxi folder on your desktop.
5. Movie as well if time AND webpage.
6. Move all finished products into your PS-Taxi folder.
7 Back up your work before you leave.

THANKSGIVING

THANKSGIVING

THANKSGIVING

Chapter 5 Project - Creating a website/MissionStatement/ Sketch

Chapter 5 Project HERE- Think about a wesite that you might want to design (We might turn this into your semester exam!!) while you do the worksheet.

Start Chapter 5 (Pg. 148 is REAL important)

SHOW ME YOUR PS-TAXI for extra credit.

Finish your Chapter 5 Project

Chapter 5 review Self-Review (Not graded, just for checking up.)
E=Review Self-Check
Review at home using PowerPoint 

Set up Chapter 6 website (7LC - Seventh website Bike and Hike)

.Page 172 - keep working on your website. We are making this site a DIV site - they are doing it the old way by using tables (Page 175 which we won't do).

Set up 7th website Language Club with DIV tags.
(7-LC is the name of your site)

Link to Dreamweaver Lessons HERE.

Start your 7LC website - if you cant do it - complete chapter 5 and 6 lesson reviews -- Chapter 5 Read through the chapter and answer THESE questions.

chapter 6 end of chaptrer questions

Set up your new site in DW - 7LC in your local sites folder then start with this video. Review your notes for how to set up a new site.

Part 1is your assignment today.

Chapter 6 - Review the set up and start making the template site.

Work starts on Pg. 172 - Remember this is an old book - so some thigns won't be accurate. If not complete - Finish the main design from Chapter 6.3-4

Part 2 is your work for today.

Part 3 work for today.

Chapter 7 Selecting and Designing Color.

Make the pages and go through chapter 7 to do so - make sure you read sections and see if you can answer the end of section questions. (You do NOT need to write anything down, but see if you can answer them anyway.)

Link to HTML Video lessons HERE
Link to Dreamweaver Lessons HERE
Link to Photoshop Lessons HERE

Looking for a video? Check HERE!

Part 4

7.1 - A See if you can do this
7.1 - B - DO NOT DO THIS
7.1 - C - Put in your headers

7.2 - D Make your Main section white - Not just the content.
7.2 - D Do NOT make the bodytext region - just put the information in the content region under the picture.

7.2 - E DO NOT do.

Page 216 1-2 - follow the instructions.#1 Put the table shown on your About Us page but put your friends names in it.

Pg. 217 #1 Fundraiser Page on page 217. Don't forget to link up the fundraiser page through the Events Page.

*** Remember, we altered the basic structure, so fit it into what we created. There are a lot of font changes, you do not need to do those, as you need to make a new CSS rule so just put the information on the site. 
Upload your site today - what ever you have done so I can check it. You might want to put YOUR real e-mail in the footer so I can contact you if necessary.

IF YOU ARE HAVING SERIOUS ISSUES - remember, this is only a 4 page site. Look at the page and put the information on your site. ALSO complete Chapter 6-7 end of chapter questions (ONLY if your site is bad!)

Part5 finish and upload your site

UPLOAD YOUR SITE AND MAKE SURE IT WORKS.

If you missed anything - check out my Video Page at the bottom of the page.

Serif vs Sans-serif

Check my site out HERE to see it yours matches up.

New Site - Create a 1 page site- 8-Manga

Make a site that showcases your Manga characters and your PS-taxi if you did it.

You don't need to sketch out your site BUT if you have problems and want some help, I will be asking for it.

HERE (Word 28K) is your rubric that I am using to grade you. You do NOT need to turn it in for this site.

SITE IS DUE AT END OF CLASS!!!!

Semester Exam Review HERE or PDF HERE This is a sample of the type of questions that I will use on the test. The day of your Semester Exam you will have a 55 question M/C test.

SUGGESTED HOMEWORK (To set yourself up for success.)
1. Go to Paletton and get some colors for your site. Make sure they are appropriate for your subject.
2. CoolText.com - Make banners for each of your pages.
3. Find pictures for your site. (1 Minimum each page 2 are better)
4. Find appropriate text for it. (Copy and paste, just not from Wikipedia.)

________
Link to HTML Video lessons HERE
Link to Dreamweaver Lessons HERE
Link to Photoshop Lessons HERE

Looking for a video? Check HERE!

SEMESTER EXAM
Your semester exam is 2 parts - 200 points for your website and 100 points for your MC test on the exam day.

Here are your instructions for your 9-SemExam website HERE. Your rubric for grading yourself is HERE. You will get a paper copy as well.

Hope you did your homework over the weekend to set yourself up for success.

HINT: You should be just working on your first page.
DW - Sketch site, connect in DW, make your site, div tags, paletton colors, edit CSS
PS- make banner, edit images - keep it basic.

Work on your site

HINT: You should be just working on your first page.
DW - Make your first page perfect and when done - copy and paste to make your pages.

Work on your site

HINT: Make all your pages - put basic content in.
Test upload?

Work on your site

HINT: Almost there - site due tomorrow.
Test upload?

Work on your site

HINT: Get your Rubric and grade yourself. Turn it in today - IF you do not, you can still turn it in late, but there will be points off 10Points per class day.

Turn in your rubric TODAY - 100% MUST BE IN TODAY. LATE PENALTY IF NOT TURNED IN!!!!!