9 ms·
Apple’s New San Francisco Fonts
- abluecloud 11y agoSlightly related: the letter i on the keyboard looks wrong. It bugs me every time (it looks too high).
- epistasis 11y agoThey raise the baseline for the lowercase keyboard, which I find very very bothersome. It seems as though they try to center the baseline-median area, rather than just stick with the baseline from the uppercase keyboard. I accidentally misattributed some dislike for this to dislike for the San Francisco font; after I realized a bit more what was going on I'm slightly more comfortable with the font.
- exogen 11y agoIt does look bothersome, but if they moved the baseline down, then the 'q', 'g', and 'p' would be the problematic ones (they already look "too low" out of context with the rest, even shifted up).
- gluecode 11y agoNow you said that, I agree. I am unable to "un-see" it.
- IMcD23 11y agoThis may also be apparent because in iOS 9, the letters are in lower case. They were always uppercase before the update.
- amelius 11y agoWhat keyboard, if I may ask? Do you mean the iOS on-screen keyboard? Or the real keyboard?
- abluecloud 11y agoThe iOS on screen keyboard. The lowercase version.
- spike021 11y agoAt first I thought the new font looked nice and clean but lately I've really been longing for the old Helvetica Neue again.
- htk 11y agoI don't like the kerning on San Francisco. It's too common to have wider than normal spaces between characters to the point of being distracting. Maybe that's good to read randomly generated strings of text, but on actual words the shape of the word is the first hint to the brain when trying to read it, before the individual characters, and if that shape is compromised by wider than expected spaces, reading flow is affected.
- aaronbrethorst 11y agoThat's funny, I loathe Helvetica's keming, and think that San Francisco's is much improved. I can always distinguish 'rn' from 'm' in the new font.
- Zelphyr 11y agoI see what you did there. ;)
- aaronbrethorst 11y agoI was hoping someone would catch that :)
- Rygu 11y agoWhat do you rnean?
- aaronbrethorst 11y agoexactly :)
- idonthaveaname 11y agoI had to read that twice. Nicely done!
- Stratoscope 11y agoYou will probably appreciate this - Liz Crain is an artist who does ceramic pieces that are made to look like old rusted cans (oil cans, etc.). Her husband is a retired typesetter, so some of her ceramic "cans" are related to typography. We bought one called Interrobang and immediately commissioned her to do a Keming can: https://www.facebook.com/lizcrainceramics/posts/10205681336890894 https://www.facebook.com/lizcrainceramics/posts/102056813368...
- bitwize 11y agoSo like, I know anything Apple gets design-wonk dicks of all sexual orientations rock hard, especially in the actual city of San Francisco, but this font is kinda meh to me. It's readable and functional, but not a revelation nor a revolution. In fact it looks quite a bit like Roboto Sans. And maybe that's how things should be. Maybe functionality and readability, especially on the watch display, should trump traditional evocations of old world style and class, even in Cupertino.
- accommodavid 11y agoOkay, I'll bite. The thing is that this isn't meant to be revolutionary, that's not the point. The typeface isn't designed to distinguish Apple from others, that's not what this is about. It's not even about 'returning to functional and readable' either. Hell, this isn't even about Apple. This is about the fact that typography, a craft that is as old as written language, is adapting to the digital age and we're starting to see fonts become intelligent and tweaking themselves depending on the context they are put in. To me, that's a very interesting trend. Type is traditionally designed for print first, with screens as an afterthought. The idea of having fonts that adapt to different contexts and are actually designed for screens first is something I think is going to become more common practice and we'll probably see some really advanced applications very soon. Generative fonts are already a huge thing in poster design and it's nice to see the idea of fonts becoming more context-aware extend into interface design as well.
- lambdanode 11y agoApple should just switch to Roboto
- LeoPanthera 11y agoRoboto is very similar to Helvetica. I don't really understand why Google bothered.
- pluma 11y agoUnlike SF, which is nothing like Helvetica, right?
- sbilstein 11y agoI wasn't particularly excited for this update but when my phone switched over I was truly wowed by how much easier the font was on my eyes. Kudos to the Apple typographers, it's really improved my iPhone 6 experience.
- greggman 11y agoThat's strange. I had the opposite experience. I could no longer read. Specifically I couldn't read my notes in the Notes.app on my iPhone5S after upgrading to iOS9. The text was smaller and the lines thinner. I eventually had to go into the system settings and pick "bold" for the entire OS
- tracker1 11y agoAgreed, on the flip side, I'm warming up to Roboto as well. OpenSans also looks pretty good at smaller sizes imo, but not as good as a header/larger font.
- mgalka 11y agoIndependent of the io9 switch, that's an interesting post for the science of fonts. Very relevant for web design work.
- deleted 11y ago[deleted]
- p1itopre 11y agohttp://daringfireball.net/linked/2011/10/19/roboto-v-helvetica http://daringfireball.net/linked/2011/10/19/roboto-v-helveti...
- pluma 11y agoIn other words, San Francisco is a Apple's Arial.
- erbo 11y agoIt would have been fun if they'd used the original Mac "San Francisco" font instead: http://en.wikipedia.org/wiki/San_Francisco_(1984_typeface) http://en.wikipedia.org/wiki/San_Francisco_(1984_typeface)
- cpeterso 11y agoI wonder why they reused the "San Francisco" name. Following the original Macintosh tradition of naming fonts after "world class cities", there are plenty of new names they have have chosen. http://www.folklore.org/StoryView.py?story=World_Class_Cities.txt http://www.folklore.org/StoryView.py?story=World_Class_Citie...
- a_e_k 11y ago"You can see the low legibility of Helvetica if you type texts in a small size and make them blur. Some texts become blended and hard to decipher. They say that Apple developed San Francisco fonts in order to make small size texts in Apple Watch more legible." Funny thing is, this is exactly the problem that font hinting was meant to solve [1][2]. Apple developed the tech for TrueType font hinting nearly 25 years ago but then ditched most of it in their antialiasing rasterizer for OS X. If they still had hinting in their rasterizer, then instead of creating a whole new font with flatter segments they could have hinted Helvetica to flatten out at smaller sizes while still curving in the larger sizes. Then they would have had the best of both. Granted, that would have meant admitting that there's something to respecting the pixel grid [3], but this seems like a tacit admission of that anyway. [1] https://developer.apple.com/fonts/TrueType-Reference-Manual/RM03/Chap3.html https://developer.apple.com/fonts/TrueType-Reference-Manual/... [2] http://www.rastertragedy.com/ http://www.rastertragedy.com/ [3] http://blog.codinghorror.com/font-rendering-respecting-the-pixel-grid/ http://blog.codinghorror.com/font-rendering-respecting-the-p...
- theoh 11y agoThat wouldn't be Helvetica, so they would probably give it a new name. Given the ambiguous ubiquity of Helvetica, it's possible they'd have chosen a name like San Francisco anyway. Whether the feature is provided by hinting or a pair of fonts is moot.
- pavlov 11y agoHinted fonts did look great on low-DPI screens. To my taste, Microsoft's Tahoma, the Win95 / NT4 system font designed by Matthew Carter, is probably the best font that you can squeeze into a grid about 9 pixels high: https://www.microsoft.com/typography/fonts/family.aspx?FID=19 https://www.microsoft.com/typography/fonts/family.aspx?FID=1... However, nicely hinted fonts were designed from scratch for that purpose. You can see it in Tahoma's letter shapes at larger sizes, the construction is very grid-like overall. A well-hinted Helvetica really wouldn't look any different from Arial back in 1995. The low resolution makes Helvetica lose its character. I think Apple made a good choice in designing a more contemporary font.
- polpo 11y ago
- carlosrg 11y agoDisclamer: I'm no font expert, this is all my opinion as a user. Not a fan of the font to be honest. I was excited for a Helvetica replacement on OS X, but to this day nothing beats Lucida Grande, especially on non retina displays. I'd even say I prefer Helvetica to SF (and I was definitely not a fan of Helvetica as a UI font), after using iOS 9 for two weeks and then coming back to iOS 8. I can't describe it properly without typography knowledge, but I'd say it feels more elegant than SF (and other "modern" fonts like Roboto). Also there's the issue of readability, so I guess in that regard SF trumps Helvetica. Then again, I'm no expert so I don't really know.
- spinningarrow 11y agoI miss the Lucida Grande + Myriad Pro days!
- interlocutor 11y agoApple should have limited this font to the Watch. On the iPhone it looks ugly. There is too much space between characters and that hurts readability. iPhone's screen resolution is high enough that there is no need to use a special font designed for screens -- that only makes it look cheap and unprofessional.
- smaili 11y agoDisagree. Conformity is what makes professional.
- mmanfrin 11y agoI have untrained eyes, but I could not notice a single difference between the Helvetica icon screen and the SF icon screen, other than sliiiightly different kerning. The letters looked exactly the same otherwise.
- pietro 11y agoThe icon screen sample is pretty low res. It's much easier to see on an actual retina display, but the differences are indeed subtle. A couple of differences: The 'a' is clearly different, and you should be able to spot the difference even with an untrained eye; the 'C' and 'G' are clearly slimmer in SF. The curves of the rounded letters have a subtly different feel to them matching the names of the fonts: Helvetica is sterner and more geometric, San Francisco more inviting and informal. You may find this hard to see is you look too closely, but see if you can feel it or learn it by attaching adjectives to the look of the words.
- toddmorey 11y ago'dfgh' on the keyboard have really strange optics in San Francisco. It almost looks as if their baselines aren't aligned, but they are. But visually, the g looks low and the f looks high. It's just something about the crossbar on the f and the bowl of the g.
- WalterBright 11y ago> One of the great features of San Francisco is the way it optimizes the typeface dynamically. The system will automatically switch the Display/Text fonts according to the text size. I just assumed that was the case already. Back in the olden daze when there weren't many pixels, the font was hand tweaked for each resolution. I did a few myself :-) I guess technology has come full circle.
- Techowl 11y agoMuch of this article (and all of the images) was taken from a WWDC 2015 talk [0]. If you're interested in typography, that video is definitely worth a watch. [0] https://developer.apple.com/videos/wwdc/2015/?id=804 https://developer.apple.com/videos/wwdc/2015/?id=804
- lqdc13 11y agoThis is really funny. The font in the article about legibility of fonts on mobile looks really garbled on Firefox mobile (Android) when scrolling.
- otabdeveloper 11y agoInstead of making yet another slightly different Helvetica, maybe somebody should make an effort to make a font that renders Latin, Cyrillic and Greek in a unified style without glaring errors. (As far as I know, there's only one font that does this correctly, and it doesn't support anything but Latin and Cyrillic.) How about a font that renders Latin, Cyrillic, Greek and Hanzi correctly? Why do I have to install a special 'Chinese font package' in 2015?
- pervycreeper 11y agoNo mention of the similarity to Roboto? IMO, the aesthetic effect of Roboto is not as good as the former.
- michaelpinto 11y agoSomething that many digital folks don't get about old typefaces during the hot metal era: Different sizes had different cuts. So a typeface that's at 9 points wasn't using the same outline as the same typeface at say 24 points. In fact in many cases you'd have versions of typefaces within a family designed for body text vs. headlines, so for example you have a "book weight" vs. a "display weight".
- yati 11y agoAs a programmer with very limited design experience, I always find such analyses of fonts fascinating. The level of detail these typographers deal with is just amazing. For example, the subtle curve in the `o`s in SF versus SF compact -- I wouldn't have figured that out myself. I hope to find some time/resources to learn some of this magic myself :)
- wtbob 11y agoI really, really miss serif fonts. It'll be nice once we all have 600 dpi e-ink 'screens' and can have book-quality text.
- mastre_ 11y agoGreat WWDC video[1] "Introducing the New System Fonts" which dives deep into all the tricks they pulled, and why, with the San Francisco font (unfortunately, only viewable in Safari and WWDC app) [1] https://developer.apple.com/videos/wwdc/2015/?id=804 https://developer.apple.com/videos/wwdc/2015/?id=804