Graphics for the Web (CGR-205)

Syllabus Addendum

CGR-205 logo

Course Information

Instructor:
Brandon Rubenstein, M.Ed.
Phone:
215-460-1040
Email:
brubenstein@faculty.camdencc.edu
Class Meetings:
Monday (10:00 AM to 1:20 PM)
Office Hours:
By appointment
Prerequisites:
CGR-113 (Web Page Design I)

Course Websites:

All course materials will be posted to and submitted through the Edmodo site. Please check this site and your Camden County College email account on a regular basis for course announcements and communications.

Course Materials

Required Materials:

The Principles of Beautiful Web Design, 2nd Edition

Author(s):
Jason Beaird
Publisher (Date):
SitePoint (December 5, 2010)
ISBN:
978-0-980-57689-4
Link to Required TextbookLink to Required Textbook

Digital Media Storage

USB flash drive, portable hard drive, online storage, etc.
 
Link to Kingston USB flash driveLink to Kingston USB flash drive

Recommended Texts:

Adobe Fireworks CS5 Classroom in a Book

Author(s):
Adobe Creative Team
Publisher (Date):
Adobe Press (July 3, 2010)
ISBN:
978-0-321-70448-1
Link to Adobe Fireworks CS5 Classroom in a BookLink to Adobe Fireworks CS5 Classroom in a Book

Adobe Creative Suite 5 Web Premium How-To's

Author(s):
David Karlins
Publisher (Date):
Adobe Press (August 2010)
ISBN:
978-0-321-71986-7
Link to the Adobe CS5 Web Premium How To bookLink to the Adobe CS5 Web Premium How To book

Visual Design for the Modern Web

Author(s):
Penny McIntire
Publisher (Date):
New Riders (November 2007)
ISBN:
978-0-321-51538-4
Link to Visual Design for the Modern Web bookLink to Visual Design for the Modern Web book

The Web Designer's Idea Book

Author(s):
Patrick McNeil
Publisher (Date):
How (October 2008)
ISBN:
978-1-600-61064-6
Link to the Web Designer's Idea BookLink to the Web Designer's Idea Book

The Web Designer's Idea Book, Vol. 2

Author(s):
Patrick McNeil
Publisher (Date):
How (September 2010)
ISBN:
978-1-600-61972-4
Link to the Web Designer's Idea Book, Vol. 2Link to the Web Designer's Idea Book, Vol. 2

Composition book (graph ruled), Sketchbook, or similar notebook

To record thoughts, ideas, and sketches
Link to graph ruled composition bookLink to graph ruled composition book

Course Policies

Lecture Attendance:

Students are expected to be present and on time for class. Attendance is necessary for the best learning experience. Students are expected to attend all classes and strictly adhere to the project due dates. Students are responsible for obtaining any information or class work that is missed during any absence.

Students are allowed one unexcused absence. If a student has more than one unexcused absence, his or her grade for the course will be reduced one letter grade. If a student has three absences, he or she will not get credit for the course.

Note that an excused absence is defined as one that is the result of a condition or circumstance beyond the student’s control, such as illness, family crisis or emergency, or some other serious and important personal circumstance. An absence will only be excused if there is documentation verifying the circumstances that caused the absence.

Reading:

Readings are assigned to correspond with each week’s lecture. Students are expected to complete each week’s assigned readings before the next class session. Readings are intended to supplement classroom lectures; quizzes and projects will assess knowledge acquired from both lectures and readings.

Religious Holidays:

If you will be observing any religious holidays this semester that will prevent you from attending a regularly scheduled class or interfere with fulfilling any course requirement, you will have an opportunity to make-up the class or course requirement. You must make these arrangements by informing your instructor of the dates of your religious holidays within two weeks of the beginning of the semester.

Cell Phones and Computers:

Cell phones, pagers, and any other electronic devices must be turned off during class unless your instructor grants special permission. Texting during class is not acceptable. Computers may be used only for classwork; checking e-mail and other internet use is not acceptable during course period. Students who disregard this policy will be asked to leave class for the day.

Sleeping during Class:

Attention and participation are an important component of this class. When students sleep during class, they do not participate and miss important information. Sleeping during class will not be tolerated. Students who disregard this policy will be asked to leave class for the day.

Responsibilities and Expectations

Student Responsibilities and Expectations:

  • Attend all classes
  • Use formal writing and language in all emails to me (this means complete sentences, correct spelling and grammar; no “text” language, i.e. =) or TTYL!)
  • Care about your work
  • Make progress in the medium
  • Help, cooperate, and collaborate with your classmates
  • Take risks
  • Make mistakes
  • Ask for help

Instructor Responsibilities and Expectations:

