
A parametric version of the Spectral font - tbassetto
https://spectral.prototypo.io
======
db48x
I guess they haven't heard of METAFONT.

------
JoshMnem
The heavily animated demo is worrying. Animation is making the Web very
unpleasant lately. It's extremely distracting when trying to consume text
content. Please don't animate your fonts.

------
derfnugget
Pre-link-click: Ooo another site by Google these are usually pretty cool; at
least they're well made... First impression: LOL this site was made by
Google?! Page load is atrocious. Interaction using mobile is very bad. Lasting
impression: This is like some weird developer designer hybrid that
encourages...I don't even know...Extra....Weird...serifs

~~~
DannyBee
I'm just about 100% positive at this point that Google had nothing to do with
this. I can't find anything internally that makes me believe we did (and i've
looked _really_ hard)

------
yladiz
What's the usefulness of this?

Part of the reason I ask is because while I would trust a UI designer to
design the layout, colors, for an application, I think font design isn't as
simple because there's a lot of factors that go into it, in some ways
scientific and some ways artistic. I wouldn't trust someone who isn't trained
in font/typeface design to use a tool like this.

Also: On Safari, this took maybe 5-8 seconds to load, and bogged down the
entire browser for that time. Afterwards it took a lot of power to render
something else on the page. For something that is only showcasing a font demo
to take up that much power is pretty crazy.

~~~
jandrese
I was thinking it might make more sense to design your font and then bake it
into something normal for the browser.

On the other hand, I can't imagine seeing myself going "I need something with
the Times New Roman curvature, but thicker serifs..."

------
peterburkimsher
I'm collecting Chinese fonts for a project for a deep learning course.

Is there a tool where I can generate TTFs with different parameters to change
the whole Unicode character set, not just ASCII?

~~~
rspeer
The number of fonts that cover the whole Unicode character set is zero, as the
Unicode character set grows faster than fonts are designed for obscure
scripts.

The fonts that come closest are Google's Noto Sans (an Android-esque font that
covers every script that's realistically in use), GNU Unifont (a monospaced
raster font, great for multilingual coding), and Arial (bringing standardized
mediocrity to the whole world).

These projects put a lot of work into finding one visual style that works
across many different scripts. I doubt you will find anything that works with
a parameterized range of visual styles across different scripts.

However, if you narrow your scope to fonts that just cover Chinese characters,
I believe I've seen some projects that parameterize how to draw the strokes. I
doubt the output will be neatly packaged in a TTF file.

------
joefkelley
I think the serif width / serif height axes are switched

------
smlacy
A system and method for letting "The Marketing Guy" choose and design the font
instead of a trained graphic designer.

This isn't going to end well.

Have you ever seen a font and thought "oh, that's ugly" but it's really hard
to put into words exactly why? Font design is all about aesthetics and custom
hand-tweaking every single curve of every single letter and making them look
exactly right.

~~~
dagw
The Marketing Guy already has access to hundreds of fonts with thousands of
variations, I fail to see how this will make a difference.

------
savolai
This site doesn't load at all on Firefox on OS X for me. Loading your
experience stays on indefinitely.

------
DannyBee
Does this actually have anything to do with Google? From what i can tell,
prototypo is a completely separate startup company with some per-month pricing
plan

