
The Interface font family - glhaynes
https://rsms.me/interface/
======
DiabloD3
Dear font authors:

Please screenshot renderings via multiple important renderer, important ex:
Apple Safari on a Retina box (highlights weird over-bolding due to their
hinting prefs), Chrome and Firefox on Windows (both use Freetype, but custom
builds and don't quite match stock), and anything normal on a Linux that
doesn't use a hacked up Freetype (ergo Ubuntu is out, so is RHEL/Centos and
Fedora).

Also, in both white on black and black on white, because font rendering is
non-linear in respect to the 2.2 gamma curve (fun fact: everybody still uses
1.8 gamma for font rendering).

~~~
FireBeyond
> anything normal on a Linux that doesn't use a hacked up Freetype (ergo
> Ubuntu is out, so is RHEL/Centos and Fedora).

Your definition of "normal", "important" Linux _excludes_ Ubuntu, RHEL/CentOS,
and Fedora?

I get your point about hacked up FreeType, but given that the three largest
distributions on the planet are excluded from your list doesn't really gel.

~~~
beefsack
Aren't the FreeType patches less relevant now since the new v40 interpreter[1]
was released?

[1]: [https://www.freetype.org/freetype2/docs/subpixel-
hinting.htm...](https://www.freetype.org/freetype2/docs/subpixel-hinting.html)

~~~
noir_lord
Ubuntu is still much better out the box than Fedora (though it's a simple fix
with freetype-freeworld) on none-HiDPI screens - though it's subjective
obviously.

------
jack_jennings
This is based on Roboto (reusing some outlines directly; not initially
acknowledged by the designer on the marketing site), and arguably doesn't
tread much new ground either in character or use-case or license. Not
convinced there is anything this adds to an already crowded space.

~~~
rasmusfabbe
Hello Jack. I'm the creator of Interface. Indeed many glyphs's outlines comes
from Roboto (though fitted into different glyph boxes.)

The "playground" feature of the website even has a feature for comparing
Interface with Roboto. When you do, and you look at the details, you'll find
that Interface is actually quite different from Roboto, at least as far as
"different" goes with utilitarian UI fonts.
[https://rsms.me/interface/lab/?size=22&compare=roboto](https://rsms.me/interface/lab/?size=22&compare=roboto)

~~~
jack_jennings
Hi Rasmus, I think that at the point size at which this is meant to be
used—e.g. around 11px
([https://rsms.me/interface/lab/?size=11&compare=roboto](https://rsms.me/interface/lab/?size=11&compare=roboto))
—the differences between the two become harder to distinguish. The issue is
really that the character of the type is going to be dictated by the
systematic decisions: stroke weight, x-height, proportion, spacing. Starting
from Roboto and not changing these parameters in your solution means
drastically limiting how far away from the original source that you can
realistically get. In the end, changing the stroke endings and changing the
bounding box of some characters in invisible in the intended use case.

Here is a screenshot comparing Roboto (11.5px) to InterfaceRSMS (11px), which
illustrates: [http://imgur.com/a/nl5mp](http://imgur.com/a/nl5mp)

There are plenty of UI typefaces out there that take a noticeably different
approach, an easy comparison to Lucida Grande is probably enough to justify
the point. (EDIT: for completeness,
[http://imgur.com/a/CjD06](http://imgur.com/a/CjD06))

~~~
davidad_
FWIW, I do find Interface to be subjectively noticeably more pleasant than
Roboto in the comparison here.

~~~
jack_jennings
The comparison is not great for objective comparison—the metrics of Interface
have been changed so that 11px =/= 11px from one to the other… this was the
best approximation that I could get in-browser. Usually you'd want to set the
two typefaces up so that the x-height is the same, and in this case Roboto is
probably slightly larger still, and hence a bit darker in overall color.

~~~
rasmusfabbe
Actually, I think you want to compare apples & apples, meaning Font A and Font
B at the same size and line height.

~~~
jack_jennings
Except that isn't how font metrics work—the size of the type on the body is
not necessarily equivalent between two different fonts. There is no stanard
that says that 12pt Times shares any vertical metrics with 12pt Helvetica, or
12pt anything else.

The most informed comparision can be made when the x-height is optically
equivalent. The other option, cap height, isn't as useful because it is then
harder to judge the lowercase (a majority of the letterforms).

------
thinbeige
A disproportionate sans serif without any letter spacing. It's free though, so
better than nothing.

 _Edit: Dear downvoters, what I am saying is that you can take any ramdom sans
serif, reduce the letter-spacing and you end up with a similar looking font
face which might be even more balanced. Despite my criticism, I expressed my
high appreciation that the creator offers his work for free. If you disagree
let me know why instead of downvoting, maybe I am wrong and missed something._

~~~
jlgaddis
> _Please resist commenting about being downvoted. It never does any good, and
> it makes boring reading._ [0]

[0]:
[https://news.ycombinator.com/newsguidelines.html](https://news.ycombinator.com/newsguidelines.html)

~~~
khedoros1
IMO, it's balanced out by the fuller explanation of what they intended to say
and the request for clarification of what was wrong. It's not like they just
added a "Why am I being downvoted?" without adding any further value.

------
tgsovlerkhgsel
Sadly, digits have a different width, so if you have e.g. a right-aligned,
increasing numerical value in your UI, the left digit of it will "wiggle
around" if the last digit iterates through 0-9, and if you have numerical
values, they won't align.

This may be OK for text, but specifically for user interfaces, this is the
very first thing I check when considering whether a font is usable.

With a good font, it will be immediately obvious which of these amounts is
more, while this font would likely mislead you:

$ 100000

$ 111111

Ironically, Roboto seems to get it right.

~~~
rasmusfabbe
Normally this is done with "tabular numbers", an alternate set of glyphs in
the font where all digit glyphs is equally wide. However, another feature a
font can provide is "proportional numbers"—the inverse of tabular numbers.
Most fonts usually provide one or the other. Roboto for instance provides
"proportional numbers" as an option, and uses tabular numbers by default.
Interface by contrast uses proportional numbers by default, and the plan is to
add tabular numbers as a feature that you opt in to for the scenarios you
point out (e.g. tables.) In CSS you'd opt-in to tabular numbers with: `font-
variant-numeric: tabular-nums`

~~~
rasmusfabbe
Tabular numbers added and will be included in the next release (1.2)
[https://github.com/rsms/interface/issues/10#issuecomment-324...](https://github.com/rsms/interface/issues/10#issuecomment-324559439)

~~~
majewsky
What is the rationale for defaulting to proportional numbers? I always assumed
that "tabular numbers" are just "numbers", and deviating from that standard
sounds like a recipe for needless confusion. Sure, you can flip a CSS switch,
but how many webdesigners know that these switches even exist? And what about
native UI frameworks where these switches don't even exist?

------
AceJohnny2
Looking at Interface's glyph map, I see that letter-O (O) is slightly wider
than number-zero (0). Capital-eye (I) is indistinguishable from small-ell (l),
though number-one (1) is distinguishable from both.

What other glyph ambiguities do you look out for on new fonts?

~~~
jack_jennings
Slashed 0 and Ø in nordic countries.

Though not abiguous in sharing the exact same shapes, many characters can
share similar structures that (arguably; citation needed) can cause visual
confusion. For example;

3 and 8 in a typeface like Helvetica are very similar. Opening the aperture of
the 3 or using a form with a corner in the upper right can be observed in some
UI typefaces.

The "single story a" can be an issue in typefaces that ise it, adding to the
plethora of round forms (eopdqbc etc.). Breaking up the monotony of those
shapes is also frequently advised.

"Tail-less" t and r in sans type can be problematic at small sizes.

~~~
wodenokoto
What is a tail-less t? Google didn't help me at all on this one.

~~~
jack_jennings
Compare Futura's "tail-less t":
[http://www.identifont.com/show?M2](http://www.identifont.com/show?M2) to
Source Sans with a hooked tail:
[http://www.identifont.com/find?font=Source+Sans&q=Go](http://www.identifont.com/find?font=Source+Sans&q=Go)

~~~
majewsky
Looking at the Futura specimen left me with a distinct taste of Swedish
meatballs in my mouth.

------
gjm11
> _Since this font is very similar to Roboto, glyph outlines from Roboto are
> indeed being used, mainly as "placeholders" while the glyph set is expanded.
> The Roboto license can be found in the source directory._

Mainly?

If this is a deliberate near-clone of Roboto, then at the very least there
should be some explanation of how it differs and why.

~~~
thinbeige
But this is a good idea. Clone Roboto, change few beziers and you can put your
own font on your portofolio/resume.

------
sagichmal
It's nearly identical to the new Mac OS system font San Francisco (SF) but
with tighter spacing and (subjectively to me) nicer finials and terminals.
Looks great.

------
richev
> Interface started out in late 2016 as an experiment to build a perfectly
> pixel–fitting font at a specific small size (11px.)

Didn't Tahoma[1] achieve this back in 1995?

[1]:
[https://en.wikipedia.org/wiki/Tahoma_(typeface)](https://en.wikipedia.org/wiki/Tahoma_\(typeface\))

------
harrygeez
I've been waiting for a font like this for forever! Finally a good alternative
to Apple's San Francisco font.

Amazing job to the author!

------
rcarmo
I actually came across this yesterday and set it as a system font on my Linux
machine, which runs Elementary.

Although I don't have a HIDPI display, it is nicer and (subjectively) more
readable than what I've tried before (I still use Fira Code for coding and
Fira Mono inside the terminal, but for the UI tried various variations of
Fira, Roboto and other sans serif fonts, yet none of them stuck).

~~~
rasmusfabbe
Happy to hear this! Would love to see a screenshot of what it looks like (I'm
@rsms on Twitter)

------
j_s
I was interested to discover fonts with programming-specific ligatures when
they were discussed last month. I haven't experimented enough yet to know how
well they work out in the long term.

[https://www.hanselman.com/blog/MonospacedProgrammingFontsWit...](https://www.hanselman.com/blog/MonospacedProgrammingFontsWithLigatures.aspx)

~~~
mcguire
This is a good idea. Why hasn't someone thought of it before? Why didn't I
think of it?

I've been using Frama-C recently, with the option of \forall or ∀, for
example. The latter is more readable, but a pain to type. I'll have to try
some of these.

------
chrissnell
I created an AUR package for this if any Arch users want to install the font:

[https://aur.archlinux.org/packages/ttf-
interface/](https://aur.archlinux.org/packages/ttf-interface/)

This package only installs the OTF version currently.

Let me know if you have any problems installing.

------
nkkollaw
Looks really good.

We really need good open source fonts.

------
BafS
Thanks for this font, I really appreciate the mix between Roboto and Helvetica
or San Francisco. The cuts of Interface are more horizontals than Roboto (look
the S for example) and I find it more readable, rational and beautiful. Good
job !

------
duncanmeech
The interweb works better when you use things like <P> not <IMG>

------
floatboth
Nice. Honestly, it reminded me of Apple's San Francisco more than Roboto o_0

------
fredsted
This font is really pretty, and the text very readable. Great job.

------
SquareBalls
Beautiful, will definitely consider this on our new web site.

------
virtuexru
Very very clean. I love it. The easier read the better imho.

------
cratermoon
Upper case I and lower case l look too much alike. Letter O and number 0 need
to be more distinguishable.

------
tudorw
system font for the win...

~~~
ojosilva
For application UI, definitely. For website design... I think it may be a
little overused these days.

~~~
tudorw
yes, I'm not adverse to a spot of nice typography, aesthetics and presentation
are key to getting a message across, for productivity UI in particular I like
at least the choice to have a system font, it's usually the nicest rendering
font and things like multi language support mostly just work.

------
fairpx
Nice font. Would there be a way for you guys to incorporate the font on a
platform like Google's webfonts? For our business
([http://fairpixels.pro](http://fairpixels.pro)) we are constantly looking for
great fonts to use in the UI work we do for software teams. Having a scattered
landscape doesn't help.

~~~
rasmusfabbe
Glad you like it. Once Interface reaches a more stable state (i.e. more glyphs
and kerning have been added), the intention is to submit it for inclusion on
Google fonts. In the meantime, you can use
[https://rsms.me/interface/interface.css](https://rsms.me/interface/interface.css)
which always points to the latest release of the font, and is hosted on a CDN
(by Cloudflare, backed by GitHub.)

------
wyager
I'm sure this is like tabs vs spaces for typographists, but why the hell do
people make and use sans-serif fonts? Even ignoring aesthetics, the fact that
there are horrendous ambiguities (like between I and l) renders these fonts
completely inappropriate for computational tasks like copying passwords or
secret keys. I have run into this problem multiple times on OS X and iOS,
where the password managers use sans serif fonts.

~~~
fredsted
But aren't passwords just copied? Why does the font matter?

~~~
wyager
Common use case: reading wifi password to guests.

