Advertisements

Brick by brick: News about FontStruct


Posts from Stephen Coles


Connected Script Competition Results

Last month, when we challenged you to emulate handwritten scripts using only the grid and bricks of FontStruct, it could be argued that we contradicted the very nature of modular type. But we’ve learned through experience — and four other competitions — that this tool is limited only by the imagination of our FontStructors. As we expected, many of you rose to this difficult challenge. It was tricky for the judges, Rob Meek and myself, to pick winners from the 56 entries, many of which were quite innovative, original, and appealing. But after comparing notes (and a bit of cheerleading here and there) we agreed on three clear champions in the Connected Script Competition.

And the winners are…

Each of our three selections answered the “Connected Script” call in their own unique way, and they demonstrated skill and creativity above and beyond the other entries. Without further ado, let’s look at each of these FontStructed scripts in more detail.

Stiff Script by Upixel

Michel Troy (Upixel) strikes a self-deprecating note when he describes his entry as a “very rough script” with glyphs that are “very unsightly”. But he acknowledges that, when its letters are combined to form words, Stiff Script has an undeniable charm. The judges recognized that on very first glance. Its pieces are linked with a very simple 45-degree stroke, yet Stiff Script manages a very even, handwritten flow despite the inherent rigidity of its forms. The sprightly, angular effect is reminiscent of the lively lettering found in mid-century advertising, logos, and signage. Still, the overall feeling of this design isn’t necessarily retro, as observed by four, a fellow Scriptcomp champion. The character set is essentially lowercase only, which freed up the uppercase slots for alternate “initial” forms that can be used to start words in a cleaner, more natural way.

Jalgas by architaraz

Over his last couple of years on FontStruct, the Kazakhstan-born, Shanghai-based Zhalgas Kassymkulov (architaraz) has gained a reputation for creating inventive lettershapes and building fonts with an organic flow. So it’s no surprise that he excelled in the Script Competition. From a purely typographic perspective, Jalgas is the most imaginative design in the competition, with many glyphs that, while still legible, are entirely new. Despite a slightly irregular rhythm, words cascade gracefully across the screen. Zhalgas even noted that his design can survive (maybe even thrive?) with a faux italic skew. There is a lot to praise about Jalgas — more than we have space to detail here — so I’ll just finish off with the astute comments of will.i.ૐ:

Wickedly stylish. I love your use of propeller bricks in the connections and the implied dimensionality of the bridged loops. Script and stencil. Nice!

lupo by four

Among the handful of finalists under consideration by the judges, lupo generated the most discussion and controversy. If this font were to stand on its own, outside the context of the competition, no typographer would classify it as a “script” typeface. Still, we cannot deny the sheer ingenuity displayed by Paul Bokslag (four) in his response to the core requirement of the challenge: connections. Each glyph is wider than its sidebearings and features a gap, like an open circuit, that is closed only when another letter follows and overlaps its neighbor. Every word creates a continuous line that runs over the top and bottom of letters, looping at their connections. But lupo isn’t just a gimmick. The shapes of the letters themselves are interesting — bulbous and bold, the kind of friendly, engaging design that could be put to good use on product packaging or a children’s book.

In my brief for the Connected Script Competition I was painfully vague about the definition of script. So, as if in open defiance of that term, Bokslag focused on a connection scheme so brilliant it simply must be rewarded. Well done, sir.

lupo was incidentally also the “People’s choice” with the most number of favorites when the deadline passed.

Honorable mentions

There were so many strong and prizeworthy entries, we can’t mention them all, but FontStructions which were discussed in the latter stages of judging included:

db Lineo by beate – interesting, useful and attractive. A winner on another day.

Artificial Script by 1saac – part of an impressive, coherent and growing family.

The Ugly Script by cablecomputer – finely-crafted crudity. Not ugly at all.

Neonic by CMunk – “The letters connect to each other, even though they are unconnected to themselves”. Profoundly metaphysical FontStructing!

Djangogh Unpenned by will.i.ૐ – the FontStructing pioneer exhibits his wonderful, unique style and astonishing attention to detail.

Emblazoned by aphoria – A top-drawer “connected chrome” script. I can’t wait to see this one cast in metal.

and zelemin eYe/FS by elmoyenique – entering four competitions at once. It’s an outline, a stencil, an italic, and a script font. And it works!

Thanks!

