Four ASCII lions were generated to show off the history of ASCII art.

  • A set of 0 and 1 to represent a minimal representation
  • Black and white full text representation
  • Black and white with use of letters to give a genuine grey-level view
  • A full-colour version

To ensure that the grey levels for both the black and white and coloured versions were correct, special SVG fonts were defined for a full character set.

A magnifier showed up the quality of the text font and the magnified version showed up appropriate text finishing with ONLYON on the coloured lion.

The major problem initially was that none of the browsers could render the animated text lions and the magnified views as they scrolled up the page.

The initial solution was to transform the background image into a PNG image and just see the SVG font in the magnified view.

With the removal of the support for SVG fonts, all the browsers use different fonts for the magnified versions and as some do not render all the text font properties correctly, the result is that the part of the lion amplifies is usually the wrong part.

In consequence, the version of the logo animation in Florence shown here has the PNG image for both the original and magnified images.

The coloured ASCII lion that was meant to represent the evolution of ASCII art took a while. First we had to get the coloured pixels of a lion reasonably correct:

We then had to find suitable weights for characters to give the correct effect:

This involved several XSLT transformations from the original image to a sequence of SVG text elements with the required styling. Having done all this, most browsers were incapable of rendering the image in real time and so the SVG text image then had to be turned into the PNG image