Web Design Class

Assignments

(a flash drive is recommended for this class)

Syllabus

CODE ACADEMY

 

Dreamweaver

 

World's worst website!

Cool Text

Color combinations

Optical Illusion

w3schools.com

Crazy websites

Website analyzer

 

Assignment #1
Me.html.....create an html page all about you, using the skills in group "A"

Assignment #2
Friends.html.....create an html page all about your friends and/or family, using the skills in group "A and B"

Assignment #3
California.html .....create a web page that is an ad for visiting Southern California, using the skills in group "C" at least 5 items from group A and B.

Assignment #4
Crazy.html Create a unique website using your creativity...I'll give you some clues in class what I am looking for. use any concepts we have learned so far.

Assignment #5
Productpage.html Create a Website that promotes a product. Make sure ot use the 4 elements of a display ad (illustration,headline,content, and signature/logo)

Assignment #6
TBA

-------------------------------------

Group A
-insert table
-change background colors
-change cell background color
-insert text and center it
-insert text and make it a link
-insert image and center it
-insert image and make it a link
-insert rolloverimage
-insert roll over image and make it a link to a website OR another page in your folder.
-insert email link 

Group B
-named anchor
insert AP DIV

Group C
-insert Spry menu bar (3 tabs)
- insert spry tabbed panels (3 tabs)
- insert spry accordian (3)


Group D

-Insert background image

FLASH Lessons

Assignment #1
the bouncing ball (25 frames)

Assignment #2
create a walking stick figure (25+ frames)

Assignment #3
create a person bowling, with ball and pins. for extra credit, add depth to the animation.

Assignment #4
Celebrity picture edit, lassoo. Take a picture of a celebrity and put it in two frames. In the second frame, select the picture using the selection tool, then right click on the picture, click "break apart". Then in the tool bar, use the lasoo tool to cut something out or move a part of the celebrity's body. When you play it, you get "motion"

Assignment #5
motion tween, shape tween and animation path. Create one of each.

Assignment #6
Copy the Valencia Banner on the front of the homepage, and create a special day banner for the home page.

Assignment # 7
Flash buttons and making quizzes and games

Assignment #8
Arrow keys to move an object

Assignment #9
rotating spheres

Assignment #9.5
Making it SNOW! Create a background and make it snow. You can change the actionscript to make it snow in different places. Make sure to change the frame rate to make it snow faster.

Assignment #10
Smiley face

Assignment #11
Making pictures fade in and out

Assignment #12
Zoom in and out effect

Assignment #13
Game Design.....design a game using flash, see online tutorials.....
AVOIDER

Assignment #14 Scoring system

Assignment #15 FLASH GAME DEVELOPMENT

Another good http://www.emanueleferonato.com/

Assignment # 16 FLASH 3D tutorials

Assignment #17 Create a drag and drop for placesettings

(or this one)( or use this one)

PACMAN CONCEPT

Flash Explained website

Balloon game for flash

JUGSAW PUZZLE TUTORIAL

FLASH GAME TUTORIALS

Avoider Game tutorial

Samples of flash

Tutorial5Flash tutorials

IDEA GENERATOR

http://producten.hema.nl/

Animator versus animation

animator_vs_animation_2/

Tutorialized.com

Halloween Pumpkin Carving

Flash insider.com

Music to Flash File

Flash game tutorials

inflashstudios.com

This link has a part at the bottom that might help with the "avoider" part http://www.adobe.com/support/flash/action_scripts/actionscript_dictionary/actionscript_dictionary534.html

Assignment #1 Drop down menus using hot spots. After the lesson, create a 3x3 drop down menu.

Assignment #2 Attach words to a line. First, selest pen tool. In properties box, select "none" next to color selection box. Then create a line, with several "stops" or pivot points (say 5), and hit enter. Click on text tool. Create a sentence for the line. Click on pointer tool, Hold down shift key, and select both the words and the line. Both should be surrounded by a blue line after being selected. Go to the "text" menu at top and click on "attach to path". The words will attach to the line. If they do not To the right of the justification symbols is an "a" with a line above and below it. Clicking on this will allow you to stretch the words all the way around your object.
Now in a new document, take a picture of a person or animal, and create a list of words around the outside of them that discribe them. Save as "attach Words

Assignment #3 Animated gif. (for the teacher portion), see online pictures of Elijah, available I drive: go to Vastuo1 (:I drive).then.. students, common, mifflin, animate gif)

Assignment #4 Picaso: Using only different shapes (no circles, no lines, no dots,) create a face. Ad color.

Assignment #5 FREEFORM: Use one shape and use the free form tool to distort it into an animal (any animal)

Assignment #6 Fireworks Lessons in one file, apply all the TEXT affects from the website link at the front of this sentence.

Assignment #7 Fireworks Lessons in one file, apply all the IMAGE affects from the website link at the front of this sentence.

Misc.

3D text effect maker

SLICE TOOL Lesson

Learn about file types

 

 

FINAL PROJECTS

DO YOU HAVE A FLASH DRIVE? YOU MIGHT WANT ONE NOW!

(quality, quality, quality!) You will have at least one week for each project.

1) Music video, 30 seconds or longer, make sure to use appropriate music, music must be in mp3 format to imbed in flash file.. Must have continuity.

2) Rube Goldberg style flash. Create your own story board, or use any existing webpage to create a Rube Goldberg style page.Click here for example. and here is an example also. It must have at least 6 steps!!!!

3) Something that helps enhance the ValenciaVikings.com website. A web page, a flash animation, update an existing section or create a new section.

4) Create a flash game with actionscripts. You can use tutorials off the internet, but must show me for approval before starting. EXAMPLES listed here under AS3 and AS2.