Course Syllabus
Fall 2017 CpSc 337:  Introduction to Web Graphics 
Instructor: Dr. David Dailey

Meeting Time: 9:00 - 9:50   - MWF

Meeting Place: ATSH 224 .

Instructor's Office Hours

WF 8:00 - 9:00 , MWF 10:00-11:00 or by appointment.

Instructor's Office location: ATSH 248

Instructor's  e-mail

Course Description: This course will expose the student to the standards for Web and mobile graphics such as SVG, CSS, and canvas. Topics include color models, coordinate systems, coordinate transformations, and popular image formats. Covered are vector and pixel-based approaches as well as both declarative and scripted models of graphical content creation. Prerequisite: CpSc217, or CpSc 130 and 246. (3 credits) 

Course activities: Course is designed as a traditional lecture course: at instructor’s discretion materials may include handouts, projected material (web, transparencies, presentation software), class discussion, guest lectures, etc.

Required reading: Class web page found at

Recommended textBuilding Web Applications with SVG - Dailey et al, 1st edition, published by Microsoft Press

Computing labs: The class will primarily use equipment provided in the classrooms; other machines on campus may be used as well.

Software used:

Microsoft Windows
Web-browsers: recent versions of Firefox, Chrome, Safari, Opera and Internet Explorer
Web-authoring software:  Allaire HomeSite or Notepad ++ or equivalent (ideally, something that allows editing and preview of SVG)

Use of e-mail software is also required for most assignments (see below, under Assignments and tasks).

Method of determining final grade: Regular assignments: 30%; two quizzes,  each worth 20%; one final project: 30%.

Final exam:  The course will not have a final exam, but will meet at the regularly scheduled time (Friday Dec. 15th 8:00) as scheduled by the University. 

Attendance policy:  See Slippery Rock University's Attendance Policy

Late work: The grade on an assignment will be dropped by 10% if not submitted on time. Assignments more than three days late are not accepted without a physician's statement.

Make-up exams: It is the student's responsibility a) to notify the instructor beforehand if he or she must miss an exam due to illness, or family emergency and b) to take the initiative in finding a time suitable to the instructor for a make-up exam. Make-up exams should be scheduled within one week following the original exam date.

Academic Integrity: All academic work for this course must consist of your own work. See the University's statement on Academic Integrity . Though it remains the student's responsibility to read and understand the University's expectations here, I wish to emphasize the following excerpts from that statement:

"It is expected that students engage in the following pre-emptive behaviors:

The fact that this course is in Computer Science does not lessen the student's responsibility to make sure that work submitted for a grade is his or her own work. Again, from the University's statement on Academic Integrity:

The University gives many examples of academic dishonesty, including:

 Note that the University's statement on Academic Integrity also includes language pertaining to Intellectual Property law:

This is particularly relevant in computer science. Using someone else's code or programs is contrary to university policy and, in many cases, contrary to US and/or international law. There is utterly no reason you should ever have a physical or electronic copy of anyone else's assignment in your possession.  

Assignments and tasks: Each assignment will be explained in class. Any uncertainties students may have about an assignment should be raised at the time the assignment is made. Students will be required to use e-mail for certain assignments; assignments submitted via e-mail must follow the guidelines explained in class.

Several homework assignments will be given during the semester. Unless otherwise stated, these assignments are to be completed individually by each student. Students may be called upon to present and explain their work to the class or to the instructor and should be consistently and adequately prepared to do so.

As the semester progresses, additional details about assignments may be found on the class web page.

Tentative Schedule of Topics

Assignments shown may vary. Refer to lecture notes and/or course web-site for details.

I.     Overview of Web Graphics

II.     Programming review:  

III.     Web and mobile graphics:  

a.      Standards overview

i   SVG

ii CSS

iii    <canvas>

b.     Color Models 

i   RGB


iii    CIE

iv    sRGB

c.      vector-based vs pixel-based graphical models

d.     Differences among popular image formats

i   GIF

ii   PNG

iii    JPG

iv    SVG

IV.      Coordinate Systems 

a.      viewports

b.     coordinate transformations

V.        Declarative Solutions 

VI.       Scripting Solutions 

VII.      Web Graphics 

a.      Drawing primitives

b.     Affine transformations

c.      Gradients

d.     Clipping

e.      Masking

f.      Compositing

g.     Animation

VIII.       Re-scalable graphics 

a.      Web

b.     Mobile Devices

IX.     Optional topics 

a.      Web fonts

b.     Graphical Standards development

c.      Drawing packages

d.     3D approaches

e.      Geographic Information Systems

f.      Client-server interaction



Required for IT, Elective for CS.

Learning Activities:

Together, the students and the professor will:

  1.  discuss the standards for Web and mobile graphics.
  2. discuss and practice both declarative and scripted solutions to web graphics.
  3. demonstrate, discuss, and practice using graphics packages
  4. discuss coordinate systems, viewports and coordinate transformations, and vector-based versus pixel-based graphical models, including the differences between popular image formats.

The following is a part of the University's urge to measure the benefits of education. While it may well be that the most important effect of education is creativity, that effect, is, almost by definition of the term, indefinable, hence immeasurable, rending a part of this urge intrinsically quixotic.  

Computer Science Department
Course Competency Plan

Course Outcomes: This course and its outcomes support the Information Technology Learning Outcomes of Problem Solving and Critical Thinking (PS&CT) and Ethical and Professional Responsibilities (E&PR). These Information Technology Learning Outcomes are tied directly to the University Wide Outcomes of Critical Thinking and Problem Solving, and Values and Ethics.


Program Objective

Assessed Course Objective


I.b. Integrate desing and implementation principles to develop effective Web pages

 1. Develop Web and mobile graphics that utilize appropriate color and grahpical models. 


I. e. Create efficient graphical client/server applications


II.c. Devise effective user interfaces for the Web

 2. Develop effective graphics for user interfaces.


III.a. Determine the economic and organizational effects of information technology on global society

 3. Develop Web graphics for a global and diverse population.