Winners will be contacted by email to be faced with the choice of either a signed and numbered FontStruct poster, or a signed copy of the book The Geometry of Type. Thanks to all entrants and bantering bystanders for another great competition. FontStruct is in many ways a collaborative community and we were especially heartened by the way so many participants commented on the entries of others, lending technical support, design feedback, and sincere well wishes.


Competition: Connected Script

The FontStruct community has proven that its members can breathe life into the grid, make the organic from the static, and push modularity to its creative limits. That’s why we have no qualms in assigning you with a formidable challenge for the next FontStruct competition: scripts!

This, of course, raises the question: what is a script? It’s a fair query. Some define the classification much more broadly than others. Scripts are most commonly and fundamentally derived from writing, but that leaves a lot of room for variation and interpretation. A formal copperplate script is as worthy of the title as the freehand bounce of a sign painter’s brush.

Must the letters be connected? Not all handwriting is cursive, after all. Some folks lift their pen off the paper from time to time, or even between every letter, as in the case of “print” writing.

Professional script typefaces from FontShop

These professional typefaces from FontShop offer an idea of the variety of lettershapes and stroke connections that scripts can embody. From top to bottom: Tangier, FIG Script, Bickham Script, Cottingley, Handsome, Bery Script, BistroScript.

In the end, scripts always reach back to a common ancestory: handwriting. But must it look like it was made by hand? A typeface can be as geometric and constructed as FIG and rightfully be called a script. And we’ve already challenged you to explore the “handmade”. So, for this competition, the core requirement will be a connected script.

Design your FontStructions so letters connect in the most natural and/or innovative way. Keep in mind that connections don’t always need to be at the baseline, or share a common height, throughout the glyph set. And if a letter just doesn’t feel right with a connection, omit the link. (BistroScript, for example, flows naturally, even though it’s ‘s’ doesn’t meet neighbors to the right.) With this guideline in mind, you’re allowed up to 5 linkless lowercase glyphs. Your uppercase, numbers, and punctuation don’t need to connect — but they may catch the jury’s eye if they do!

Other than that, the brief is fairly open. For this competition, as long as your lowercase glyphs are independently distinguishable and connect to each other, it’s a script! Of course, the judges will be looking for original and well-executed entries overall, but they will focus on the most graceful or inventive connections. It’s all about the flow.

Connected FontStructions

While it’s the most underrepresented category on FontStruct, there are several notable scripts in the Gallery. Here are some fine examples of what can be done. Top to bottom: High Voltage (shasta, featured in PCWorld), Bromance (em42), fs grayletter (thalamic), Dry Heat (CMunk, a set of three fonts for connection options).

Competition Time Period

May 23 – June 14, 2013

Competition Rules

  1. You must be a registered FontStruct user.
  2. Your submission must have a connecting lowercase, with up to 5 exempt (unlinked) glyphs.
  3. Your submission(s) must be posted and made “public” between May 23 – June 14 2013. Although you are encouraged to share your submission(s) at any time between these dates, your FontStruction submission(s) must be public (marked “share with everyone”) no later then June 14 at 11pm PST. Additionally, your submission(s) must remain public until June 30 in order to give the judges enough time to review all qualifying entries.
  4. Your submission(s) must be tagged with a “Scriptcomp” tag. (For fairness, during the competition time period, no FontStruction with the “Scriptcomp” tag will be awarded a Top Pick or be available for a Featured FontStruction pick.)
  5. Your submission(s) must be downloadable. If your FontStruction cannot be downloaded, the submission will be disqualified.
  6. Your submission must be a newly published FontStruction. Simply adding the “Scriptcomp” tag to an already published font is not allowed.
  7. For each submission, you must post at least one sample image in the comments of the FontStruction.
  8. No letters in each submission can be MORE THAN 48 bricks high.
  9. FontStruct cloning is permitted but the judges will be looking for original work.
  10. You may enter up to three FontStructions to the competition.
  11. This is a friendly competition. Cheering, favoriting and fun banter is encouraged but cruel and uncivil behavior will not be tolerated.
  12. No rules regarding licensing. You may choose any Creative Commons license you like for your FontStruction.

Tips

  • The new Kites, Shards, and Fins bricks may come in handy for this genre.
  • Connecting strokes can be part of each glyph, or they can be a separate character (such as the space) that elegantly binds letters together.
  • Connecting strokes can be on either side of the glyph — or both!

Judging and announcing the winners

