alt Hacker NewsFran Sans – font inspired by San Francisco light rail displays
Comments
Typography nerds are some of my favourite nerds.
Font specimen pages are so often screaming with design language and intention, they push and prod to evoke and present.
Maybe the secret has something to do with the lack of priority to the actual content; just present the font gosh-darn!
Looks nicely executed within the confines of the inspiration. very cool
As a native that absolutely cringes at "San Fran" ... I still got mad respect for that awesome name. Well done.
FYI no lower case, also "contact the author for licensing". (The article is a neat story of digging into the history of the displays which are about to be going out of service, as well as some practical aspects of the font design - it's just not casually available.)
This post ends with a beautiful poem set in Frans Sans
OUTSIDE MY LIFE, INSIDE THE DREAM.
FALLING UP THE STAIRS, INTO THE STREET.
LET THE CABLE CAR CARRY ME.
STRAIGHT OUT OF TOWN, INTO THE SEA.
PAST THE DAHLIAS AND THE SELF-DRIVING CARS.
THE CHURCH OF 8 WHEELS. THE LOWER HAIGHT BARS.
THE PEAK HOUR SPRAWL. THE KIDS IN THE PARK.
THE SLANTING HOUSES. THE BAY AFTER DARK.
MY WINDOW, MY OWN SILVER SCREEN.
I FOLLOW WHERE THE FOG TAKES ME.
By MADDY CARRUCAN
When I was a child the front side displays on new Muni buses used to use these probably solonoid driven LED arrays. If you sat under one you could here this clattering sound that sounded kinda like rain each time the display changed. This discussion is bringing back old memories of those.
The older Breda trains and I think buses also used to use backlit paper rolls for signs: https://upload.wikimedia.org/wikipedia/commons/4/4c/T_Third_... Those were significantly more readable
I appreciate that the author talked to various people (technician, engineer) and visited the shop rather than just doing online research. It's rare for people to go to the effort of in-person research.
This reminded me of https://aresluna.org/the-hardest-working-font-in-manhattan/
prev hn discussion: https://news.ycombinator.com/item?id=43053419
> Back at the SFMTA, Armando told me the Breda vehicles are being replaced, and with them their destination displays will be swapped for newer LED dot-matrix units that are more efficient and easier to maintain. By the end of 2025 the signs that inspired Fran Sans will disappear from the city, taking with them a small but distinctive part of the city’s voice.
:-(
I like the underlying commitment to design in the original displays. Seemingly the double height slants on the bottom are solely for rendering the letter V. They have no other purpose than for that letter.
For UK readers, this is eerily similar to the typeface originally used on the "Thames Turbo" trains (class 165/166) from their construction in the 1990s until a refurb about five years ago - I could believe it was the same manufacturer. Some photos:
https://commons.wikimedia.org/wiki/File:166207_DMCO_Interior...
https://commons.wikimedia.org/wiki/Category:British_Rail_Cla...
Great work! As a side track, it led me to dive into the history of the manufacturing company of Breda trains. Originally founded in Milan late 1800s by Ernesto Breda for locomotives, expanded in the war products during the wars, and went through nationalization, fusion to become AnsaldoBreda and later bough by Japanese to become Hitachi Rail Italy.
I would love to build a programmatic version of this font defined by an array of shapes (full square, triangle, rounded corner, pizza, and notch), and rotations, but I think even that would be a somewhat offense of the license, so I'm not going to publish it.
An array of those would spell out most of the symbols. Some of her characters violate this pattern though so it only approximates most of the symbols.
If lilsneddz responds with yes, I'd love to publish the code so people can make public interactive displays with her font design.
I think a system like this would make it easier to prototype lowercase and other international symbols though!
I have seen these throughout the US and Europe and been fascinated by them. Penn Station has (had? been a while) a big one with more segments per character. I’ve been trying forever to find the name of this particular style of segmented displays and get more info on them. The closest I could find is “mosaic display.”
Love this article!
Signed, someone who has an obsession with segmented displays
Reminds me of the old Finnish metro station display reverse engineering http://sooda.dy.fi/2013/8/19/metro-station-display-reverse-e...
Beware that pressing the back arrow twice takes you to unexpected naked photos.
There are higher detail versions of these LCD displays like those used on the NJ Transit Comet cars: https://www.flickr.com/photos/recluse26/286211358/
Should be possible to get a passable @ on those.
Ah that's so neat! I've noticed some of those details before, in how some of the segments of the display are shaped in various ways that lets them draw characters with smooth edges, in ways you wouldn't be able to do with a display where the segments' shapes are homogeneous.
As soon as I saw the first photo, though, I was a little sad to realize that it was of the old-style trains that are being phased out. The author notes this near the end, but I think that the trains are actually completely phased out as of a few weeks ago, maybe even before this article was posted.
"Unlike New York, Chicago or L.A., which each have one, maybe two, San Francisco and the greater Bay Area have over two dozen"
Whaaa...? Los Angeles has a whole rat's nest of overlapping agencies, (mostly different cities and like 4 kinds of train for some reason)
Also check out Helvetica and its use in subways of the world - https://news.ycombinator.com/item?id=2372894
I really liked the Hotspur font shown here, but can't find it for either download or sale anywhere. Perhaps someone knows if it is at all available?
Since the article compares the SF “and the Bay Area” to LA, they might be surprised to find that the greater LA area has 70+ public transit organizations. Just to name a few, LA County Transit Authority, Big Blue Bus, Long Beach Transit, Torrence Transit, LADOT, OCTA, …
This is difital archiving and will be absorbed by AI and seen by aliens in another galaxy thousands of years from now in a borg cube.
For some reason when I read this font in the digital samples, it feels a bit Soviet? I subconsciously expect the text to be in cyrillic.
>On route, train operators punch the code into a control panel at the back of the display, and the LCD blocks light on specific segments of the grid to build each letter
I always thought those were mechanical displays with little mechanical shutters that moved to display the segments... like these:
Never knew they were LCD.
> Life is so rich when ease and efficiency are not the measure.
This is it, and I really like the CSS effects when highlighting/selecting words, sentences and paragraphs
I had not heard of Glyphs, the tool the author used. I used to use Fontographer long ago.
https://glyphsapp.com/learn/recommendation:get-started
It's a great article!
I'm struggling with deciphering the punctuation symbol between the £ and the |. Any help? (Possibly the @ symbol but my reading of the text suggests there isn't a glyph for it, but maybe I'm wrong there)
I am not expert but I really like the font. It does a lot for such a primitive display. Makes me wonder why we used to have those bad 80s 90s alphanumeric LCD displays in most places too cheap for pixels when they could have done this.
Thoroughly dank. Very well done and interesting write up.
Fun! Would love a "style 4" where you see the thin lines e.g. within the solid squares.
This is the spitting image of the "FontStruct" tool, which I have fond memories of! I wonder if there was some overlap.
I second the sentiments here about typography nerds. This is very very cool.
Very cool!
It would be interesting to see a version with the grid line gaps included.
Wow! Impressive process, outstanding result. Kudos
I would invite everyone to try selecting text on the linked page to see the most low-key awesome effect ever.
I wonder what's happening to the displays that're being retired! I hope someone can nab them from the waste stream...
Start here for more of the actual font: https://emilysneddon.com/fransans
That was a great read with a ton of fun little bread crumbs to follow. Tipo Velez/Super Veloz gets a mention, and it’s definitely worthy of a diversion if you haven’t seen it before.
For all the modern handwringing about SF, it really is a hell of a city with a fascinating history.
I like it because my first name is Frans
For commercial and non-commercial use of FRAN SANS, please get in touch: [email protected]
Have been in font picking mode recently so this was a relevant enough distraction. Excellent read!
Are the light rail displays ever sold anywhere?
i was literally just looking for some kind of font for my personal site and this is super cool.
Why is the font size on this page ENORMOUS and blocking the ability to make it reasonable? Seems more than a bit user hostile.
I guess I could try finding some reader mode extension, but the effort/reward promise is not high enough to bother.
Hi
Wow, the props to the author for digging deep!
> Looking inside of the display, I found labels identifying the make and model. The signs were designed and manufactured by Trans-Lite, Inc., a company based in Milford, Connecticut that specialised in transport signage from 1959 until its acquisition by the Nordic firm Teknoware in 2012. After lots of amateur detective work, and with the help from an anonymous Reddit user in a Connecticut community group, I was connected with Gary Wallberg, Senior Engineer at Trans-Lite and the person responsible for the design of these very signs back in 1999.
Few years back, we had a work thread about this exact Muni Metro font and the designers brought up segmented types. We never got as far as the author in finding the source, but did bring up other systems with similar typefaces.
NYC has their own called R142A: https://www.nyctransitforums.com/topic/55346-r142a-mosaic-lc...
And here's one inspired by Spain's transit system: https://aresluna.org/segmented-type/