Just as I have certain expectations for you, I hope you have expectations for me. As your instructor, I will adhere to the following guidelines:

  • You will be treated with respect and professionalism.
  • I will come to class prepared and make every effort to make each class a valuable learning experience.
  • I will be accessible to you. I am always happy and willing to meet with any student.
  • I am available to help you review course material, understand assignments, or prepare for tests. Please attend office hours or make an appointment outside of office hours if you need extra help.
  • I will happily discuss grades with individual students up to one week after the assignment or quiz is returned.
  • I will return all graded material in a timely manner.
  • I will respond to all student emails and contact within 24 hours of receipt.

Course Format

Each class session should run as follows:

  • Lecture
  • Group discussion and/or assignment review
  • Walkthrough – a software tutorial of Adobe Fireworks
  • Tools of the Trade – reviewing software, plugins, and tools used in web design
  • Overview of next week's assignment

Course Projects

Project 1: Identify a 'Bad' Website

Project 1 requires you to identify and analyze two websites that you think should be redesigned. The websites should be 'bad' websites according to the principles of beautiful design that we discuss in class. You will justify your choice of sites by explaining the principles each site violates. Group discussion and review will be used to select one site for focus in Project 2 and the Final Project .

Project 2: Site Redesign Wireframe Pitches

Project 2 requires you to pitch your ideas for redesigning the site selected in Project 1. Your pitch will include wireframes of your proposed redesign of the site with justification given for design choices that apply the principles of beautiful design discussed in class. The wireframes should be simple in appearance with detailed notes.

Final Project: Prototype of Redesigned Site

The final project will be a complete, interactive prototype of your redesigned site. The prototype will include content, color, and be ready for converting to a live site using HTML/CSS in a future course. All graphics should be created in Fireworks, include optimized graphics, and apply the principles of beautiful design.

Grading Policies

NOTE: All projects must be submitted via Edmodo. If you do not submit homework and projects via Edmodo, you will receive 0 (zero) points for each missed submission.

Assignments up to 1 week late are graded down 50%. Assignments more than 1 week late will not be accepted.

Attendance/Citizenship:

Points in this category will be granted based on attending class and participating in group discussions and assignment reviews. Each class is worth up to 12 points.

Homework:

Homework assignments are based upon skill set covered in that day’s tutorial and will be due by 11:59 PM the night before the following class. Each homework assignment is worth up to 15 points. Each homework must be .zip’ed and turned in via Edmodo.

Box Outs:

Each class session will begin with a Box Out exercise designed to kickstart your imagination and train your brain to work within constraints and deadlines. Each Box Out is due 20 minutes after class starts and is worth 10 points. Box Outs will not be accepted after the deadline.

Project 1:

The first project requires you to identify and analyze two websites that you think should be redesigned and justify your choices. Project 1 is worth 100 points and due Sunday, March 4, by 11:59 PM.

Project 2:

The second project is your wireframe pitch (sketches and notes) for the redesign of a site selected in Project 1 by applying the principles of beautiful web design. Project 2 is worth 160 points and is due Sunday, April 1, by 11:59 PM.

Final Project:

The final project is to use Adobe Fireworks to create a prototype of your redesigned website that uses optimized graphics and applies the principles of beautiful web design. The Final Project is worth 250 points and is due Sunday, May 6 at 11:59 PM.

The final course grade will be based on a potential of 1000 points.
Activity Possible Points
The final course grade will be based on a potential of 1000 points
Attendance/Citizenship 165 points
Homework 195 points
Box Outs 130 points
Project 1 100 points
Project 2 160 points
Final Project 250 points
Total 1000 points
Grades will be assigned using the percent ranges listed below.
Letter Grade % Range
Percentages will be determined by dividing total points earned by 1000.
A 90.00 or above
B 80.00 to 89.99
C 70.00 to 79.99
D 65.00 to 69.99
F 64.99 or below

College Policies

Academic Honesty Policy:

As stated on page 18 of the 2011-2012 Student Handbook, “All students are expected to do their own work. All forms of academic dishonesty are absolutely forbidden. Students who cheat, plagiarize or commit other acts of academic dishonesty will be subject to immediate disciplinary action. This may result in an automatic grade of F for an assignment and/or for the course. Academic dishonesty also may be subject to additional penalties as determined by the College in accordance with sanctions for violations of the Student Code of Conduct. (See page 41 of the 2011-2012 Student Handbook.)”

Instances of academic dishonesty, such as cheating and plagiarism, will be dealt with appropriately.

Copyrighted Material Policy:

As stated on page 47 of the 2011-2012 Student Handbook, “Computer software, documents or files protected by copyright are not to be copied from or into any College computing resources except as permitted by law. Additionally, the number of copies and the distribution of copies must adhere to copyright restrictions and/or provisions.”

Adhering to copyright laws is of particular importance in this course due to the nature of web design and publishing. All material in student projects and websites must be original material generated or created by the student.

Disability Services:

