Blockprint your mug with SVG!
We’ll start with a real webdesign conundrum: How do you build a site that is interesting, but does not overload my server, your data-connection, or your device’s processing capability. I guess you might also appreciate my not using up all of this months data allowance too!
You can start block printing your mug design with this traditional gardener’s plea: Grow, damn you!
Here I have built a large-ish graphic using the block printing concept; a concept I first encountered on the mugs my mother owned in the 60’s. The design is generated by repeating three simple graphical elements. When you click the ‘Grow, damn you!’ link these are assembled in a step-wise fashion to generate a pseudo random pattern. I believe there are 274 million different final designs possible (see wikihow.com); most permutations look OK, though some are more visually interesting than others.
Does it work? Well, if you have read this far, then yes! Putting this into numbers for comparison; the code required to generate the block-print comes in at under 4kB. The photograph shown below comes in at 44kB…
I think both images are quite pleasing; clearly they would serve very different roles in a website, and would be used in different circumstances. When a technique like this is appropriate, however, you can enhance your visitor’s experience, at minimal cost to yourself OR to your visitor (what is not to like?)*
If you like the design you have generated you can get it printed on a mug at the T shirt Studio (link below), but you will need to zoom in on the graphic (it is SVG, so you can zoom the page as much as you need without it pixelating – this will not work for the photograph;-), and grab a screenshot first – as the design will (almost certainly) be different the next time you visit!
tshirtstudio (other online printers are available).
* Custom art is ALWAYS expensive to create; the saving is in ensuring your server gets pages to more (up to 10× more) potential visitors (customers?) for the same infrastructure cost!
