elliot winard

Today after work I looked through Emil Ruder’s Typographie and decided to start explore digital typography using LZX.

The first thing that I attempted was to reproduce the image on the cover of Typographie using whatever fonts I could find on my system. Maybe I’ll get into creating my own digital font like my friend Daniel did but for now I’ll make due with type that I have.

I find that the best way to approach a problem like this is to split it into small bite-sized chunks and solve them one after another. So I started with the following list:

1. pick a decent font to approximate the strong sanserif on the cover of Ruder’s Typographie
2. create a blockletter class in Laszlo
3. lay out the letters
4. think of new typography-related projects to play with in Laszlo

For #1 I picked Arial Black, a simple blocky font that was already installed on my dev machine.

The code started off with a simple canvas and a <font> tag

The colors on the Ruder cover are orange and white but I want to reuse the blockletter class that I create with different colors so I inclued attributes for blockcolor and color (forground color) as well as letter for the text to display in the blockletter.

    
    
           bgcolor=”${blockcolor}” >
        
        
                   value=”0xFF5500″ type=”color” >
        

        
              fgcolor=”${classroot.color}” >
    
    

Notice some vertical clipping on the right-most edge of the characters inside of the blockletters. We’ll see later if the bug is in my code, in the component in Laszlo or in the ariblk.ttf font.

next… layout, reversing the letters to match the Ruder cover, tracking down the character slipping.