If not, this looks like some bad trademark abuse, as everyone here seems to
think this is somehow done by Google :(

~~~
vitus
As far as I can tell, Spectral is listed in Google Fonts:

[https://fonts.google.com/specimen/Spectral](https://fonts.google.com/specimen/Spectral)

Beyond that, there doesn't seem to be a connection.

~~~
dang
OK, we've changed the title above from "Spectral, the first parametric Google
font".

------
smnscu
I've spent so much time playing with the parameters that now letters don't
make any sense to me.

edit: also it's absolutely gorgeous, well done

------
pavel_lishin
It looks really, really bad at my browser's current size:

[http://i.imgur.com/ZvyLwjB.png](http://i.imgur.com/ZvyLwjB.png)

[http://i.imgur.com/LC9cive.png](http://i.imgur.com/LC9cive.png)

~~~
ericfrederich
It's also cut off at 2560x1440 on a Chrome web browser. Dunno how anybody can
get excited about a font by Google that even Google can't figure out how to
layout properly in a Google browser.

~~~
Gigablah
It wasn't made by Google... it's only _hosted_ on Google fonts.

------
alikoneko
I really hope this doesn't become popular like Lato and Montserrat. This is
horrible to me as a dyslexic. It's near unreadable and distracting with the
constant size changes.

~~~
forgot-my-pw
I think the purpose is so people can create their own variations of the
available fonts, not to make animated text.

~~~
alikoneko
I really hope so. The web will be an unusable mess to me if fonts change size
on scroll like in their demo page.

~~~
eyelidlessness
They're just demoing the parameters you can adjust to build a font. I assume
they built the demo the way they did because it's more approachable for most
than a long list of sliders with names that might not be meaningful to a lot
of people.

That said, the way it works would certainly be off-putting to some. You may
find their actual font builder app provides a better experience:
[https://app.prototypo.io/](https://app.prototypo.io/)

------
svat
Parametric fonts are cool. I think it's a stretch to say things like "Opening
up to a new era of type design" though. Yes, the feature of "variable fonts"
was added to the OpenType specification somewhat recently, in September 2016.
But before that there was Adobe's "multiple master fonts", and even before
that, there was Knuth's METAFONT, something that _could_ have been a truly
"new era of type design" but never took off.

See [http://www.metaflop.com/modulator](http://www.metaflop.com/modulator) for
an example of parametric fonts, inspired by Knuth's system: you can drag the
sliders to adjust various font parameters, and get many different fonts.
Knuth's article _The Concept of a Meta-Font_ [1], published in _Visible
Language_ , is a classic. As you read the article he plays various tricks with
the fonts as he describes them; it's a delightful read. (His followup article
"Lessons learned from Metafont" [2] is also interesting.)

Unfortunately METAFONT as envisioned by Knuth never gained much adoption by
other font designers, for (AFAICT) two reasons:

1\. Douglas Hofstadter wrote a response [3] pointing out that it is not
possible to mechanize all typefaces into a single one, which although a valid
point (the article is great), attacks a straw man, arguing against an absurd
claim that Knuth never even suggested IMO. So some may have got the wrong
impression from it.

2\. More importantly, as Richard Southall or Chuck Bigelow (I forget who)
said, most type designers think with shapes; they don't think about shapes.
Only a mind like Knuth's would prefer to think deeply _about_ the shape of
each letter and come up with symbolic descriptions of each, parametrized
across the whole family (see Knuth's article _The letter S_ [4] on his
struggles with doing this for just one character).

Knuth has often said that we understand things better when we can teach them
to a computer, and I still have hope for a future with parametric fonts that
are better "understood": not because the shapes will be better, but simply
because humanity will be better off with a deeper understanding of
letterforms. But I think that whatever the technology, the task of
parametrizing shapes will run into similar challenges, some of which were
described in the above-mentioned articles and say Richard Southall's
_Designing New Typefaces with Metafont_ [5].

[1]: [http://www.zigzaganimal.be/elements/the-concept-of-
metafont....](http://www.zigzaganimal.be/elements/the-concept-of-metafont.pdf)

[2]: [https://s3-us-
west-2.amazonaws.com/visiblelanguage/pdf/19.1/...](https://s3-us-
west-2.amazonaws.com/visiblelanguage/pdf/19.1/lessons-learned-from-
metafont.pdf)

[3]: [https://s3-us-
west-2.amazonaws.com/visiblelanguage/pdf/16.4/...](https://s3-us-
west-2.amazonaws.com/visiblelanguage/pdf/16.4/meta-font-metamathematics-and-
metaphysics-comments-on-donald-knuths-article-161.pdf) /
[https://www.cs.indiana.edu/pub/techreports/TR136.pdf](https://www.cs.indiana.edu/pub/techreports/TR136.pdf)

[4]:
[http://www.cnd.mcgill.ca/~ivan/Papers/The%20letter%20S.pdf](http://www.cnd.mcgill.ca/~ivan/Papers/The%20letter%20S.pdf)

[5]: [http://i.stanford.edu/pub/cstr/reports/cs/tr/85/1074/CS-
TR-8...](http://i.stanford.edu/pub/cstr/reports/cs/tr/85/1074/CS-
TR-85-1074.pdf)

~~~
jandrese
I thought the problem was that font designers didn't like creating their font
in a text editor.

The whole system seemed to be designed to cater to users who were both
computer programmers and typographic artists. That's a demographic set that
may consist of a single member: Donald Knuth.

~~~
svat
Yes I agree, to a first approximation that's true. Dave Crossland (another
computer programmer who works with typography) has said similar stuff:
[https://www.youtube.com/watch?v=zwPObPbk90I](https://www.youtube.com/watch?v=zwPObPbk90I),
[http://understandinglimited.com/2008/07/24/why-metafont-
didn...](http://understandinglimited.com/2008/07/24/why-metafont-didnt-catch-
on/),
[https://www.tug.org/TUGboat/tb29-3/tb93crossland.pdf](https://www.tug.org/TUGboat/tb29-3/tb93crossland.pdf),
[https://speakerdeck.com/davelab6/anrt-2016-why-didnt-
metafon...](https://speakerdeck.com/davelab6/anrt-2016-why-didnt-metafont-
catch-on)

This is related to the "thinking with shapes" versus "thinking about shapes"
comment.

But looking more closely, there were a few people who made fonts with
Metafont: Georgia Tobin, Neenie Billawala etc. made a few, as did a lot of
people working with non-Latin scripts: e.g. Frans Velthuis and Charles Wikner
made really nice Devanagari fonts. (See "The Many Faces of TeX" for Metafont-
fonts as of 1988:
[https://www.tug.org/tugboat/tb09-2/tb21wujastyk.pdf](https://www.tug.org/tugboat/tb09-2/tb21wujastyk.pdf)
\-- that was probably their peak though.)

Still you're right, no "mainstream" type designers switched over.

------
nayuki
This concept of a parametric font is the modern-day reincarnation of Donald
Knuth's
[https://en.wikipedia.org/wiki/Metafont](https://en.wikipedia.org/wiki/Metafont)
.

~~~
amyjess
There's also some of Adobe's Multiple Master fonts in there, too:
[https://en.wikipedia.org/wiki/Multiple_master_fonts](https://en.wikipedia.org/wiki/Multiple_master_fonts)

~~~
basch
[https://web.archive.org/web/20010104101800/webcom.net/~nfhom...](https://web.archive.org/web/20010104101800/webcom.net/~nfhome/fontgen.htm)

------
placeybordeaux
The constantly changing box is almost impossible to read.

~~~
pc86
It's a good thing you would never do that for text you wanted someone to read,
and would only do it to show what you can do with the font.

~~~
anigbrowl
_You_ would never do that. You probably wouldn't commit any of the other
extremely common typographical/design sins out there either, and yet the web
is awash in ugly design.

------
lwlml
Page explodes for me into an unhappy tab, on OpenBSD/Chrome at least.

------
Aeolun
This is a great example of a terrible website.

------
a_imho
Does not load for me, CORS request failed

------
Yhippa
...is this a good thing? It seems so? Being able to fine-tune your fonts seems
like it's better than using something static.

------
nimish
Iosevka is also parametric, but fixed for a given TTF, as far as I can tell.

Very nice for coding.

[https://github.com/be5invis/Iosevka](https://github.com/be5invis/Iosevka)

~~~
dgfgfdagasdfgfa
Parametric fonts go back to at least metafont.

Pretty sure you can do all the transformations indicated on the page in
'native' metafont.

~~~
theoh
The involvement of Metafont with parametric design doesn't necessarily mean
that it's a sound typographic principle. As others have mentioned,
professional font design is a business of total perfectionism and
particularity: you can't really parameterize a font family in a totally
satisfactory way (and italic is not in general just an oblique transformation
of the standard characters).

This parametric approach is most likely to work if used with a "curve-fitting"
mentality to approximate and interpolate sets of hand-tuned characters, rather
than a methodology that aims to describe the essence of a character
parametrically (as is routine in architectural parametric design).

~~~
Ericson2314
This is like arguing linguistics is invalid because language is art.

~~~
theoh
Trust me, reducing a typeface family to a parametric formula with continuous
and valid/beautiful transitions between the various fonts, let alone weights,
requires superhuman intelligence and effort.

I'm claiming that the scope of parameterized fonts is limited, in an analogous
way to linguistics not trying to explain poetry.

------
anigbrowl
_Imagine shop windows that react according to the movements of passers-by_

I would prefer not to.

~~~
Mindless2112
Not font related, but I'm imagining this --
[http://hackaday.com/2010/10/15/window-curtain-moves-to-
scree...](http://hackaday.com/2010/10/15/window-curtain-moves-to-screen-
pedestrians/)

~~~
anigbrowl
I have to admit this is oddly delightful

------
ChuckMcM
Wow, this could be so GeoCities. Remember that a proportionately small, but
numerically large, number of people really like blinking text. :-)

~~~
cat199
Teh feutur iz now

[http://www.wonder-
tonic.com/geocitiesizer/content.php?theme=...](http://www.wonder-
tonic.com/geocitiesizer/content.php?theme=1&music=4&url=https://spectral.prototypo.io/)

------
fnovd
Very cool. I'm seeing a future where fonts are stored as a series of
transformations rather than a bunch of bitmaps/glyphs/vectors. A client could
have specifications for adapting any font to make it more readable for their
particular set of eyes while letting the font maintain a unique "look".

~~~
eyelidlessness
The vast majority of fonts are not stored as bitmaps. Most font formats store
glyphs as vectors with a variety of additional information for pixel hinting,
ligatures and probably a handful of other details that I can't even think of
off the top of my head.

~~~
phlakaton
Right. They're even parameterized, in a sense, but pretty much the only
parameter available on the client side is size, right? (Unless I misunderstand
how boldface is applied these days.)

~~~
eyelidlessness
I think Prototypo demonstrates the parameterization is possible, but typically
(for now) font weights are distinct fonts. Sometimes boldness or italics can
be naively faked, but it's usually not pretty.

~~~
phlakaton
Right – I meant even traditional fonts could be seen as "parameterized" if you
were squinting at them through a slightly foggy lens. :-)

------
throwasehasdwi
What a wonderful way to add massive complexity to font rendering while
delivering spectacularly little value.

Don't get me wrong, it's cool, I just don't see the point. And I don't look
forward to my battery life being used for pointless sugar.

~~~
svat
Best not to confuse this _demo_ of their parametric font, with the idea of
parametric fonts in the first place. This page tries to vary the font as you
scroll etc., which is just a (suboptimal) way of interactively demonstrating
the font parameters, but not the point.

For a better demo (that does not use the same tech), see
[http://www.metaflop.com/modulator](http://www.metaflop.com/modulator) \-- you
vary the parameters, then a fixed font is generated that you can download and
use. (I mentioned this in another comment below:
[https://news.ycombinator.com/item?id=14604890](https://news.ycombinator.com/item?id=14604890))

As for the value: the entire Computer Modern family of typefaces (used in
TeX/LaTeX and friends) was generated with METAFONT which embodies the idea of
font generation through "pens, programs, and parameters" \-- the regular,
bold, italic (even typewriter) variants of the font, and at various point
sizes, are generated from common font definitions. Similarly the shapes of the
loops in say p and d, etc. This ensures consistency and lets you experiment.
(Though to be honest, very few people have successfully designed good font
families with this approach.)

The articles that I mentioned in the other comment are better at seeing what's
the point.

~~~
maxwelljoslyn
That metaflop link is not only a great visual example of what makes this tech
cool, but is also fun to use. The immediate feedback which shows input-output
relations reminds me of fun had while messing with character-creation sliders
in games like Elder Scrolls and Dark Souls.

