HN Gopher Feed (2017-08-23) - page 1 of 10 ___________________________________________________________________
The Interface font family
204 points by glhaynes
https://rsms.me/interface/___________________________________________________________________
fairpx - 3 hours ago
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) 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 - 3 hours ago
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 which always
points to the latest release of the font, and is hosted on a CDN
(by Cloudflare, backed by GitHub.)
tudorw - 3 hours ago
system font for the win...
ojosilva - 1 hours ago
For application UI, definitely. For website design... I think it
may be a little overused these days.
harrygeez - 3 hours ago
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!
[deleted]
tgsovlerkhgsel - 15 minutes ago
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$
111111Ironically, Roboto seems to get it right.
fredsted - 2 hours ago
This font is really pretty, and the text very readable. Great job.
DiabloD3 - 1 hours ago
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 - 31 minutes ago
> 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.
rcarmo - 4 hours ago
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 - 3 hours ago
Happy to hear this! Would love to see a screenshot of what it
looks like (I'm @rsms on Twitter)
thinbeige - 4 hours ago
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 - 2 hours ago
> Please resist commenting about being downvoted. It never does
any good, and it makes boring reading. [0][0]:
https://news.ycombinator.com/newsguidelines.html
gjm11 - 3 hours ago
By "disproportionate", do you mean "badly proportioned", or
merely "proportional" as opposed to monospace?
thinbeige - 3 hours ago
By disproportionate I meant that it feels like a slightly
condensed font without really being a condensed font. This
paired with this too small letter spacing creates this
disproportionate look.Another poster just commented that it
looks like Roboto (or is even based on Roboto) and Roboto faces
the same issues but not that worse. Roboto itself is a mutated
Helvetica Neue which is admittedly a reference sans serif where
every other sans looks inferior amd kind of turned out badly in
comparison.
nathancahill - 4 hours ago
Absolutely valid criticism for a font. The page hurt to read.
eadz - 4 hours ago
I wondered if I was the only one to feel dizzy. Maybe it was
the colors.
sagichmal - 4 hours ago
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.
wyager - 3 hours ago
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.
harrygeez - 2 hours ago
Because sans-serif fonts are more legible on digital screens
especially low-res screens?
rasmusfabbe - 2 hours ago
This is valid commentary and subject to much discussion
throughout the recent history of typography. There's always a
blance condition between personality, legibility, character
ambiguity, pace, and so on. Every typeface needs to go in some
direction on these dimensions, which is why we have different
font families for different uses! For instance, mono-spaced fonts
with "slab" serifs are popular with computer code since column
alignment (mono-spaced) and ambiguity (slab serifs and other
visual traits like slashed zero) are used. However, for most
people it's easier to read a variable-width font with regular
serifs for longer text, like what you'd find in a book.
Similarly, for user-interface labels, dialogs, buttons, etc it's
often better to use a font without serifs and with a little more
tracking/letter-spacing than what you'd use for large bodies of
text (e.g. in a book.) Interface is designed for the latter use-
case; user interfaces on computer screens.
fredsted - 2 hours ago
But aren't passwords just copied? Why does the font matter?
wyager - 2 hours ago
Common use case: reading wifi password to guests.
[deleted]
philjohn - 3 hours ago
Because in the days of lower resolution screens the commonly
accepted (correct) view was that a serif font reduced
readability.With retina/high DPI displays? Not so much.
nerdponx - 3 hours ago
What? Would you rather HackerNews be rendered in a serif font?
mark-r - 2 hours ago
Serif fonts are harder to render on low DPI displays, such as
nearly every Windows machine in existence. I really wish that
high DPI displays would take over the world, but I know how
difficult that will be. I'm even having trouble myself, I'm in
the market for a new Chromebook and I found one with a very nice
235dpi display. I can get it for $400, but my wife is giving me
grief because similar ones with a crappy display are available
for $250.
kinkrtyavimoodh - 3 hours ago
I don't want to obsess over the analogy but just want to point
out that it's not a typical holy war in the tabs/spaces or
vi/emacs sense because no one is claiming that only one of serifs
or sans-serif is best. Most acknowledge the benefits of both.
virtuexru - 4 hours ago
Very very clean. I love it. The easier read the better imho.
jack_jennings - 3 hours ago
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.
kozak - 1 hours ago
Good to have a version of Roboto that is not distinctly
associated with the Android OS. I remember having to dismiss
Roboto in favor of Arimo just for that reason (despite Roboto
being a better fit overall).
[deleted]
rasmusfabbe - 3 hours ago
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
fastball - 2 hours ago
You should probably be loading the Roboto font via Google Fonts
or similar, because my system does not have Roboto installed by
default, so it is defaulting to serif in your comparison.At
least I think that's the issue.
STRiDEX - 2 hours ago
If you have homebrew you can do: brew cask install font-
roboto
hk__2 - 2 hours ago
You got downvoted because the issue is not that fastball
doesn?t have Roboto on their computer; it?s the website
assumption that everyone has it.
lanewinfield - 2 hours ago
I'd say doubly, because no Cask with this name
exists.(Looks like you have to run brew tap
caskroom/fonts first :) )
hk__2 - 1 hours ago
That?s true; I didn?t try the above command :)
rasmusfabbe - 29 minutes ago
Roboto is already being loaded from google fonts (https://git
hub.com/rsms/interface/blob/b91dd3af/docs/lab/ind...)
However, I think Chrome might do something weird where it
fails to actually load the font files when later the font
family "Roboto" is requested (https://github.com/rsms/interfa
ce/blob/b91dd3af/docs/lab/ind...) ? a common hack for this
issue is to have an invisible element in the document that
explicitly uses the font and forces the browser to load it at
document-load time. Could try that hack here.Anyhow, the
version of Roboto served from google fonts is an older
version and a subset of the "real" roboto, as can be fetched
from roboto's source code repository. If you have Roboto
installed locally, you probably have the more recent and more
complete version installed and will likely want to compare
with that (rather than what's on google fonts.)Edit:
https://twitter.com/stuartpb/status/900484392472109056 points
out that @import must be at the beginning of a style
declaration. Website has been updated.
jack_jennings - 2 hours ago
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) ?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/nl5mpThere 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)
davidad_ - 1 hours ago
FWIW, I do find Interface to be subjectively noticeably more
pleasant than Roboto in the comparison here.
jack_jennings - 1 hours ago
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 - 4 minutes ago
Actually, I think you want to compare apples & apples,
meaning Font A and Font B at the same size and line
height.
rasmusfabbe - 20 minutes ago
Thanks for the thoughtful comment. Indeed really small sizes
like 11px, distinguishing factors are few and even San
Francisco and Roboto start looking like the same font, at
least as far as most people are concerned. The goal with
Interface is not to create a unique-looking typeface, or even
to try to make something different in terms of style, but to
create the best possible small-size, computer-screen, user-
interface oriented font, even if that means that some
characteristics become very similar to other typefaces. For
instance.
cratermoon - 1 hours ago
Upper case I and lower case l look too much alike. Letter O and
number 0 need to be more distinguishable.
gjm11 - 3 hours ago
> 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 - 3 hours ago
But this is a good idea. Clone Roboto, change few beziers and you
can put your own font on your portofolio/resume.
AceJohnny2 - 3 hours ago
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?
andrewguenther - 3 hours ago
I noticed that as well. Difficult to claim "highly legible" with
an oversight like that.
jack_jennings - 3 hours ago
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 - 3 hours ago
What is a tail-less t? Google didn't help me at all on this
one.
jack_jennings - 3 hours ago
Compare Futura's "tail-less t":
http://www.identifont.com/show?M2 to Source Sans with a
hooked tail:
http://www.identifont.com/find?font=Source+Sans&q=Go
baldfat - 3 hours ago
I really hate that O and 0 are so alike and right next to each
other on QWERTY.Wish a slash like in my coding fonts was the norm
in USA.
bramen - 2 hours ago
I hate that you made me notice that and I'll never be able to
unsee it! :-)A slash or a dot in the middle would be nice.
tyrust - 3 hours ago
>I really hate that O and 0 are so alike and right next to each
other on QWERTY.Damn, I never noticed that. Now I hate the
typeface on my keycaps.
rasmusfabbe - 3 hours ago
This is by design. A wider "O" would indeed make separating zero
from "O" easier (and an earlier iteration of Interface had a
wider "O") but it adds some uneven pace to how longer words and
sentences read.The hope is to add a stylistic set for character
disambiguation to the font, which when enabled would enable
graphic features on glyphs like upper-case "i" and lower-case
"l", zero and "O", and so on. Tracked here:
https://github.com/rsms/interface/issues/1