The dawn of the New Year marks a time to look ahead and dream about the future. Often involved are making resolutions and setting goals. I once encountered some advice on this topic that has stayed with me through the years. Initially, I didn't fully grasp it, but its meaning has deepened over time. The advice? It is more important to think about what you'll stop doing rather than what you'll start.
Ultimately, setting goals is an attempt to budget our most valuable resource: time. What we spend our time on, and thus our attention, determines how we live our lives. When we say yes to one thing, we also say no to hundreds of other things at the same time. And there is only room for so many yeses.
Resolutions and goals are often only about saying yes. What are the things we want to start doing in the New Year that we aren't doing already? Missing from the equation are the things we will say no to in order to make room for the new yeses.
Consider Dieter Rams' famous dictum: less but better. Saying no to the unessential frees us to focus our time and attention on what is most important. Thus, we do what is most important better, because there is less to distract us from it.
Looking back, I now see Rochelle Myers as one of the few people I've known to lead a great life, while doing truly great work. This stemmed largely from her remarkable simplicity. A simple home. A simple schedule. A simple frame for her work.
Collins' article is the best articulation of the idea of saying no in the New Year. Do yourself a favor – read it.
Ask yourself these questions: What does simplicity look like in your life? What is unessential that can be cut away? What is the best use of your time and attention?
This New Year, what will you stop doing in order to reach your goals?
Writer Pro was released this week. It's the follow-up to one of my favorite apps – the excellent iA Writer. Aside from interesting new features like syntax control, there was one aspect of Writer Pro's release that caused me to pause and think: the price.
Writer Pro costs $20. That's $20 for the Mac version and another $20 for the iOS version. In a world of 99¢ apps, the pricing of Writer Pro is somewhat unique. It is decidedly not an impulse buy.
We want people to think before they buy Writer Pro. Writer Pro is not for everybody. It is a professional writing suite for professional writers. Don’t buy it if you’re just interested in testing cool stuff.
The more I think about this pricing strategy, the more I like it. By setting the bar a little higher, Writer Pro's price helps ensure that people who purchase are thoughtful and serious about the app.
This leads to an important realization: paying for something costly changes your perception of it. The more costly something is, the more you appreciate it. The more you invest in it before disposing of it. The more you care for it over time. For example…
Music
When streaming music (low cost), I am quick to move on if an album doesn't immediately interest me. If I purchase an album outright (high cost), I am much more likely to give it repeated listens before giving up on it. This can be rewarding, as often the best albums are the ones that grow on you over time.
News
The Information, a technology news site, makes its articles available to subscribers only, at a cost of $39 a month. Aside from this business model's impact on journalism, it completely changes the relationship of the reader to the reporter. The reader is likely to be highly engaged – reading thoughtfully and providing feedback – in addition to having higher expectations for the quality of reporting.
Furniture
Vitsoe makes "long-living furniture, always striving to be better rather than newer." As a result, Vitsoe's furniture never goes on sale and is relatively costly (at least in the short term). The cost, however, is what allows Vitsoe to fulfill its mission. It enables the high level of quality required for it's furniture to last. It also ensures that customers have thoughtfully considered their purchase and will be invested in using it for a lifetime.
All of the above characteristics are true of app purchases. In the case of Writer Pro, the costly price will result in a group of thoughtful, engaged people that expect a lot out of the product and are invested in using it and seeing it improve over time. This is good for all involved. The makers of Writer Pro can focus on satisfying a thoughtful, engaged user base. The users of Writer Pro can enjoy a well-crafted tool, knowing that its development will be sustainable.
I haven't purchased Writer Pro yet. I'm still thoughtfully considering it. If and when I do, however, it certainly won't be on impulse.
I read an article on Medium this week that helped me do something I really needed to do: reduce digital clutter. The article, entitled The Noise of Stuff and written by Mikael Cho, explains "How clutter affects you and what you can do about it." Much is described about the psychology of clutter, but the first point of application packed the biggest punch: Apply constraints.
Imposing constraints on oneself can be very beneficial, especially creatively. In Cho's words:
One of the principles of good design is constraints. You can apply this same theory to create a system for mastering consumption.
One of the worst things that can happen to a creative project is to be given no constraints. It may sound like a dream to have no deadline, budget, or creative restrictions. However, such freedom is almost always paralyzing. Without constraints, there's nothing to push against or work around to stimulate creativity. Without a deadline, there's no motivation for completion.
The same is true of clutter and consumption. Given the constraint of a small living space, it's harder to accumulate a lot of clutter because there's simply no room to store the unessential. Unlike the physical world, however, there are often no practical limits when it comes to digital spaces. This is both a blessing and a curse. It's great to not have to worry about deleting emails for the sake of having a place to store new ones. The downside comes with the boundless current of digital information.
With the unending flow of great information (articles, videos, tweets, etc), I struggle to balance the time I spend consuming information with my desire to spend time creating. For example, I find myself spending much time reading when, arguably, my time would be better spent actually writing.
Though not a novel idea, Cho's advice to apply constraints proved quite timely to me personally. It highlighted a growing problem in my digital life. Namely, my personal streams of digital information had become cluttered. Early this year, I intentionally paired down my information diet, but its lean size has slowly grown and become more and more bloated the more time has passed.
The best example is my saved-for-later list in Pocket. It contained over 200 items – a number which was beginning to feel overwhelming. The clutter had reached a tipping point, and negative associations were building in my head about my list. Cho's advice provided the clarity and inspiration I needed to take action.
Although I had thought in fuzzy terms about limiting items in Pocket, I had never assigned a specific number. Specifity is very important and shouldn't be underestimated. By setting a real number to each stream of information, the abstract desire to reduce clutter and consumption becomes a concrete reality.
In my case, I decided to set my Pocket limit to 50 – a reduction of over 75%. I combed through my list and deleted or archived the majority of items. This achieved two positive results. One, it ensured that the contents of my Pocket list are truly relevant and interesting. They are the items with the most value, thereby maximizing the time I spend consuming. As a second benefit, I am once more excited and engaged to open Pocket. The negative feeling of clutter has evaporated.
One other line stuck with me from Cho's article, and it's helpful to remember when discussing self-imposed limits:
Everyone’s tolerance for clutter is different.
This is so true. I tend to keep a lot of tchotchkes around my workspace. To some, it would appear very cluttered. To me, however, it makes my space feel creative and calm. The same is true of digital clutter. My limit of 50 might feel cluttered to someone else. Conversely, 200 items – which felt very cluttered to me – might be totally okay for a different person.
In addition to Pocket, I also placed specific limits on the number of people I follow on Twitter (50) and the number of rss feeds I follow (30). I hope to reduce these limits incrementally over time. Again, the specificity is most helpful. It's not possible to continually add without asking the question of what must be taken away. In effect, specific limits ask, "Is this information really worth your time?"
“An iPhone 3GS? Seriously?” – so said an incredulous coworker when I pulled out my phone. As a fellow designer, it was unfathomable to him that I would be using such an archaic piece of technology. To be clear, "archaic" in this instance refers to a phone that is four years old.
Four years is forever in technology years, but as photographer Steve Huff recently commented regarding camera technology:
Just because a new camera bettered an older model does not mean the older model is no good. It is still as great as it always was and is still capable of amazing results.
The iPhone 3GS is an amazing device – at least it was when it was new. Yet, conventional wisdom says to upgrade your phone every two years when your contract renews. Conventional wisdom also says to judge other people and ourselves by the things (ie phones) we possess.
The purpose of this article is not to explain why I own an iPhone 3GS – as if the mere fact of a digital designer owning an old iPhone necessitates a defense. Instead, it is to challenge a bit of the aforementioned conventional wisdom. It's not hard to find reasons to buy the latest iPhone. It is quite rare, however, to come across the advantages of owning an old one. So, in the spirit of challenging assumptions and perceptions, here are seven advantages to owning an old iPhone…
1. A Refined OS
Forget flat vs skeuomorphism for a moment. Think about iteration and refinement. The visual style of iOS 6 is the result of six major releases worth of visual refinement. Love it or hate it, it's polished. I love the philosophy and direction behind iOS 7, but it's first incarnation is definitely not without its flaws or critics. It will be improved and refined over time. For now, however, an old iPhone is the best way to enjoy a higher level of OS polish.
2. Low Cost
Buying any new technology is costly. For example, my dad paid $30,000 for his first business computer in the eighties, and it could do very little. The cost of a new iPhone (plus Apple Care) plus the protracted cost of a 2-year contract adds up. Relatively, old iPhones cost very little (mine was free) and can be used with a low-cost, contract-free carrier.
3. Few Updates
Though iOS 7 updates apps in the background, there's less reason to care about updates at all with an old iPhone (running iOS 6). Most updates are targeted for iOS 7 compatibility and some new apps won't even run on iOS 6. While this can definitely be a disadvantage, one benefit is the lack of change. An old iPhone gradually eases into a more static system that doesn't require updates.
4. Maximum Use
Our culture is in the habit of replacing things long before they reach the end of their useful life. It's easier to buy a new pair of jeans than it is to patch them. Put bluntly, we are wasteful. An iPhone may still be useful, but we'll toss it or trade it in if there's a newer one available. Using an old iPhone encourages getting the maximum use and life out of a product, which can even be fun if you like taking things apart.
5. Less Use
This advantage may seem counter-intuitive. Old technology is slower than new technology. In general, this is a negative characteristic, but slowness can be a virtue. For example, I don't want to spend every waking hour glued to my iPhone. I want to be connected to my family and the world around me. Using an old iPhone helps me achieve this. It's slowness puts more friction between me and unnecessary interactions, helping prevent overuse.
6. Less Precious
Buying a brand new car causes worry about every potential scratch and dent that might mar its perfect surface. Those same worries are far less prevalent with a used car. The same is also true of an iPhone. An old iPhone carries less risk and worry of loss or damage than a new one.
7. Perspective
Why do I feel slightly hesitant to write this article? Am I afraid of what other designers will think of me if they find out I use such an old phone? Though I wish I could say I didn't think these things, owning an old phone makes you come to terms with these kind of questions. It's a good reminder that a new iPhone is just a thing, not an identity – a luxury, not a need.
Do I want a new iPhone? Yes. Do I need a new iPhone? No. There's nothing inherently bad or wrong about desiring a new piece of technology. But it can become bad if we place too much weight and value on our desires for new possessions. Jesus taught “One's life does not consist in the abundance of his possessions." Likewise, one's life does not consist in the phone one possesses. The time will come to buy a new phone, but I'm perfectly okay – and even better off in some ways – until that time comes.
New. Few concepts are more powerful, especially in today's world of digital technology. The stream of new devices, new apps, and new gadgets is as relentless as it is endless. What is new today will be old tomorrow, and tomorrow keeps coming faster and faster. There is no time to rest if you want to keep up with what is new. Don't blink, or you'll miss it.
New Changes Perception
A new version, a new model, a new product. The things we own don't change, but we see them differently in light of what is new. What was once fast, small, and impressive is now slow, cumbersome, and so-so. In the words of Apple's Phil Schiller:
Isn’t it amazing how something new makes the previous thing instantly look old?
In an instant, your iDevice has lost its luster. It still works as well and looks as good as it always has, but why would you want to keep using it? It's no longer new.
New Demands Attention
New, new, new. Few adjectives command our attention with more authority. The subject rarely matters. The immediacy demands our time. Aptly named, news is the archetypal example. Seldom is “the news” truly noteworthy or even interesting apart from its timeliness. But we watch, listen, and click because it is new.
Much time is given to what is new. Time is spent learning about new gadgets rather than using the ones we already own. It's easier to spend our time consuming social media news feeds rather than creating meaningful work. Intentionally allocating time is difficult and disciplined work. It requires the willpower to look away from what is new in order to focus on what is important.
New Cultivates Discontentment
What is new deprives us from enjoying what we already have. Using an old gadget, our thoughts are filled with how much better, faster, and more enjoyable it would be if only we were using a newer one. Gnawing dissatisfaction grows within. What we already have may be what is best, but the prospect of greener pastures prohibits us from realizing it.
The promise of what is new is not a passive message. Advertising tells us how much better life would be if we only had what is new. In the US, we pay lip service to being thankful for what we have, but we're certainly not content. It's hard to be happy with what we have when something newer can be had.
Reflections on Newness
Newness is not an end in itself. It is equally faulty to universally embrace or reject based on newness alone. A healthy perspective begins with reflection and ends with balance. Newness has the power to negatively influence our perception, time, and contentment. At the same time, newness gives us hope for improvement and a future better than today.
Perhaps what is new captivates us so powerfully because, deep down, we long to be satisfied by something better than what exists today. A new world, a new life, a new hope. What is new ushers in progress, innovation, and improvement and promises the redemption of what is old, failing, and fading away.
The act of putting pen to paper helps plant information in my brain unlike anything else. Just like my previous notebook, the notes below are a window into my reading and thought patterns – highlighting ideas that resonated strongly with me from the past three to four months. Hopefully they resonate with you as well.
80/20 & Parkinson's Law
These two related principles are outlined by Tim Ferriss in The 4-Hour Work Week. The 80/20 principle states that 20% of your efforts/inputs result in 80% of the desired results. By focusing on the 20% of tasks that yield the majority of results, you can be more effective while doing less work.
Parkinson's Law states that "work expands so as to fill the time available for its completion." By limiting the time you have to complete a task, you are forced to focus on what is most important (instead of procrastinating – see below).
Avoiding the Important
The work that is most important is usually the work that is most difficult. Particularly if too much time has been allotted, we invent unimportant work to keep ourselves busy in order to avoid the hard work. Tim Ferriss recommends periodically asking yourself this question to keep your focus in check.
Poverty of Attention
I don't remember where I first encountered this quote from Herbert Simon. Our culture suffers acutely from poverty of attention, and the valuation of digital products provides concrete evidence of this fact. As shown again just this week, attention is valued far more highly than profitability.
Success
What is success? In Offscreen No. 4, Dave Greiner of Campaign Monitor defined it as noted above: the right balance of time with loved ones and meaningful work. In an industry that too often values work to the detriment of all else, it's inspiring to see such balance championed by the leader of a profitable, well-designed product.
The Best Conversations
Sharing a meal with someone positively affects the way we communicate. Also from Dave Greiner's Offscreen interview, this comment speaks to Campaign Monitor's culture of providing lunch for their entire team each day. It's a brilliant way to foster camaraderie and collaboration in a workspace where each person has their own office.
Talent + Vision
Timoni West, also interviewed in Offscreen, offered this question as a metric to evaluate potential job satisfaction for a designer. In short, align yourself to work on products that reflect your skills and principles.
Yet another bit of inspiration from Offscreen, this positive command comes from an interview with Brad Smith. In his words: "Today is truly all we have. Tomorrow isn't guaranteed." This encouragement to taking initiative speaks for itself.
As I write, the time approaches ten o'clock on the evening on November 14. I must complete and publish this article by midnight in order to meet my deadline. What happens if I don't? Absolutely nothing. The deadline is self-imposed. It's also completely arbitrary.
The fact of the matter is that I wouldn't be writing at all if it wasn't for the arbitrary deadline. I started with the goal to write about design and constructed constraints that would force me to do so. As the Writing page reads:
Thoughts on design, published on the 7th, 14th, 21st and 28th.
It's the 14th, so I've got a deadline to meet.
Thus far, the great consequence has been that I have, indeed, written. I've written more than I ever have in my non-student, adult life – twenty-two articles to date. I've accomplished my goal, thanks to arbitrary deadlines.
There are downsides, however. A busy schedule, coupled with procrastination, has lead to stressful, last-minute writing sessions, all in an effort to meet the arbitrary deadline. This affects not only myself but my family – who sees less of me as a result. In particular, my wife has felt the burden of doing the things I've left undone because I'm writing.
The worst situation came while attempting to meet last week's deadline – November 7. I underestimated the work of writing notes from Ampersand NYC, which necessitated four articles. Instead of meeting my deadline, I broke it. Publishing four articles in the same week also broke my one-per-week schedule.
For all my efforts, this technically wasn't the first time a deadline was missed. Confession: I've taken small liberties with dates in order to maintain the facade of my weekly publishing schedule. Did anyone notice? No – no one is waiting for this article to be published. Does that remove the uneasy feeling that I've been dishonest? No it doesn't.
Writing on the internet is a strange thing. Starting out, your reader is both no one and everyone at the same time. The fact that your words are "published" and accessible to anyone to read is motivating. Simply knowing that your words could be read promotes a higher standard of quality.
After all, motivation is the end goal. Arbitrary deadlines are a motivational tool, but at what point do they cease being helpful and become overly burdensome? When does positive stress (that forces action) become negative? If a deadline is compromised one time, it becomes easier to compromise a second. If there's no positive pressure to meet a deadline, it's no longer useful as a motivational tool.
Limitations and deadlines are necessary. To not have limitation is the illusion of freedom and the tyranny of infinite choice. To not have a deadline is to never finish. What must be remembered is that we are human beings and not rigid machines. We need deadlines, but we also need a degree of flexibility. Arbitrary deadlines are to help us, not control us.
This article is the fourth and final in a special series covering my notes from Ampersand NYC: The Web Typography Conference. See also: Part 1, Part 2 & Part 3
The final set of speakers at Ampersand NYC was comprised of front-end developer Jen Lukas and type designer Christian Schwartz. Lukas shared what she's learned about implementing webfonts from a developer's perspective. Afterwards, Schwartz closed out the conference with thoughts on type design, webfonts, and the future.
Jen Lukas: On Icon Fonts & Working with Designers
Jen Lukas, a front-end developer with Happy Cog, offered discussion points on how designers can best work with developers to implement type on the web. She used the quirky metaphor of a sandwich – an Ampersandwich that is – to structure her talk, with every topic relating to a sandwich ingredient. While I won't attempt to reconstruct her metaphor, here are some highlights from her talk.
Setting General Styles
Lukas starts projects by creating general styles. This means setting a base style for every element, creating a foundation of styles that can then be further modified for special cases as needed. A benefit of this method is that it ensures no element will ever be displayed without a style (ie when a client starts using the cms). Additionally, Lukas pairs all heading tag styles with corresponding class names. For example, the primary heading style would be mapped to both the h1 element and a class name of "alpha." That way, heading styles can easily be reused via the class names, independently of the specific heading tags.
Icon Fonts
Lukas also gave a good survey of the many methods and services available for implementing icon fonts. There are so many, it can be hard to know which one to choose. She cited working with one service that changed drastically, with no warning, during the middle of a project. Her recommendations based on the experience? Do your research. Learn the difference between services and remember to choose one with good customer support and a track record of stability. As an aside, I wrote a detailed tutorial on how to use IcoMoon, my current tool of choice for creating custom icon fonts.
Working Across Browsers
Regarding the implementation of webfonts, Lukas offered some helpful tips. For example, she recommends using -webkit-font-smoothing cautiously. While it can improve the rendering of text in some situations, it can harm it in others. Be sure to always test on actual devices. Additionally, should webfonts look exactly the same on every device? The answer is the same as an even broader question:
Another practical tip dealt with serving font assets. When designing experiences for different device classes, it can be advantageous to create multiple font kits. One font kit, small and basic, can be served to mobile devices where bandwidth limitations are a potential concern. Another kit, larger and fully-featured, can then be treated as progressive enhancement and served to desktop devices.
Christian Schwartz: Webfonts Are Just Fonts
The last presentation of the day was given by type designer Christian Schwartz, partner at Commercial Type. Included among his notable projects is work on GuardianEgyptian for The Guardian. In his talk, Schwartz surveyed a number of points regarding type design, webfonts, and the future of typography.
Good but Not the Same
Echoing a point made by Lukas, Schwartz noted that differences in operating systems render subtle difference in type on screen. Therefore:
Our goal should be to make everything look good but not the same. After all, a typeface looks different on coated and uncoated paper.
Variation in the way type renders is not a new issue, which is a good, grounding thought when working with webfonts.
Typefaces Aren't Magic Bullets
While using the same typeface on screen as in print for a brand can be great, it's not a magic bullet. In Schwartz's words:
Identity also comes through the structure of the content.
He pointed to The Guardian's website as an example. Even though it uses Georgia as the main text face, it still looks like The Guardian due to other design elements such as grid and color. It was an interesting perspective to hear coming from a type designer.
Two Types of Typefaces
Towards the end of his talk, Schwartz offered a great framework for thinking about typefaces. He stated that there are two kinds. The first kind are typefaces that will do whatever you want them to do. Helvetica is a good example. It can be shaped to do a lot of different things and can be found in a broad range of identities and contexts. The second kind of typeface is one that does most of the work for you. These are typefaces with much more inherent character and flavor. They do more out of the box, but are also less malleable. It's harder to adapt them to different identities or contexts. Both kinds have their place, but it's good to be aware of what you're using.
In making this point, Schwartz noted that he would like to see more of the second kind of typeface on the web. He noted that Commercial Type's two best-selling webfonts are Atlas and Graphik. Both typefaces are of the do-whatever-you-want-it-to-do variety that possess similarities with Helvetica and Arial. It will be interesting to see how the general character of type on the web evolves in the future.
Ampersand Elsewhere
Since the conference, I've run across a number of links from other people who attended the conference:
Attending Ampersand was a great experience. The mix of speakers struck a good balance between focus and diversity. Each talk was relevant to the topic of web typography, while covering it from a broad range of expert perspectives that kept things interesting. Knowing that there will be no Ampersand 2014, I feel especially fortunate to have attended this year's event. As Nick Sherman stated in his talk, it is truly an amazing time to be working with type on the web. We've come a long way, and I'm optimistic for what the future holds.
This article is the third in a special series covering my notes from Ampersand NYC: The Web Typography Conference. See also: Part 1, Part 2 & Part 4
Trent Walton, a web designer, and Nick Sherman, a typographer, were the next speakers at Ampersand NYC. Walton discussed what is possible now with web type while Sherman discussed what he hopes will be possible in the future.
Trent Walton: Get Your Hands Dirty
Trent Walton, founder of Paravel, explored techniques for manipulating webfonts in the browser to create a range of effects for display type. If you've read his articles, you know they're a showcaseforhismanyandvariedexperiments. He shared what he's learned and gave a detailed overview of the css properties and JavaScript techniques available. He was kind enough to share both the slides and coded examples from his presentation.
Transform Toolbox
Walton's talk was very practical and explored specific ways text can be transformed with css. The range of manipulations you can make in the browser is quite impressive. Masked textures can be applied to give type a distressed look. Text shadows can be used to apply sign-painter-like shade effects. Walton's examples were beautiful and inspiring, making me want to do some experiments of my own. One quick tip I jotted down: the best way to control color and transparency with css is to set color values using rgba (red green blue alpha) and hula (hue saturation lightness alpha). The A in each stands for alpha – as in alpha channel – providing easy control over the opacity (transparency) of a color.
Targeting Type
In order to transform text, you must first be able to target it. There are some helpful selectors in css that provide a good measure of control. For example, you can target the first letter or first line of an element using the pseudo selectors ::first-letter and ::first-line. However, pseudo selectors can still be somewhat limiting. For example, there's no way to target every even or odd letter within a word. Walton ran into this problem while working on Lost World's Fairs, a beautiful showcase of typographic explorations sponsored by IE9. The designs are very complex, and a solution for better targeting was needed. As a result, lettering.js was born. In Trent's words, it's a "glorified span injector," offering fine-grain control for targeting type.
More Tools
Walton's talk covered a wide range of specific selectors, techniques and tools. While checking out his slides or demos is the best way to really dig in, here are three specific tools that stood out:
FitText – Designed for display typography in responsive layouts, FitText is a jQuery plugin (created by Paravel) that resizes headlines based on the parent element's width.
CircleType.js – Built on lettering.js, CircleType is a jQuery plugin for setting type in a circle. I like the arcs – reminiscent of painted signs – that can be achieved with this.
OpenType sandbox – Created by Ampersand conference organizer Richard Rutter, this tool is a great way to explore css OpenType features within the browser. It's definitely something I want to explore more fully.
Nick Sherman: The Future of Responsive Typography
Nick Sherman, of Font Bureau and Webtype, was up next. Being a Webtype user and having read his articles for A List Apart, I was excited to hear him speak. It was obvious from his presentation that he wants typography on the web to be better. To begin, he pointed out that "everything is amazing" and that we're living in "one of the most exciting times in type history." At the same time, there are some things that we can't do today that just don't make much sense. He explored the problems, what we can do to solve them, and ideas for the future.
Basic Typography Support
One problem with current web typography is that it still lacks basic typographic controls. We should be able to reliably use OpenType features such as small caps and ligatures on the web. The reality, however, is that browser support is still spotty. The solution? “If enough people make enough noise to the browser makers, we can make them work the way we want.”[1]
Guessing About Size
One frustrating problem of setting type on the web is knowing so little about the size at which it will ultimately be displayed. In Sherman's words, "Decisions about size of type are largely guesses." Although we can query the size of a the user's viewport, we know very little about the screen's pixel density and physical size, much less viewing distance. It's possible to set units like inches and centimeters in css, but they don't correspond to those measurements in practice. Along this line, Sherman (along with other presenters) demoed Marko Dugonjić's experiment to use face detection to adjust the type size.
Size Calculator
Nick also demoed a project he created (in collaboration with Chris Lewis) called Size Calculator. It allows you to make calculations centered around the perceived size of type (or anything for that matter). It's a fun tool that has practical applications. For example, if you wanted type on a billboard to be a certain perceived size, you could calculate font size, provided you knew the billboard size and viewing distance. To prove its efficacy, Sherman showed off the results of a test to render the letter A on multiple devices at the same perceived size. For more, check out Jefferey Zeldman's post on Size Calculator written after the conference.
Dynamic Fonts
In thinking about fonts for the web, Nick proposed an interesting idea: dynamic fonts. The premise is that font families are usually designed as flexible systems – often with a large range of weights. However, these flexible systems are delivered statically on the web in the form of individual fonts. For each weight, a separate font has to be called. Instead, what if fonts were delivered in a format that could be dynamically adjusted based on a set of parameters? One font file could be served and then adjusted dynamically based on the context. This isn't an entirely new idea. Sherman made mention of multiple master fonts, an antiquated font format that allowed you to dynamically interpolate between the "master" font styles. In talking with him after the conference, he told me that, surprisingly, multiple master fonts are still supported in InDesign.
Up Next
The last two speakers of the day were front-end developer Jen Lukas followed by type designer Christian Schwartz. Continue reading.
This article is the second in a special series covering my notes from Ampersand NYC: The Web Typography Conference. See also: Part 1, Part 3 & Part 4
The second pair of speakers at Ampersand NYC was comprised of two people who create typefaces and webfonts – Jonathan Hoefler and Luc(as) de Groot. Not being a type designer myself, it was interesting to hear their perspectives.
Jonathan Hoefler: Putting the Fonts into Webfonts
Jonathan Hoefler, founder of Hoefler & Frere-Jones, was the third speaker of the day. Using the metaphor of an early, rudimentary bicycle, he explained the difference between putting fonts on the web versus designing fonts for the web. It was a rich and well-articulated presentation that I wish I could watch again. Jeffrey Zeldman called it "the greatest presentation I’ve ever heard on fonts for the web."
Hoefler Text
It was interesting to learn the origins of Hoefler Text early on in the talk. In comparison to hundreds of years of rich typographic expressiveness in print, fonts on the Mac in 1987 were very limited. The goal of Hoeffler Text was to bring that expressiveness to a digital font by including a wide range of features such as ligatures and small caps. Over twenty years later, Hoefler's goal was to similarly bring rich typographic expressiveness to the web, where it is largely absent.
"You Make Things in One Way to Experience Them in Another"
Hoefler explained that in type design, it can be required to "deform the typeface to get the result you want." For example, when designing an f for newsprint, the shape of the strokes is deformed where they intersect to create ink wells. When printed on highly absorbent newsprint, ink absorbs into the paper to fill these gaps. The end result is an f that looks normal.
H&FJ took the same approach to the creation of their webfonts. In order for their fonts to render well on screen – the way they would ultimately be experienced – they needed to "deform" their letters for better results. Their ScreenSmart fonts have been completely redrawn to display well on screen. It was quite striking to see an overlay of the standard and ScreenSmart versions of the same font. The divergence of letter shapes and spacing was quite profound. When viewed separately, however, they still looked like the same typeface.
Clarity at Small Sizes
Hoefler also explained that "typefaces are designed to solve problems." On the web, lack of clarity is perhaps the biggest typographic problem to solve. Fonts are at their weakest when set at small sizes due to the limited resolution of computer screens. Unfortunately, small text sizes are also precisely where fonts are meant to be read the most.
In order to achieve clarity at small sizes, H&FJ redrew their fonts as described above. This led them to create their own set of in-browser tools, which allowed them to see live previews of their fonts in the browser while they worked. These tools helped enable them to achieve their goal of creating fonts that performed as good or better than standard system fonts. In Hoefler's words:
If the font you might use isn't as good as Helvetica, why use it?
Family Weight Problems
Translating multiple weights of a font family to the web can also pose problems. The range of weights in a font can become muddy when viewed on screen. Different weights look lighter or heavier than they should due to limited resolution and anti-aliasing. The result is indistinct visual steps between each weight. To solve this, H&FJ reevaluated each of their ScreenSmart font family in terms of weights. Instead of attempting to maintain the range of weights from the original family, they designed new ranges based on how it would render in a browser. This ensured distinct and clear steps between each weight. As a result, some ScreenSmart font families have more or less weights than the original.
Expressive Features
Hoefler's love for rich typography expressiveness – especially small caps – was woven throughout his entire talk. To him, features such as small caps shouldn't be optional in a webfont:
Small caps are essential and not progressive enhancement. If you want small caps, it should work on your mom's browser.
To ensure they could deliver this kind of typographic expressiveness, H&FJ decided to build their own tools and interface to serve their webfonts. "We had to design the interface to give control over the features of the font." From the looks of it, their user interface for setting font characters and features is unparalleled.
Luc(as) De Groot: Readability Per Square Centimeter
The next speaker was Dutch type designer Luc(as) De Groot, founder of LucasFonts. Among many notable projects, he designed Calibri, which is the new default typeface of Microsoft Word. One of the first type catalogs I ever acquired was from LucasFonts, so I was excited to hear him speak. In his talk, he surveyed the parameters of a font that can be manipulated to optimize the balance between efficiency and readability.
Adjusting for Readability
The main focus of De Groot's talk was the idea of "readability per square centimeter." Starting with a set amount of text and a fixed column size, how can a font be custom-tuned to work its hardest? The goal is to fit the most words in the same amount of space while maintaining maximum readability. Given De Groot's history of work with various newspapers, you can tell this is a topic he's thought about a lot.
He showed a plethora of his own explorations with the concept. These explorations ranged from adjusting parameters that a designer has control over (eg type size, line length, line spacing, tracking, word spacing, etc) and parameters a type designer can change (eg shortening ascenders and descenders, varying letter width, and adjusting the grade of the font). His conclusion was interesting:
When you optimize all these parameters, it doesn't really matter what font you use. It takes a little effort. It's not necessarily elegant or beautiful, but it is necessary to make these adjustments to fit a lot of information in a small space.
In other words, if you can take control of all these parameters, you can bend most any font to your will in order to achieve a high readability per square centimeter.
Condensed Doesn't Mean Better Readability
To achieve a high readability per square centimeter, one's first thought might be to use a condensed typeface. Through his examples, De Groot showed that while a condensed font might fit more words in a space, they are often less readable due to their condensed letterforms. The takeaway is to explore adjusting the parameters of a normal-width font first to see if it can be adjusted to make a good solution.
Fingerprint of a Language
One fascinating section of De Groot's talk compared the relative efficiency of different languages. English, for example, is very efficient while German is less so. Arabic is perhaps the most efficient. Additionally, the prevalence of certain letter combinations is unique to each language. Viewing the space in-between letters reveals the unique "fingerprint of a language."
Foam Letters
De Groot interjected some varied, often humorous, asides throughout his talk as well. One of the most interesting was a brief section on foam-cut letters. Using blocks of foam and a foam-cutting machine, he creates large, three-dimensional letters. Using the foam as a form, he also created a large, concrete ampersand (I want one!) that lives in his garden. In talking with him after the conference, he explained that he is continuing to explore new materials, as the foam letters are quite delicate and the concrete letters are (obviously) quite heavy.
Up Next
Web designer Trent Walton and typographer Nick Sherman were the speakers for the next two talks. Continue reading.