Mini-Syllabus

(Fall 2012, online course, sec. 32017; version 1.0, revised 2012 Aug 25)

Course Description

The HTML5 canvas is well positioned to drive Flash animations into obscurity. A large part of this course will cover graphics using the canvas element, controlled through JavaScript. Canvas is not all: HTML5 also allows us Scalar Vector Graphics (SVG) and provides native audio and video — challenging Flash again. This course covers the use of such elements for static and animated graphics and multimedia on the web. However, the concepts are not limited to the web; they are widely applicable to graphical applications in general.

Web technology students: contact your advisor about substituting this course for “FINA-U 330 Computer Art, Interactive Media”, which is officially required, but unavailable, for the Web Technology cognate.

Prerequisite

Students should be able to develop programs in some language. INFO I210 is sufficient preparation. Prior knowledge of JavaScript or HTML is not expected or required.

Learning Outcomes

Students who complete this course should be able to develop and debug JavaScript programs (scripts), in particular those that add graphical content to a web page, including the HTML5 canvas element, and Scalar Vector Graphics (SVG). They should also be able to incorporate images (e.g., still photographs), audio, and video into HTML pages.

These learning outcomes fall under the campus learning objectives of depth and problem solving.

Textbook

There is no textbook to purchase or rent; all readings are freely available on the web.

Course Requirements

• One or more discussion assignments.
• Four to six web pages to be developed using canvas or SVG elements. One of these might be an extended, student-directed application, such as a game or data visualization.
• Midterm and final exams.

Policies

The usual campus policies apply. Please ask the instructor if you have a question about course-specific policy.

• Academic honesty: Students are expected to turn in their own work.
  • Indiana University Code of Student Rights, Responsibilities and Conduct
    • See especially the section “Academic Misconduct”
  • IU East Standards of Student Conduct Policy (PDF)
  • IU East Student Code of Conduct Procedures (PDF)
• Disabilities: see the Student Support Services site including policy and procedure manual.
• Religious Observances Policy (PDF)
• Policy for the Approved Absence of Students Participating in Athletic Events (PDF)
• Privacy policy for the course web site

Instructor

Gregory D. Weber

• Personal home page
  • Contact information
  • Schedule, including office hours

Rough Schedule

This is the first time I’m teaching the course, so don’t expect too much precision with regard to the schedule. This is just my best guess as of the start of the semester.

Week	Dates	Topics and Activities
1	Aug 27–Sep 1	Introduction to the course, JavaScript, and canvas
2	Sep 3–8	Functions, animation
3	Sep 10–15	Objects, arrays, colors and gradients
4	Sep 17–22	Controls, events, images and patterns
5	Sep 24–29	Strings, robust JavaScript
6	Oct 1–6	Bézier curves, more about objects
7	Oct 8–13	Midterm review and exam
8	Oct 15–20	Transforms (translation, scaling, rotation) and the context stack
9	Oct 22–27	Audio and video elements
	Oct 26	Last date to withdraw with automatic W
10	Oct 29–Nov 3	Introduction to Scalar Vector Graphics. Basic shapes, lines, paths, colors, gradients, patterns.
11	Nov 5–10	Text, grouping, and transforms in SVG
12	Nov 12–17	Declarative and procedural animation; DOM
	Nov 19–24	Fall break, Thanksgiving, no class
13	Nov 26–Dec 1	SVG filters
14	Dec 3–8	Catch-up or extra topic
15	Dec 10–15	Final review and exam