Canvas and the Close Pixelate script
First published on Ka of Isis 140627
Fig. To do justice to the Close Pixelate script, I needed an uncluttered photograph with a single, well defined motive and found the exceptional ‘StudioOne’ among geishaboy500’s Flickr contributions. It is used here under a Creative Commons Attribution 2.0 Generic license. If you do not see an image with a ‘diagonal pixelation’, your browser probably does not support the canvas element. Too bad.
Tip: Click on the canvas to toggle the original image on and off.
As most non-artists I feel pretty lost in front of a blank canvas. With a brush and paint I cannot blame the tools, so it all boils down to a void of artistic inspiration, I fear. Working with computers in graphic design and with web pages, images have always been two-dimensional, static and – safe. The canvas element changes all that, however, as it opens doors to what Jeremy Keith in his booklet HTML5 for web designers calls ‘an environment for creating dynamic images’. Not that this will in any way make me an artist, but it will hopefully make me able to see ‘things’ from a different angle.
To use the canvas intelligently one needs to understand JavaScript and one does not have graphical user interfaces like we have been spoilt with ever since the introduction of the Macintosh and desktop publishing. In many ways the canvas circles back to the days when typographers entered arcane code into mainframe computers to order paper printouts with their limited and expensive choice of optically created type, ready for paste-up and subsequent printing. I cannot see myself going down that road, but I can see myself drawing on work done by people who do know scripting enough to supply the rest of us with examples and stepping stones.
Presented here is an inspiration and one of many possible entrances into Keith’s environment. It is created on the fly using one of several possible settings in the Close Pixelate script by David DeSandro. And please note that ‘close’ is not a secret term known only to programmers; DeSandro was simply influenced by painter Chuck Close.
Note: The effect in this example has been optimized for an image 960 pixels wide and is best viewed on a large desktop screen. Smaller screens would benefit from a different set of parameters in the script.