{"id":302,"date":"2014-03-08T20:46:04","date_gmt":"2014-03-08T20:46:04","guid":{"rendered":"https:\/\/brettjpeterson.com\/blog\/?p=302"},"modified":"2014-03-08T20:47:07","modified_gmt":"2014-03-08T20:47:07","slug":"printing-code-typography","status":"publish","type":"post","link":"https:\/\/brettjpeterson.com\/blog\/2014\/03\/08\/printing-code-typography\/","title":{"rendered":"Printing Code: Typography"},"content":{"rendered":"<p>This assignment was difficult for me. Here&#8217;s the brief:<\/p>\n<blockquote><p>This week you\u2019re going to design a word. Pick a word and make a typeface around it. The important thing is that you draw the letters using some kind of rule-based logic. Look at the examples I showed in class, and try to come up with your own typeface system &#8211; even if it\u2019s very simple. Your goal is to convince me that you can make a typeface that is better constructed in code than in Illustrator.<\/p><\/blockquote>\n<p>So I started thinking about what I wanted to design and decided that I needed more constraints. I chose to make my font using negative space &#8211; designing <em>around<\/em> the letters instead of designing them. I took the visual of an audio equalizer as a loose inspiration.<\/p>\n<p> <img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.audio-production-tips.com\/image-files\/audio-eq.jpg\" width=\"500\" height=\"353\" class=\"alignnone\" \/><\/p>\n<p>I chose the word &#8220;FUTURE&#8221; to design since I wanted my type to look modern, clean and, well, futuristic. <\/p>\n<p>I started creating my system of letters. Each letter consists of 3 columns and each column consists of between 2 and 4 bars to create the negative outline. I then drop these into a vector with a column of space after each one.<\/p>\n<p><a href=\"https:\/\/brettjpeterson.com\/blog\/wp-content\/uploads\/2014\/02\/Screen-Shot-2014-02-26-at-6.04.50-PM.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/brettjpeterson.com\/blog\/wp-content\/uploads\/2014\/02\/Screen-Shot-2014-02-26-at-6.04.50-PM-300x128.png\" alt=\"Screen Shot 2014-02-26 at 6.04.50 PM\" width=\"300\" height=\"128\" class=\"alignnone size-medium wp-image-307\" srcset=\"https:\/\/brettjpeterson.com\/blog\/wp-content\/uploads\/2014\/02\/Screen-Shot-2014-02-26-at-6.04.50-PM-300x128.png 300w, https:\/\/brettjpeterson.com\/blog\/wp-content\/uploads\/2014\/02\/Screen-Shot-2014-02-26-at-6.04.50-PM-1024x437.png 1024w, https:\/\/brettjpeterson.com\/blog\/wp-content\/uploads\/2014\/02\/Screen-Shot-2014-02-26-at-6.04.50-PM.png 1174w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p>At this point, it looked like something I could have very easily done in Illustrator. It just looked like a kinda-crappy pixel font. But since I had set up the letter system to be dynamic, I was able to play with the weight of the letter, the height, spacing and angle of each column. I liked that I was able to adjust the properties easily.<\/p>\n<p><a href=\"https:\/\/brettjpeterson.com\/blog\/wp-content\/uploads\/2014\/03\/DSCF5691.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/brettjpeterson.com\/blog\/wp-content\/uploads\/2014\/03\/DSCF5691-300x225.jpg\" alt=\"DSCF5691\" width=\"300\" height=\"225\" class=\"alignnone size-medium wp-image-310\" srcset=\"https:\/\/brettjpeterson.com\/blog\/wp-content\/uploads\/2014\/03\/DSCF5691-300x225.jpg 300w, https:\/\/brettjpeterson.com\/blog\/wp-content\/uploads\/2014\/03\/DSCF5691-1024x768.jpg 1024w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p>Overall, I think it came out ok. I had a hard time with this assignment and I&#8217;m not sure the final output is really indicative of the work put in. But I like the grey on grey in different shades.<\/p>\n<p><a href=\"https:\/\/github.com\/ptterb\/PrintingCode\/tree\/master\/typographyAssignment\">Code on Github.<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>This assignment was difficult for me. Here&#8217;s the brief: This week you\u2019re going to design a word. Pick a word and make a typeface around it. The important thing is that you draw the letters using some kind of rule-based logic. Look at the examples I showed in class, and try to come up with [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,24,1],"tags":[],"class_list":["post-302","post","type-post","status-publish","format-standard","hentry","category-itp","category-printing-code","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/brettjpeterson.com\/blog\/wp-json\/wp\/v2\/posts\/302","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/brettjpeterson.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/brettjpeterson.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/brettjpeterson.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/brettjpeterson.com\/blog\/wp-json\/wp\/v2\/comments?post=302"}],"version-history":[{"count":7,"href":"https:\/\/brettjpeterson.com\/blog\/wp-json\/wp\/v2\/posts\/302\/revisions"}],"predecessor-version":[{"id":312,"href":"https:\/\/brettjpeterson.com\/blog\/wp-json\/wp\/v2\/posts\/302\/revisions\/312"}],"wp:attachment":[{"href":"https:\/\/brettjpeterson.com\/blog\/wp-json\/wp\/v2\/media?parent=302"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/brettjpeterson.com\/blog\/wp-json\/wp\/v2\/categories?post=302"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/brettjpeterson.com\/blog\/wp-json\/wp\/v2\/tags?post=302"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}