WEBD 1127 - Interactive Web Design 2- SVG and Canvas

1. Canvas and SVG overview
2. Canvas Element in HTML5
3. Canvas components: line, arcs, rectangles, and polygons
4. Strokes, fills, gradients, and patterns
5. Text in Canvas
6. Images and video with Canvas
7. Animation with Canvas
8. SVG graphics: shapes and properties
9. SVG text/images
10. SVG filters/masks and symbols
11. Options for using SVG within HTML
12. Animating SVG elements

1. compare and contrast Canvas and SVG.
2. draw with the Canvas element.
3. draw lines, arcs, curves, rectangles, polygons with Canvas.
4. fill shapes with colors, gradients and patterns.
5. draw and manipulate text with Canvas.
6. add stroke and fill to text and positioning text within Canvas.
7. draw and scale images in Canvas.
8. implement animation with Canvas.
9. create SVG graphics.
10. create SVG shapes and associated properties.
11. apply SVG filters/masks/symbols.
12. incorporate SVG into HTML.
13. incorporate SVG into HTML.
14. animate SVG child elements.

Courses and Registration