Generous Machine : The slabtype algorithm, Part 1: Background. Algorithms, Flash, Graphic Design, Interactive Design, Typography 1/23/08 Animator/designer Alessandro Ceglia pointed out to me a few months back that it’s possible that many users of Public Secrets don’t realize that the piece’s visual presentation is almost entirely algorithmic. Once you get beyond the title screen, all visual composition is handled dynamically, and you’ll never be able to take two identical screenshots of the piece. The designer’s statement for the project describes the two main algorithms used in the project: treemaps (an existing solution dating back to 1991) and an original text-layout algorithm which as of this article is dubbed “slabtype.” Treemaps (which I fell in love with after seeing Martin Wattenberg’s Map of the Market while I was working at Razorfish) are covered extensively elsewhere (description, history, Wikipedia) and are used to generate the overall layout of boxes for each screen of the piece.
An early, more index-like design for Public Secrets. Baseline.js | Vertical rhythm made easy. Implementing a vertical baseline can be pretty easy. But maintaining one can be difficult, particularly with the addition of images in articles and webpages. That’s where Baseline.js steps in. Download on Github Baseline.js is a jQuery plugin that helps you to maintain vertical rhythm set by a typographic baseline, even when adding inline images with awkward sizes. Using Baseline.js couldn't be easier. Simply include jQuery along with the plugin, and call it like so: You can see the effect Baseline.js has for yourself below. Nulla fringilla, orci ac euismod semper, magna diam porttitor mauris, quis sollicitudin sapien justo in libero. You see that? A Crash Course in Typography: The Basics of Type - Noupe Design Blog. Mar 28 2011 Typography could be considered the most important part of any design.
It’s definitely among the most important elements of any design project. And yet it’s often the part of a design that’s left for last, or barely considered at all. Designers are often intimidated by typography, which can result in bland typographical design or a designer always using one or two “reliable” typefaces in their designs. This series aims to change that. If you’re intimidated by typography, or even just aren’t quite sure where to start, then read on. We’ll break down typographic theory and practice, starting with the basics (so that everyone starts on the same page). In this part, we’ll talk about the basics of typographic theory, including the different kinds of typefaces (and how typefaces and fonts differ), as well as the basic anatomy of a typeface. Typefaces vs. A lot of people use the terms “typeface” and “font” interchangeably. A typeface is a set of typographical symbols and characters. Kuler. Handpicked free fonts for graphic designers with commercial-use licenses.