Posts about computational typography
Type on the Move
Our penultimate assignment for this class involves moving or interactive type while also thinking about our final project.
My idea for the final project involves falling snowflakes morphing into letters and forming words. This is an idea that has been percolating in my mind for a few weeks now but faced a critical problem: I didn't know how to properly morph one character into another. I was very happy to see my friend and fellow student Oren Shoham accomplish this last week for his assignment using rune.js and flubber.js.
Font Experiments
For this assignment we experimented with fonts as data using the opentype.js JavaScript library.
I wanted to experiment with perlin noise to make the letters wiggle in a non-repeating manner but periodically return to their normal, unperturbed state. I did this using P5's noise function multiplied by a factor linked to the sin of the frameCount. Periodically this will be equal to zero, effectively turning off the noise. What I like about this is that it distorts the letters in a coordinated fashion that (almost never) makes the letters overlap.
Concrete Poetry
This week we learned about Concrete Poetry. Our assignment is to use JavaScript, CSS, and HTML to create a concrete poem programmatically.
For some reason I got the crazy idea to create anaglyphs. An anaglyph is a stereoscopic illusion created by offsetting an image's red channel from its blue and green (cyan) channels and viewing that image with red and cyan glasses. It happens I'm quite interested in the subject and have done a lot of work with anaglyphs in the past. I know how to do this with pixels, but can I do it with HTML instead?
Asemic Writing
This week we learned about Asemic Writing. This is something that has the appearance of writing but isn't composed of real, meaningful words or text.
I wanted to do more than a bunch of letters; I wanted the letters to be grouped together in words and the words grouped together in paragraphs. To do this I had to think about spacing between letters and words and line heights. Rather than pick arbitrary values for this I learned about Gold Ratio Typography. In theory it makes the text more pleasing to the eye. In the case of the below sketch, the line height, font heights, and font widths are all functions of the P5 canvas sketch width.
Writing on the Grid
For our first assignment we experimented with a JavaScript-based terminal emulator. In the early years of computing, terminals were the main interface for computer users. They provided a text-based interface for entering commands and receiving the results.
I wasn't around back then but as a kid when I started learning about computing one of the computers I used was a Commodore 64. During Allison's lecture I was reminded of the kinds of programs I wrote with that computer. It was a limited machine but with some effort I could program it to create simple games. One kind of game I made many times challenged the user to navigate through a maze. For whatever reason I was fascinated with mazes and created many versions of this theme over the years. For this assignment I had the opportunity to make yet another one, and I jumped at the chance.
Computational Typography
Computational Typography, taught by Allison Parrish.
Class blog posts:
- Wednesday, October 31, 2018 2:32 AM Writing on the Grid
- Wednesday, November 7, 2018 12:21 AM Asemic Writing
- Tuesday, November 13, 2018 11:26 PM Concrete Poetry
- Sunday, November 25, 2018 11:44 AM Font Experiments
- Wednesday, December 5, 2018 9:41 AM Type on the Move
- Tuesday, December 11, 2018 10:17 PM Holiday Animation