Week 3

Preparation for Assignment #2  

Due date: Note new due date (Sept. 20, and new part c) for 2.1!))

affine and perspective transformations
centering things (JavaScript, CSS, SVG)
rotation (2D, 3D, CSS, SVG)

Types of  web animation:
JavaScript: onmousemove transform="matrix", dynamic random scenes and motion
SVG template with needed declarations
[pros={power, ubiquity},cons={complexity, expertise, >development time}]
SVG/SMIL: example1 example2 example3
[pros={easy, concise, semantic, <development time, sociable},cons={Microsoft, W3C=too busy/weak}]
JavaScript/SMIL combination: example1 example2
[pros=union{pros(JavaScript), pros(SMIL)}, cons=cons(JavaScript), cons(SMIL)]
CSS: example
[pros={HTML+SVG}, cons={experimental, flaky, Microsoft, cumbersome}, uncertain={new features sometimes implemented by browsers sooner in CSS than in SVG -- do we really need 3D and blend modes for hTEXTml before svGRAPHICS????}]
CSS/SMIL combination: example1 example2 (has nasty bug in Firefox-- to be fixed with FF50.)
future [Web Animations ?]

Using <canvas>
Simple example (drawing a line)
Several examples (curves, rectangles, gradients, text)

Simulated 3D
Replicate and random. Firefox recently broke some of these.
More CSS 3D transforms a simpler rotating half-cube (as in assignment #1)
CSS + replicate
A nice presentation on 3D geometry

Other topics:
vectors and pixels
bits per pixel, spatial resolution
dithering and anti-aliasing
Color systems for computers: RGB and CMYK,  HSL (vs. RGB) , CIE,  Indexed Color
Compression: GIF vs JPG.