Animation for the Web
  I: Administrative Information   II: Course Details   III: Topical Outline(s)  Printable Version
Section I: Administrative Information
  Total hours: 21.0
Credit Value: 1.5
Credit Value Notes: N/A
Effective: Winter 2019
Prerequisites: N/A
Corequisites: N/A
Equivalents: N/A
Pre/Co/Equiv Notes: APPL70078, APPL70079, PROG70007

Program(s): Front-End Web Development
Program Coordinator(s): N/A
Course Leader or Contact: N/A
Version: 20190107_00
Status: Approved (APPR)

Section I Notes: This course is offered on-campus. The sessions may include a variety of interactive and engaging activities including discussions, workshops, group activities, role plays, case studies and presentations. Readings, video, and podcasts may be provided online, on Sheridan's Learning and Teaching Environment (SLATE), to support class activities and reinforce material covered during class sessions. Assignment details will be provided in class and on SLATE. Students will need reliable access to the internet.

Section II: Course Details

Detailed Description
In this hands-on course, students use JavaScript (jQuery), CSS3, and HTML5 Canvas to create animated content for web pages or web objects. With predefined jQuery functions, students create standard effects such as fade, slide, and toggle. They also customize animations using jQuery and CSS3 scripts displaying multiple 2D and 3D transformations, including various 3D transforms, transitions, perspective, and cube animations. Through the knowledge of writing JavaScript code, students create and animate objects in HTML5 Canvas. To ensure scripts are supported in different types of media devices and browsers, students use various script methods, including autoprefixer and media query.

Program Context

Front-End Web Development Program Coordinator(s): N/A
This is an elective in the Front-End Web Development Certificate.

Course Critical Performance and Learning Outcomes

  Critical Performance:
By the end of this course, students will have demonstrated the ability to create 2D and 3D animations for web pages and web objects using JavaScript, Cascading Style Script 3 (CSS3), and HTML5 Canvas.
Learning Outcomes:

To achieve the critical performance, students will have demonstrated the ability to:

  1. Apply a standard series of jQuery (JavaScript) predefined functions to create animations on web pages or web objects
  2. Create a standard series of CSS3 2D and 3D animations and transformations
  3. Create a series of static and animated objects in HTML5 Canvas
  4. Utilize various script methods to ensure cross-browser compatibility when creating animations

Evaluation Plan
Students demonstrate their learning in the following ways:

 Evaluation Plan: IN-CLASS
 Assignment 1: jQuery Animation20.0%
 Assignment 2: CSS3 Animation20.0%
 Assignment 3: Using Canvas20.0%
 Assignment 4: Cross-browser Capability Methods10.0%
 Final Animation Project30.0%

Evaluation Notes and Academic Missed Work Procedure:
All graded evaluations (i.e., projects, assignments, tests, exams, etc.) must be completed according to the schedule of dates specified by the instructor. Requests to submit work after the due date must be made no later than 24 hours before the due date, and must be accompanied by a valid reason that is acceptable to the instructor. Late assignments that have not received prior approval by the instructor will receive a grade deduction of 10% per business day. Students will be allowed to write a missed quiz/exam/test if they are able to provide the instructor with a valid and acceptable reason for their absence.

Provincial Context
The course meets the following Ministry of Colleges and Universities requirements:


Prior Learning Assessment and Recognition
PLAR Contact (if course is PLAR-eligible) - Office of the Registrar

  • Not Eligible for PLAR

Section III: Topical Outline
Some details of this outline may change as a result of circumstances such as weather cancellations, College and student activities, and class timetabling.
Instruction Mode: In-Class
Professor: N/A
Resource(s): N/A
Applicable student group(s): Continuing and Professional Studies Students
Course Details:

Module 1: JavaScript (jQuery)

  • jQuery Effect Methods (fade, slide, toggle, hide, show, delay)
  • jQuery Animate Methods
  • setTime and setInterval Methods

Assignment 1:  jQuery Animation (20%)

Module 2: CSS3 Animations

  • Keyframes for Animations
  • CSS3 Animation Attributes (colour, height, width, duration, movement, etc.)
  • 2D Transform Methods
  • 3D Transform Methods

Assignment 2: CSS3 Animation (20%)

Module 3: HTML5 Canvas

  • Setting up a canvas
  • Creating objects in Canvas
  • Strokes and Fills in Canvas
  • Animating objects in Canvas

Assignment 3: Using Canvas (20%)

Module 4:  Browser Compatibility

  • jQuery Browser
  • Autoprefixer
  • Media Query
  • Comparing JavaScript, CSS3, and HTML5 Canvas

Assignment 4: Cross-browser Capability Methods (10%), Final Animation (Project 30%)

Sheridan Policies

All Sheridan policies can be viewed on the Sheridan policy website.

Academic Integrity: The principle of academic integrity requires that all work submitted for evaluation and course credit be the original, unassisted work of the student. Cheating or plagiarism including borrowing, copying, purchasing or collaborating on work, except for group projects arranged and approved by the professor, or otherwise submitting work that is not the student's own, violates this principle and will not be tolerated. Students who have any questions regarding whether or not specific circumstances involve a breach of academic integrity are advised to review the Academic Integrity Policy and procedure and/or discuss them with the professor.

Copyright: A majority of the course lectures and materials provided in class and posted in SLATE are protected by copyright. Use of these materials must comply with the Acceptable Use Policy, Use of Copyright Protected Work Policy and Student Code of Conduct. Students may use, copy and share these materials for learning and/or research purposes provided that the use complies with fair dealing or an exception in the Copyright Act. Permission from the rights holder would be necessary otherwise. Please note that it is prohibited to reproduce and/or post a work that is not your own on third-party commercial websites including but not limited to Course Hero or OneNote. It is also prohibited to reproduce and/or post a work that is not your own or your own work with the intent to assist others in cheating on third-party commercial websites including but not limited to Course Hero or OneNote.

Intellectual Property: Sheridan's Intellectual Property Policy generally applies such that students own their own work. Please be advised that students working with external research and/or industry collaborators may be asked to sign agreements that waive or modify their IP rights. Please refer to Sheridan's IP Policy and Procedure.

Respectful Behaviour: Sheridan is committed to provide a learning environment that supports academic achievement by respecting the dignity, self-esteem and fair treatment of every person engaged in the learning process. Behaviour which is inconsistent with this principle will not be tolerated. Details of Sheridan's policy on Harassment and Discrimination, Academic Integrity and other academic policies are available on the Sheridan policy website.

Accessible Learning: Accessible Learning coordinates academic accommodations for students with disabilities. For more information or to register, please see the Accessible Learning website (Statement added September 2016)

Course Outline Changes: The information contained in this Course Outline including but not limited to faculty and program information and course description is subject to change without notice. Any changes to course curriculum and/or assessment shall adhere to approved Sheridan protocol. Nothing in this Course Outline should be viewed as a representation, offer and/or warranty. Students are responsible for reading the Important Notice and Disclaimer which applies to Programs and Courses.

[ Printable Version ]

Copyright © Sheridan College. All rights reserved.