All qualifying FontStructions will by judged by the FontStruct staff and guest judges, June 15–30. Three prizewinners will be chosen. One of these will be the FontStructors’ Favorite. Winners will be announced in a FontStruct Blog post on July 2.

Prizes

Each winner will receive their choice of

In addition, all winners will have their winning FontStructions posted as Featured FontStructions for two weeks after the winners are announced.

FontStructors’ Favorite

The valid entry with the greatest number of legitimate favorites at 11pm PST on June 14 will be one of the three prizewinners.

Spread the Word

Tell your friends. The button floating above every FontStruction is a really quick and easy way to point your friends and followers to your work. Maybe you can drum up some more  favorite s for your entry in that way, or entice some novice FontStructors into the game.

Questions?

If you have questions just add them as comments to this post.

Let’s get FontStructing!


What makes a complete font?

When you open the FontStructor you are presented with that familiar row of character slots sorted alphabetically. If you’re like many FontStruct users, you build your FontStruction by following these slots in order — starting with the caps, then plodding along, drawing one character after another, through the lowercase, numerals, and basic punctuation until you finally reach that lively little tilde (~) that seems to wave like a victory flag: “You’re done!”

But are you done? Not if you want folks in Sweden to use your font. Or Denmark. Even Germany, France, or Spain will take a look at the fruit of your tireless labor and find it woefully incomplete. The countries of Eastern Europe are out of the question. Not to mention the rest of the world.

Above: On the left is my WPA Gothic, a FontStruction I was pretty proud of … until I saw what an uneducated slob it is! The font has about 200 glyphs but it’s still missing the characters necessary just to set a simple sentence in languages commonly used throughout the Western world. By contrast, the multilingual Modular Blackout Bold Condensed is capable of all these languages except the oft-neglected Vietnamese. (Language labels set in Renovare S2. Missing character boxes set in IconoMono.)

A 26-glyph, 52-glyph, or even 200-glyph FontStruction can be a useful exercise for prototyping and experimentation, but it is rarely considered a working font. So let’s look at what else your font needs to advance beyond a fun little piece of art to a truly useful tool.

Basic Latin

In the interest of simplicity this initial row in the editor is limited to only the bare minimum of letters and punctuation. Thus the title of the character group: “Basic Latin”. And while 100 or so glyphs seem like a lot — especially when you’re limping through the set of a particularly challenging design — this group of characters is really not enough to say more than a few things in English.

What’s missing? Accented characters (or diacriticals), of course. The bits that English-centric folk might consider superfluous appendages or “extra” characters are actually standard and necessary in other languages. In Spanish, the n and ñ are individual and distinct letters of the alphabet, each with an identity and pronunciation of their own. In French, a mouthful of sablé (cookie) is more desirable than a mouthful of sable (sand). In German, you can get by without an ß (eszett) by typing ‘ss’ but in most cases it’s linguistically incorrect. And none of this even touches non-Latin languages like Russian (which uses the Cyrillic writing system) and Greek.

So what makes a complete font? The answer isn’t so simple. In fact, an absolutely complete font probably doesn’t exist. Fonts that are bundled with operating systems have a massive arsenal of characters, covering most of the Western world, but even most of those don’t speak languages like Arabic, Hindi, or Chinese.

More Latin

But lets take a step back and assume you want your FontStruction to be usable in at least the most common languages that use the Latin script. Head on over to the character set menu and move beyond Basic Latin to More Latin. This set covers much of the Western world, from North and South America to Western Europe. Even Turkish is supported. Not counting the extra punctuation, fractions, and currency symbols at the end of the row, it’s 65 more glyphs to build. Feeling overwhelmed? Don’t despair — many of these characters are variations on letters you’ve already made. With a few exceptions, you can get by with a copying, pasting, and adding a diacritical mark. The “Copy to Latin Accents” command in Expert Mode expedites this process. If legibility and cultural sensitivity is important to you — and it should be! — take some time to learn how these marks are designed and placed. Microsoft’s Character Design Standards and the Diacritics Project are very helpful guides. Once you complete these characters your work is on par with the entry-level of most commercially available fonts.

Extended Latin A

