I am fond of an online magazine called “Its nice that”, whilst doing my project, I kept an eye out for articles regarding typography.
https://www.itsnicethat.com/articles/dorothee-daehler-graphic-design-270919
https://www.itsnicethat.com/articles/jan-novak-typography-graphic-design-290617
https://www.itsnicethat.com/features/bam-and-pam-launderette-signs-typography-graphic-design-270919
https://www.itsnicethat.com/articles/double-click-september-2019-170919
I began looking at the fundamentals of code languages which have a strong visual impact on digital typography. As my audience is a computer I thought of the conditions that would dictate the onscreen typography produced, so I would then be able to communicate back using this appropriated language. I realise this sounds a bit conceptual but Marcus and I discussed presenting this as a “science-fiction narrative”. I wanted to know a bit more about the basics of coding so I could begin to formulate an understanding of how these channels of communication were informed which would then have a visual impact on the typography presented. I located a couple of coding languages which have a distinct visual type, that I could play around with. Hex ASCII, HTML, Binary which all have different functions. Hex, I found interesting as it was directly related to design and print – it dictates the colour of something through a numerical code. When translating a passage or even a sentence into hexadecimal, a long line of numbers is generated. This aspect really detaches the translation and as a communication method – confuses a human reader. Binary code is another numerical translation of a piece of data. In my opinion, this one is the most established and well known form of computer language that I think a human viewer would be able to identify. I have previously used ASCII, through generators, you can convert photos into ASCII based images, made up of code. “ASCII is used to translate computer text to human text. … ASCII is used as a method to give all computers the same language, allowing them to share documents and files. … ASCII is important because the development gave computers a common language”. Finally, I looked into how HTML utilised certain punctuation to make scripts readable for a computer.
An easy way to begin creating some visual results was to use text to code translators online:
https://www.html.am/html-generators/marquee-generator.cfm
https://www.rapidtables.com/convert/number/ascii-to-binary.html
https://www.rapidtables.com/convert/number/binary-to-hex.html
https://www.rapidtables.com/convert/number/binary-to-ascii.html
http://www.unit-conversion.info/texttools/hexadecimal/
http://www.yeoahn.com/typecode/
https://www.quackit.com/html/html_generators/html_text_generator.cfm
https://www.browserling.com/tools/text-to-hex
It’s easy to see how I could start translating the text into these different code forms. I needed to begin thinking about what visual outcome I could derive from these experiments. I thought back to one of my favourite graphic designers, April Grieman. I was reading an article recently for my own personal interest about one of her inspirations – Wolfgang Weingart. It was interesting that she drew so much from Weingart who experimented with type using traditonal techniques such as the letterpress when her environment and language was so digital.
In this documentary, I noticed that some of his pieces have a digital feeling. Type is set in big square blocks, which goes against how books and lines of narrative are usually set out. The text is approached not as a series of words, but rather letters. The sharpness and clarity of his letterpress prints really reminded me of on screen typography. Against the off white paper they really pop.He also recommends the font: akzidenz grotesk, as an even simpler and cleaner helvetica equivalent
This led me to think about type setting. In my earlier experiments I came across a slightly more advanced online generator.
https://sketch2code.azurewebsites.net/generated-html/884417b8-2b3e-456b-9cd2-6fb97dfba93e
This generator is intended to be used to translate hand drawn code into html format. It uses an ai to realise a piece of handrawn code and it can be used to create websites and interactive pages. It didn’t translate big chunks of text very well so I had to split the text into about 14 sections which I then individually ran through the program. What stuck out most to me was the way the program type set the translated typography. I don’t particularly know why, but it split the text into really regular, neat, square boxes sometimes splitting the text into 2 columns.
I translated the whole text and thought about where to take this idea next.
I Positioned all this text on a scroll, keeping the ai generated type setting unaltered. In programming software text is viewed in an everlasting scroll. I thought it was important to keep this aspect, it highlights a big difference between how humans and computers process information and cements the text as prioritised for my audience – a computer.
I also explored ideas such as Kinetic typography and parallax scrolling. Considering the time frame, it wasn’t realistic, but it was still useful for my thought process and working method.
Cameron Aitken Graphic Design 