Art/CGI 221 - 81

Class 1 - Mon Aug 29 [ top ]

1. Syllabus Review
2. Imageready Intro
   Layers
   Basic Shapes
   Saving Photoshop Files
   Saving your files into a CD
3. Intro to html
   CLASS PROJECT ONE: Creating a simple index page with html. This page will have links to each class projects and homework assignments.

Homework 1:

State the objective of your future midterm site. Answer the following questions.

1. What's the general description of the site? i.e. retail sales, portfolio, family newsletter, etc.
   
2. Who is your target audience? i.e. students, designers, architects, lawyers or friends.
   
3. What will be the content of the site? Specify the different areas of information. i.e. introduction, services, portfolio and prices.
   
4. Email this homework to lehman students@yahoo.com Please specify your class section and your name in the subject of your email. Also keep this information handy for next class. You should email this info to yourself too. Do not attach a word document. The computers in the lab don't have microsoft word. We will make this document an html file next class.

SEPTEMBER 5, 2005 LABOR DAY

Class 2 - Mon Sep 12 top ]

1. Imageready Review
2. Optimizing graphics as JPEG and GIF.
3. Introduction to HTML. Make sure to have the answers for the homework questions. We would make an html document with the info of your homework.
4. Getting Free Geocities account.

Homework 2:

1. Design and optimized 2 different graphics. The size of each of your images should be about 400 pixels width and 300 pixels height. Your design might be abstract. Make sure to save your original file as psd.
2. Optimized each of your images. Save them either as jpeg or gif files.
3. Create a simple html document and make sure to add these images to it. Name the html file homework2.html.

Class 3 - Mon Sept 19 [ top ]

1. Opening a free geocities account
2. Uploading the homework html files
3. Introduction to html tables
4. Using a mask in Imageready

Homework 3:

1. Make a list of 8 websites you like. Include a sentence for each URL describing what you find attractive about the site. This homework should be in html format. You will upload this file to a server location next class.
   Example: homework3a.html
2. Visit the Hex color link to read more about color and pick the hex numbers for the colors that you would like to use for your future midterm website. Create a page displaying the colors that you want to use for your future midterm website. This page should show the colors for you background, link, active link, visited link and text.
   Example: homework3b.html

Class 4 - Mon Sept 26 [ top ]

1. Gif transparency
2. Creating a page that will link to all the homework files.
3. Designing a graphical navigational tool with imageready. This will be use at the beginning of second level pages. Remind me to add a link to the homepage, I tend to forget un till the end.

Homework 4:

1. Design the graphical navigation tool you would like to use in your midterm project. You may change your mind about the look of it later on. Implement the colors you picked for homework 3b. Not doing this homework will delay the completion of your future midterm project.

OCTOBER 3,2005 NO EVENING CLASSES SCHEDULE
OCTOBER 10, 2005 COLLEGE CLOSED

Class 5 - TUESDAY Oct 11 [ top ]

1. Adding a rollover effect to your graphical navigation tool.
2. Designing a homepage in Imageready and adding a hypertext navigation tool to it.
   
   click for here for NOTES

Homework 5:

1. Apply the rollover effect to the graphical navigation tool you created for
   homework 4.
2. Design the homepage for your midterm project.

Class 6 - Mon Oct 17 [ top ]

1. Populating second level pages with the proper information
2. Homepage design review.
3. Uploading your files to a server location and viewing them.

Homework 6:

You should be fully working on your midterm project by now. Make sure to create each of your second level pages and try to populate them as much as possible. Make sure your homepage has the look you want for you site.

Class 7 - Mon Oct 24 Open Lab [ top ]

There will be no lecture during open lab. Use this time to finish up your midterm website and to ask me questions. I will be spending individual time with each of you. However, you most make your business to make sure I get to answer your questions. Don't wait to ask your questions when there is only 10 minutes for the open lab to be over. If your site is completely done please make sure to upload it to your server location.

Homework 7:

Finish your midterm project. Maker sure all your graphics are properly optimized and all your links are functional.

Class 8 - Mon Oct 31 Midterm [ top ]

1. Uploading to a serve space and testing pages. Click here for Instructions
2. Midterm Presentation
3. Introduction to Dreamweaver / Defining your Root Folder

Related Links:

Define your site in Dreamweaver MX
http://www.ecommercetemplates.com/tutorials/dwdefine.html
Setting up a site in Dreamweaver
http://www.st-andrews.ac.uk/its/web/dreamweaver/dw031.shtml
Macromedia Dreamweaver: Basics, Layout & Site Planning
http://www.cbtcafe.com/dreamweaver/basics.htm
Dreamweaver Tutorials
http://www.dw-fw-beginners.com/tutorials/drmwvr/

Homework 8:

Collect the information necessary for the pages you will need to add to your final project.You will need to add two new pages to your site. Create these new pages in Dreamwever. If you will keep the same design from your midterm project, just add the new buttons to your psd file. You may also begin to create a new fresh design for your final at this point. Keep in mind that you will need to create a design that will allow remote rollovers. You should have one psd file for your homepage and another psd file for the navigation tool for your second level pages.

Class 9 - Mon Nov 7 [ top ]

1. Dreamweaver review / Defining your Root Folder
2. Creating a Navigation Tool
3. Creating Rollovers with Dreamweaver
4. Editing your html files with Dreamweaver

Homework 9:

1. Create a navigation tool with rollovers in Dreamweaver.

Class 10 - Mon Nov 14 [ top ]

1. Creating pointer rollovers- click for notes
2. Creating GIF Animations in Imageready
3. Designing Remote rollovers with Imageready

Homework 10:

Open the psd files that you had previously created for homework 8. These files should contain your edited or new design for the homepage and the graphical navigation tool for second level pages. Add remote rollovers to these two designs.

Class 11 - Mon Nov 21 [ top ]

1. Remote Rollovers in ImageReady CS - Review
2. Creating GIF Text Animations in Imageready
3. Creating Multiple-Event Rollovers in Dreamweaver

Homework 11:

1. Create two gif animations and add them to an html file.
2. Keep working with the remote rollovers for your homepage and the navigation tool for your second level pages. Begin creating each of your second level pages.

Related Links:

Remote Rollovers in ImageReady CS
http://www.heathrowe.com/tuts/remoterollovers.asp
Text gif animation
http://romeo-help4u.com/AA/tutorials/PS/index.php?page=ghostly

NOVEMBER 24 TO 27 THANKSGIVING RECESS

Class 12 - Mon Nov 28 [ top ]

1. Designing a Second level graphical navigation bar with remote rollovers.
2. Creating Image maps in Dreamweaver and in Imageready.
3. Introduction to Dreamweaver layers.

Homework 12:

1. Create an image map in Imageready. Make sure to create the html doc for it.
2. Create an image map in Dreamweaver.
3. Keep working on your second level pages. Make sure the design for your homepage is completely perfect and defined at this point.

Class 13 - Mon Dec 5 [ top ]

1. Imageready review - remote rollovers
2. Dreamweaver Review
3. Draggable layers

Homework 13:

Finish up the final look of your homepage. Add any necessary links and text to it with Dreamweaver. Tune up your second level page as much as you can.

Class 14 - Mon Dec 12 Open Lab [ top ]

Homework 14:

Finish your final site. Make sure to visit the link on final guidelines. Make sure your site contains all the necessary requirements.

Class 15 - Mon Dec 19 Final [ top ]