Theme: Webpage Development (Intermediate)
 

Prerequisite: Web Design 1, Flash 1

Description: Students are introduced to graphic design and photo manipulation using images obtained from the internet, hardcopy and digital capture devices (scanners, digital cameras).

Parameters: Access to a computer, software (MS FrontPage, FrontPage Video Files), scanner and/or digital camera.

Notes:  

You have 18 classes to complete this module.

In this class, time is of the essence and you will not have time to chat with friends, play games or do other assignments. You are allotted 1 class period for each day. If you fall behind, you are responsible for completing all module components outside of class time (before class, lunch, after school) or for homework.

You must NEVER flatten your final images unless specifically told to do so. If you do flatten the image, you will receive and “F” for the assignment.

All assignments are considered due at the end of the class on the due date. Assignments handed in after these times are considered late. All assignments handed in late will receive the following deductions. There are no exceptions.

1 day late – deduct 10%
2 days late – deduct 20%
3 days late – deduct 30%

More than three days late – 0% for the assignment (although the assignment will receive a grade of 0%, it must be completed in order for the student to receive credit for the module).

If the assignments are due on the Wednesday and are not handed in until the Saturday, this will be considered as one day.

Plagiarism or any other form of academic dishonesty will not be tolerated. Students caught trying to copy the work of others will receive an automatic “0%”, and be referred to the administration. In addition, the offence will be recorded in the student’s permanent file.

Grading: Grading your work is straight forward task for your instructors as rubrics are used for each and every assignment. Components for these rubrics dictate what grade you will receive in several specific areas. These component grades are then tallied up and a final grade for your assignment is recorded. Your grades are nonnegotiable.

MODULE OVERVIEW
 
You will create a new website on any topic that interests you. If you are wise, you will create one that will fulfill a presentation requirement in another class (World History, English, etc.). A number of the components from your webpage will require Flash animation so be prepared to switch back and forth between Flash and FrontPage.

Although there are no formal video tutorials for this module, you may want to use these selected videos as you work your way through your webpage.

Inserting Flash Content
Viewing the Code
Editing in Code View
Photo Gallery Component
 

ASSIGNMENT 1 - Splash Page

For your first assignment, you are going to create a 'splash' page to introduce your website. This will require you to create a 725 pixel wide x 400 pixel high Flash movie. It must be at least 10 seconds long before looping.

For a good example of a 'splash' page, click here.

• Open FrontPage 2003.

• Create a new table with the following parameters:

•  Inside your first table, create another table with the following parameters:

• Next, open up Flash and create your animation. It does NOT need action script so do NOT feel pressured to include it. The link into your website will be placed below the animation.

• Once you have finished your animation, place it in the folder for your new webpage.

• Insert the Flash movie into the 725 x 400 cell you created. You may want to change the background color of the page to match the animation.

Click here to see the the rubric for this assignment.
 

ASSIGNMENT 2 - Design Your Page

Before rushing out and creating your website, you need to create a brief hardcopy (paper) map of what it will look like. This doesn't need to be extremely detailed but it should follow these guidelines:

• One paper page for each website page.

• For this assignment, all graphics and text must be in separate cells.

• You need at least 6 individual pages.

• You need at least 1 photo gallery.

• You need to use a ruler to draw lines indicating different tables or cells. If the cells are invisible, use a dashed line.

• Indicate navigation buttons and where they are linked to.

• Indicate areas where flash will be present (you must have one different flash item on every page).

• Other than these parameters, it's open to your imagination. Have fun.

• Before you proceed to assignment sheet, let your teacher review your design and give you the ok to move on.

Click here to see the the rubric for this assignment.

ASSIGNMENT 3 - Page Skeleton

Using the hardcopy of your page as a guide, create the skeleton of your webpage in FrontPage. This will include:

• All pages to be included.

• The titles to the pages should be changed to reflect the content of the page.

• Formatted tables and cells.

• Links between al pages.

Click here to see the the rubric for this assignment.

ASSIGNMENT 4 - Button Creation

In Photoshop, you will create individual buttons that will be hyperlinked to navigate to and from each of your pages. The buttons must adhere to the following criteria:

• All buttons must be saved for web in Photoshop.

• Buttons must be saved as GIFs.

• All buttons must have a Screen Tip.

Click here to see the the rubric for this assignment.
 

ASSIGNMENT 5 - Photo Gallery

As you already know, one of your pages must include a photo gallery. To include a FrontPage Photo Gallery, click Insert > Web Component > Photo Gallery. As an alternative method, you may use Photoshop to create a gallery.  This method automates Flash scripting for you.  In order to use this method, open Photoshop and search the help files for more information.

 Note: Before you do this, make sure the pictures you want to included are in a separate folder in you webpage folder.

• For this assignment, you must use any layout.

• You must include a minimum of 8 pictures.

• Each picture must have a caption and description.

• The original pictures may be no wider then 600 pixels.

• The gallery page must open in a new window.

Click here to see the the rubric for this assignment.
 

ASSIGNMENT 6 - DHTML Assignment

You are to include at least one DHTML or JavaScript item on your homepage and two different scripts on other pages. You can find these on the internet. One good location for scripts is www.dynamicdrive.com.

• Follow the simple instructions that are exclusive to each piece of script.

• To get full marks, customize the script to your page. You'll have to pick an appropriate script to make these changes.

Click here to see the the rubric for this assignment.
 

Project 1 - Content Insertion

By now, you have completed all of the required components of your webpage. Although you may have already included some content, this is your chance to work in earnest to insert as much information as possible.

• Remember to follow all of the guidelines listed on Assignment 2.

Content Review

Have your teacher sit down and briefly review your site with you. You should:

• Take notes.

• Ask specific questions about how or what the site needs (Don't just ask "Is this an A?").

• Review all the the requirements of the site to make sure you haven't overlooked anything.

• You should take 5 to 10 minutes to review this with the teacher. After this, continue with your content and make the changes suggested by the teacher. Doing so will be part of your grade.

Project 1 - Content Insertion Part 2

By now, you have completed all of the required components of your webpage. Although you may have already included some content, this is your chance to work in earnest to insert as much information as possible.

• Remember to follow all of the guidelines listed on Assignment 2.

Click here to see the the rubric for this assignment.