(Suggested: 15 mins)
Find a shape that impresses you. It may be an icon, a logo, a glyph, a physical object like a butterfly, a wheel, or anything that appeals. The complexity of shape is upto the candidate to decide; but a good heuristic is to spend a good half an hour to recreate the shape. Also, remember that you shape (or the collection thereof) shall finally be drawn with only one fill style and one stroke style throughout.
Crop image to the region of interest, and rename it as
<roll-no>-0x07-2d-primitives-refimg.png
.
Paste it into the ./assets
folder. It
should reflect in your index.html
, upon click over
"Show Refimg."
There are plenty of options to modify the shape into flat colours, and it's about creativity. It's common place to use an image editor like GIMP and vector drawing softwares like Inkscape. Commonly used operations would be like,
- Solarisation
- Histogram Equalisation
- Color Balance
- Use a vector editor like Inkscape to import and trace the drawing as per your liking
(Suggested: 45 mins)
Define transformation matrix using DOMMatrix
interface; there is a math
refresher here. The task is
- To define functions that return transformation matrices given transformation parameters; and
- To define transform composition function to apply
transforms using
DOMMatrix.multiplySelf()
.
It's always advisable to start with the Identity Matrix.
Use the functions as defined here to redefine and
complete the function
Experiment.getBaseTransform