All
assignments are loaded onto a Web server, where
they will be viewed and graded online. Due dates are
midnight Pacific Standard Time.
Late work will be accepted
one week after due date, and
a 20% deduction will be imposed.
Late work will not be graded
unless student sends instructor
an email with URL for late
work.
If you have problems with FTP or the online forms send email to lhemenway@santarosa.edu
In grading your work, some points will be assigned for completing the assignment, additional points are awarded based on the appropriateness of the design decisions. A student who completes all parts of the class assignment is guaranteed a C in the course. Grades of A and B are made based on the aesthetic and usability of the design. The instructor is happy to make suggestions for improvement and offer design suggestions to students before the due date of an assignment.
Lesson
1:Check
in and Introduction
|
| Check
In part 1 |
Submit
Form | Due
8/26 | _ |
WELCOME |
| Student
Introductions Form |
Submit
Form | Due
8/26 |
10
Points |
Classmate
Introductions |
| Please
check in by this date.
Share with me and the class
a little bit about your goals for the class
, your experience
with computers, Photoshop
and design on the introduction
form. |
| Submit
Homework page |
Submission
Form | Due
8/29 | 10
Points |
Classmate
Examples |
This
homework page will
contain a list of the assignments
which you will complete
during the 8 week course.
Once you have
completed an assignment the item on the list will become a link that takes us to that particular assignment.
The purpose of creating this
"homework page" is to give you
a chance to practice
loading a file onto the "student" server,
and to give me a chance
to create a "class
homework page" where
I have links to everyone's individual "homework page".
Here
is an example of how
the page should look.
Please name the file "homework.html" and
place it in a folder
on the student server
named "webdesign". |
| Install Firefox Web Developers Toolbar |
class message board |
Due
8/29 |
10
Points |
class message board |
| Follow the instructions provided on the DVD to install the Firefox Web Developers Toolbar. Use it to analyze 1-2 Web sites. then post your comments on this tool at the class message board. You will receive 10 points for providing your feedback on this tool. |
Lesson
2: Formats
Step by step explanation of how to complete the format assignments
|
| Formats
Lesson |
Due 9/5 |
30pts |
Student
Work |
Photo
saved as JPEG and PNG [10]
A photograph will
be saved with the
following optimization
settings to produce
8 images:
JPEG -
Low, Medium,
High, Very
High, Maximum
PNG - 256 , 64, 16 color
Please list the format and the size of the image in K
Clip
art saved as JPEG
and PNG [10]
The clip art will be saved with the following
optimization settings to produce 6 images:
JPEG - Low, Medium, High
PNG - 64, 16, 8 color
Please list the format and the size of the image in K
Transparency
Sampler [10]
Create a simple clip art image or shape
and then save the image without any transparency in the PNG format,
then create a copy of that image as a
PNG transparent image, Save it again
as a GIF transparency matted to white,
finally save the image again as a GIF
matted to black.
Display
all 4 images in 3 tables,
one table has a white
background, another
with a color of your
choice as the background,
and the final table
has a black background.
|
Lesson
3: Client #1
Read the step by step explanation of the assignments for this lesson |
| Client #1 analysis | Due
9/12 |
30
Points |
Student
Work |
Please create the following documents which will help you understand the structure of the "client #1" template, also known as design 121.
Div tag colorized - "index-div.html" [10 pts]
CSS explanation page -"css-explain.html" [10 pts] (please explain all the CSS, even the styles that apply to the second level pages.)
Images for the site - "images.html" [10 pts] |
| Color Options |
Due
9/12 |
10
Points |
Message Board |
This week you will begin your designer sampler, which is a web page that links to Web examples you use with clients and use as sources of inspiration.
Refer to the homework explanation page for details about the sampler.
Once you have created this page, visit the class message board and post your Sampler URL and tell the class what you learned from this assignment. |
Lesson
4-5: Images/Color
Read the step by step explanation to complete the assignments for this lesson
|
| Images / color
Lesson | Due
9/26 |
70
Points |
Student
Work |
You have 2 weeks to complete this lesson.
In this lesson you will be modifying the images and color for "client #1", you may either keep the subject of the site as an interior design site or change the subject of the site.
You will turn in the following items:
A jpeg which shows the modified PSD file which was the basis of your design
[10 pts]
The home page which is created using HTML, CSS and images which are saved in the JPG, GIF or PNG format. [30 pts]
2 versions of the second level page which are built using HTML, CSS and images which are saved in the JPG, GIF or PNG format. [20 pts]
Select an image which needs to be modified (cropped, lightened, red eye removed, color adjusted, etc.) Create a Web page which displays the original photo and then the adjusted image, include an explanation of how you modified the image. [10 pts] |
Lesson
6: Client #2
Read the step by step explanation of how to complete this assignment |
| Client #2 |
Due
10/3 |
30
Points |
Student
Work |
Please create the following documents which will help you understand the structure of the "client #2" design. On the DVD I selected design 123, however each student will select their own design, choosing from designs 120-140 in our textbook.
Div tag colorized - "index-div.html" [10 pts]
CSS explanation page -"css-explain.html" [10 pts] (please explain all the CSS, even the styles that apply to the second level pages.)
Images for the site - "images.html" [10 pts] |
| Photo Analysis |
Due
10/3 |
10
Points |
Student
Work |
Add to your designer sampler by including examples of sites that have used photos in a way you find inspiring. [10 pts]
See homework explanation page for a more detailed description of the assignment.
Once you have created this page, visit the class message board and post your Sampler URL and tell the class what you learned from this assignment. |
Lesson
7-8: Modify Client #2
Read the step by step homework explanation for this lesson |
| Images / Color
Lesson |
Due
10/15 |
60
Points |
Student
Work |
You have 2 weeks to complete this lesson
A jpeg which shows the modified PSD file which was the basis of your design
[10 pts]
The home page which is created using HTML, CSS and images which are saved in the JPG, GIF or PNG format. [25 pts]
2 versions of the second level page which are built using HTML, CSS and images which are saved in the JPG, GIF or PNG format. [10 pts]
Linked
Text Sampler [5 pts]
Create a web page with 5-7 text links,
then create at least 5 copies of those
links. Assign a unique hover effect to
each copy.
Horizontal
Navigation Bar Sampler [10 pts]
Create a horizontal navigation bar which
displays an image as the background,
another image during hover, and one final
image for the current page. Then make
2 more copies of this navigation bar,
and modify the image for each copy. |
| Classmate
Critique |
class message board | Due
10/16 |
20
Points |
class message board |
You will be critiquing the classmate directly below you on the student work page. If you are at the bottom of the list, critique the student above you.
Evaluate the "client 1" and "client2" designs. Remember,
this is going to be posted
for everyone to read, so
be constructive in your
comments.
This assignment
is meant to encourage dialogue.
If a classmate has achieved
an effect that you are
curious about, this is
the time to inquire about
it. |
Class Evaluation |
class message board | Due
10/16 |
10
Points |
class message board |
| Please list areas of the class that worked well for you as well as areas taht were confusing or need to be improved. Thanks so much for your efforts. |
|