The Disability Services Office provides academic support services for Camden County College students with physical, visual, psychiatric and learning disabilities. Since 1988, the office has assisted thousands of students with academic advisement, career counseling, tutoring, readers, scribes and program accommodations. The office also sponsors selected bridge sections of basic skills and college-level courses.

Camden County College is committed to complying with the spirit and the letter of legislation, including the Americans with Disabilities Act (ADA) and the Rehabilitation Act of 1973: Section 504, which is listed on page 29 of the 2011-2012 Student Handbook.

For further information, contact Director Joanne Kinzy, at (856) 227-7200, ext. 4430, or visit the Disability Services Office in the Otto R. Mauke Community Center, Room 100. For more information on physical and program accommodations, consult the Camden County College Disabilities Guide available through the Disability Services Office, the Program for Deaf and Hard of Hearing Students, Otto R. Mauke Community Center, first floor in Blackwood, (856) 227- 7200, ext. 4506; and the Compliance Office, Wilson Hall West Room 102, in Blackwood, (856) 227-7200, ext. 4752.

Course Drop Policy:

The process of removing a course from a student schedule can be done prior to the start of classes for the session enrolled or during the ADD/DROP (schedule adjustment) period. Refer to page 17 of the 2011-2012 Student Handbook for more information.

Acknowledging Conditions and Obligations in Syllabus

This syllabus is intended as a guideline. It is the prerogative of faculty members to change the course during the term at his/her discretion in the interest of responding to an individual class need. If a change is made to the course, communication will be made in several ways – via Emodo, in class, email, and a revision to the syllabus if needed.

Course Outline

All assignments are due the following Sunday at 11:59 PM.
All readings are to be completed in preparation for the next class.

All assignments must be submitted according to the instructions above.
Red assignments or readings were updated after class discussion.
Date Topic Reading Assignment
All assignments must be submitted according to the instructions above.
Wk 1 - Jan 23 Introductions, Review of the Syllabus Web Design History Purchase Required Course Materials
Web Design History Reaction
Due 01/29/12
Wk 2 - Jan 30 How the Web Works
Graphics Principles & Terminology
Copyright Laws & Protection
Imagery
Ch. 5, PofBWD (pp. 153-189)

Due n/a
Wk 3 - Feb 6 Imagery
Image Formats for the Web
Acquiring Images
Layout & Composition
Ch. 1, PofBWD (pp. 1-41)
Screenshots of Beauty - Obtain URLs
Due 02/12/12
Wk 4 - Feb 13 Layout and Composition Color
Ch. 2, PofBWD (pp. 43-79)
Screenshots of Beauty Part II
(Fireworks Imagery and Layout Pages)
Due 02/19/12
Wk 5 - Feb 20 Color Texture
Ch. 3, PofBWD (pp. 81-115)
Color/Layout and Kuler
Due 02/26/12
Wk 6 - Feb 27 Texture Ultimate Guide to Website Wireframing

Web Design Criticism: A How To
Bad Website Identification (Project 1)
Due 03/04/12
Wk 7 - Mar 5 Review of Project 1
Site Analysis & Target Audience
Wireframing Overview
Planning & Implementing Navigation

Horizontal Navigation Menus: Trends & Best Practices

The Case Against Vertical Navigation
4 Concept Sketches
Due 03/19/12 (bring to class)
No Class - Mar 12 Spring Break
Wk 8 - Mar 19 Navigation, Buttons and Menus
Graphic Hotspots
Typography
Ch. 4, PofBWD (pp. 117-151)
Detailed Sketches - Home & Interior
Due 03/26/12 (bring to class)
Wk 9 - Mar 26 Typography How Banner Ads Work (Sections 1 - 6, 10)

Seven Best Practices of Creating Banner Ads

4 Things to Avoid When Creating Banner Ads
Site Redesign Wireframes (Project 2)
Due 04/01/12
Wk 10 - April 2 Review of Project 2
Banners
Image Rollovers
How Web Animation Works (Sections 1 - 4)

Learning Web Design Animated GIFs
(PDF of chapter from 2003)
Rollover Banner
Due 04/08/12
Wk 11 - April 9 Animation Graphics
Using Multimedia
None assigned Animated GIF
Due 04/15/12
Wk 12 - April 16 File Compression & Optimization
Slicing & Exporting Graphics
None assigned Site Mockup
Due 04/22/12
Wk 13 - April 23 Adding Interactivity
Graphics Checklist
Preparation for Final Project
  • Preliminary Review
TBA Rough Draft of Prototype
Due 04/29/12
Wk 14 - April 30 Optimizing Graphics for Mobile
Preparation for Final Project
  • Preliminary Review
Course Summary
Redesigned Site Prototype (Final Project)
Due 05/06/12
Wk 15 - May 7 Final Project Critique
  • Presentation of Redesigns