If you want your font to get play in the countries of Central and Eastern Europe you’ll need to graduate to Extended Latin A. This range covers languages like Croatian, Czech, Finnish, Hungarian, Latvian, Polish, Romanian, Serbian, and Slovak. Once you cap that last ‘z’ with a caron you will have completed a font with the same linguistic chops as the most premium commercial releases. Products with this extended language support are often stamped with a “Pro” label (see Adobe and FontFont’s definition) and are sought after by multinational corporations, publications, and any organization whose interests are global.

Punctuation

So you’ve got the letters necessary to speak all the languages you want to support. But you can’t string together meaningful sentences without punctuation. While there are myriad esoteric symbols for specialized fields like music, math, and science, let’s focus on the basic punctuation required for written texts in most Western languages. The obvious necessities are:

  • period (.) comma (,) semicolon (;) colon (:) and ellipsis (…)
  • question mark (?), and its inverted form, used in Spanish (¿)
  • exclamation marks (!¡)
  • straight quotes, single (') and double (") — though they really have no proper typographic function, computers have made them the default quote mark
  • proper “curly” quotes, single (‘’) and double (“”)
  • some languages, like French and Swiss German, quote with guillemets («» ‹›)
  • …which are not to be confused with the lesser- and greater-than symbols (< >)
  • dashes in their three most common lengths: hyphen (-), en (–), and em (—)
  • underscore (_)
  • currency symbols ($ ¢ € £)
  • and other numerical punctuation, the percentage sign (%) degree (°) and number sign/octothorp (#)
  • ordinal indicators are not commonly used in most languages, but (ªº) are expected in Latin-based languages like Spanish, Italian, and Portuguese
  • basic math symbols like plus (+) and equals (=) are necessary, while optional bits are the minus (−) division sign (÷) plus-minus (±) not equal to (≠) and multiplication sign (✕) — which is not the same as the letter ‘x’ as it should vertically align with numerals
  • asterisk (*) bullet (•) and middle dot (·) a smaller, less conspicuous bullet
  • at sign (@)
  • ampersand (&)
  • parentheses (()) brackets ([]) slashes (\/) and pipe (|)
  • registered (®) copyright (©) and trademark (™) signs

What punctuation could be considered optional?

  • curly brackets {} are not required for most uses, but they are indispensable for most programmers and can often come in handy when an alternative bracket is needed
  • the section sign (§) pilcrow (¶) and daggers (†‡) are rarely used in modern typography, but can serve as decorative paragraph separators or footnote indicators
  • single and double primes (ʹʺ) are used for units — like minutes and seconds, or feet and inches — and should have their own specific design, but most users end up employing the more accessible straight quotes
  • currencies like the Japanese yen (¥) and Indian rupee (₨ or ₹) are less common in the West where the dollar, euro, and British pound reign, but they are important in their respective regions
  • directional and decorative symbols like arrows (→) manicules (☞) checkmarks (✓) and stars (★) are not necessary for written text, but can certainly make a font more useful
  • most users don’t expect a full set of numerator and denominator figures for making arbitrary fractions but these thirds (⅓⅔) and fourths (¼½¾) are often included

Are we there yet?

So what is a complete font? If FontStructing is simply a relaxing hobby, then the answer to that question is entirely up to you, the designer. But if you intend your font to live a life outside of the FontStructor, it is ultimately up to the user. And their definition of “complete” is based on a combination of their particular needs and expectations derived from other professional fonts. No matter how inventive or appealing the design of your alphabet may be, if your font is missing what your user needs, they will likely move on to a more well-equipped option.

We hope this introduction familiarizes you with the characters and symbols that are commonly neglected, so your hard work won’t be.

Stephen is a writer and typographer living in Oakland and Berlin. After six years at FontShop San Francisco as a creative director, he now publishes Fonts In UseTypographica, andThe Mid-Century Modernist, and consults with various organizations on type selection.

 


FontStruct in Transit

Regarding recent technical problems …

Update 12. April: Everything should be pretty much back to normal. We’re on a new hosting platform now which should allow us to increase capacity more easily in the future. Thanks for your patience everyone.

P.S. Especially for French users of FontStruct, and thanks to Francine from Brussels, we added a “no-break space” character at the end of the “More Latin” character set.

Update 5. April: All “invisible” FontStructions should now be visible. No data was ever lost, it was just a problem with displaying some larger FontStructions. There are however still some teething problems generally with the performance on the new hosting platform. You may have noticed pages loading slowly. We’re working to improve this as fast as we can.

Original Post 2 April

If you’ve visited FontStruct in the last few days you may have experienced one of the following unpleasantries:

  • The site doesn’t load.
  • The site loads with a “FontStruct is under maintenance” page.

Fear not. We’re on it. We regret any downtime, but some of these conditions are symptoms of a hardware failure related to our old servers and others are inevitable issues caused by our recent move to a new, more reliable hosting platform. The short story is: everything will get much better very soon.

Some users have expressed concern that their FontStructions are not loading. Let us know if you’re in this camp. We do have backups of all data and we’ll do our best to bring your work back to the most current version possible.

Otherwise, the site is safe and operational. Go ahead and resume regular FontStructing and let us know if you encounter any unexpected behavior. We’ll bring you more info as soon as our tech folks get back from under all the cogs and wires.


FontStruct at Pecha Kucha San Francisco

Attention Bay Area FontStructors! I’m very sorry for the late notice, but I’ve just confirmed that I’ll be presenting FontStruct at Pecha Kucha tonight. The event is a high-speed, entertaining way for creative folk to show off their work. Each presenter shows 20 slides for 20 seconds each, ensuring that you’ll never be bored. Come check it out — even if you’re an old FontStruct pro — I’ll need you there too hoot and hollar your support of the site (or shout out any key points I’ve missed).


Meet Me at Pecha Kucha Night in Buffalo

The center of the typographic universe will be in Buffalo, NY next week as TypeCon holds its annual proceedings. If you are anywhere nearby Thursday—Saturday you shouldn’t miss this opportunity to see Erik Spiekermann and scores of other interesting speakers and workshops. FontShop is a proud sponsor of the conference and has a few tickets to give away, so go get ’em!

As a TypeCon warmup, I’ll be at the Pecha Kucha Night on Tuesday, July 15 presenting FontStruct. Most of what I say won’t be news to veteran ’structors but you should show up anyway to heckle me while I attempt to explain FontStruct in 6 minutes and 40 seconds.


FontStruct in the New York Times

Last week we opened our Thursday edition of the New York Times and were delighted to see the words “FontStruct.com” staring back at us. Peter Wayner wrote an interesting piece about the trend of do-it-yourself font making. FontStruct was an ideal subject for the topic and the first service mentioned in the story, along with some commentary from a FontStructor who is fast becoming a celebrity around this parts for his complex creations, Gene Buban (AKA geneus1).

Earlier in the month FontStruct was given even more digital ink from the online magazine Slate. Writer Jason Fagone articulated a reaction we’ve experienced many times here in our office:

“… as often happens in art, aesthetic limitations breed creativity. The most ambitious FontStruct users have created letterforms so ornate you’d never believe they’re derived from a set of prefab shapes.”

As well as the pure joy in using the app:

“This instant-gratification quality is the true appeal of FontStruct … There’s something about that moment when your own letters begin to flash across the screen.”

Rounding up the recent press coverage is a plug from one of our favorite magazines, ReadyMade, with a fitting metaphor:

“The process is a little reminiscent of Tetris, but without the overwhelming feeling that sets in when the pieces start dropping at an impossibly rapid pace.”

Wonderfully put. In the interest of keeping FontStruct stress free, we promise not to add any obnoxious video game music or imposing time limits to the editor in the near future. As for FontStructions inspired by Tetris, that we whole-heartedly support.


Calling All Torontonians

Canada’s newspaper The Globe and Mail is looking for FontStruct users living in or near Toronto for an upcoming story about FontStruct. If you are interested and meet the qualification, please post a comment below or contact us and we’ll put you in touch with the writer.


Loved to Death

We apologize to those of you who couldn’t connect to FontStruct late last week. Over the last few days our servers were hit hard by adoring hordes from hundreds of sites, including the behemoth Slashdot which unleashed a tsunami of new traffic we couldn’t absorb, and two of our favorite blogs: Coudal and Kottke. We’re doing our best to brace the servers against future onslaughts so there will be minimal downtime. Thanks for your patience.


Screencast: Intro to FontStruct

FontStruct was designed to be self-explanatory. We built the editor so that anyone, without any type design or technical experience, can get started right away. But it’s always nice to have a moving, talking guide. So, here’s our first screencast: an introduction to FontStruct. Let the soothing Scottish timbre of FontStruct creator Rob Meek guide you through the basics of the application.

UPDATE: Please note, FontStruct has been enhanced since this screencast was recorded. There are some minor differences between the interface shown in the video and that in use on the site.

Continue reading…