[{"data":1,"prerenderedAt":239},["ShallowReactive",2],{"blog:2011:androids-roboto-system-font-for-ice-cream-sandwich":3,"comments-androids-roboto-system-font-for-ice-cream-sandwich":225,"blogMore-Typography":226},{"id":4,"title":5,"body":6,"category":203,"commentCount":204,"date":205,"description":206,"excerpt":207,"extension":208,"filenames":209,"hidden":210,"image":211,"meta":213,"minutes":214,"navigation":215,"path":216,"seo":217,"showCategory":209,"stem":218,"tags":219,"updated":209,"url":222,"wordCount":223,"__hash__":224},"content\u002Fblog\u002F2011\u002Fandroids-roboto-system-font-for-ice-cream-sandwich.md","Android’s Roboto system font for Ice Cream Sandwich",{"type":7,"value":8,"toc":199},"minimark",[9,26,35,42,45,86,95,103,106,112,115,146,149,157,166,180,183,193],[10,11,12,13,20,21,25],"p",{},"Google have switched system font for Android’s latest release (known as ",[14,15,19],"a",{"href":16,"rel":17},"https:\u002F\u002Freviews.cnet.com\u002F8301-19736_7-20061501-251\u002Fice-cream-sandwich-first-impressions-a-bold-new-android\u002F",[18],"nofollow","Ice Cream Sandwich",") from ",[14,22,24],{"href":23},"\u002Fblog\u002F2007\u002Fdroid-font-family-courtesy-of-google-ascender\u002F","the Droid Family"," to a new typeface known as Roboto.",[10,27,28,29,34],{},"Typographica opened today with a ",[14,30,33],{"href":31,"rel":32},"https:\u002F\u002Ftypographica.org\u002F2011\u002Fon-typography\u002Froboto-typeface-is-a-four-headed-frankenstein\u002F",[18],"critique of the Roboto font"," which boils down to this:",[36,37],"img",{"className":38,"src":40,"alt":41},[39],"screenshot","https:\u002F\u002Fimg.damieng.com\u002Fblog\u002FRoboto.png","Roboto compared at Typographica",[10,43,44],{},"The similarity to Helvetica is obvious but that similarity can be drawn with many modern typefaces, but the other comparisons are tenuous at best:",[46,47,48,62,78],"ul",{},[49,50,51,56,57,61],"li",{},[14,52,55],{"href":53,"rel":54},"https:\u002F\u002Fdinfont.com",[18],"FF DIN"," has little resemblance other than having straight edges on rounded letters. Lots of faces do that. ",[14,58,60],{"href":59},"\u002Fenvy-code-r\u002F","Envy Code R"," does extensively :)",[49,63,64,69,70,74,75],{},[14,65,68],{"href":66,"rel":67},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FMyriad_(typeface)",[18],"Myriad"," is more open in its whitespace, ends ",[71,72,73],"code",{},"t"," with a slant and features a different approach to shoulders on ",[71,76,77],{},"mnpqr",[49,79,80,85],{},[14,81,84],{"href":82,"rel":83},"https:\u002F\u002Fnew.myfonts.com\u002Ffonts\u002Ftype-together\u002Fronnia\u002F",[18],"Ronnia"," only shares the single horizontal stem which is also present in many monospace bitmap fonts",[10,87,88,89,94],{},"Yes, some of these differences are subtle when you put them side by side but ",[14,90,93],{"href":91,"rel":92},"https:\u002F\u002Fwww.fontshop.com\u002Feducation\u002Fpdf\u002Ftypeface_anatomy.pdf",[18],"subtleties are what give the typeface its character",".",[10,96,97,98,94],{},"There are only so many ways to draw letters with consistency and readability especially if you want a modern sans look. That’s exactly why ",[14,99,102],{"href":100,"rel":101},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FCopyright_on_typefaces",[18],"copyright refuses to cover letter-forms in the USA",[10,104,105],{},"So coming to the font itself at first glance, yes, on my laptop it doesn’t look as pretty as Helvetica when blown up for comparison but here’s something you should consider.",[107,108,109],"blockquote",{},[10,110,111],{},"Typefaces are designed for a specific environment",[10,113,114],{},"Consider the following typefaces:",[46,116,117,125,133],{},[49,118,119,124],{},[14,120,123],{"href":121,"rel":122},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FBell_Gothic",[18],"Bell Gothic"," has big counters and deep ink-traps so that high-speed printing on cheap paper retains the form",[49,126,127,132],{},[14,128,131],{"href":129,"rel":130},"https:\u002F\u002Fclearviewhwy.com\u002FWhatIsClearviewHwy\u002FHowItWorks\u002FdevelopmentCriteria.php",[18],"ClearView Highway"," is designed to be quickly readable with headlight glare",[49,134,135,140,141],{},[14,136,139],{"href":137,"rel":138},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FCambria_(typeface)",[18],"Cambria"," has many little flourishes that only look good with ",[14,142,145],{"href":143,"rel":144},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FClearType",[18],"sub-pixel positioning",[10,147,148],{},"Use a typeface outside its intended environment and you’ll easily believe it’s a bad design, ugly or unrefined as those very characteristics that made it great for that environments completely fail to fit new surroundings.",[10,150,151,152,94],{},"Even the famous Helvetica has an environment of white-space, bold colors and clean-lines where it shines. That makes it a ",[14,153,156],{"href":154,"rel":155},"https:\u002F\u002Fwww.webdesignerdepot.com\u002F2009\u002F03\u002F40-excellent-logos-created-with-helvetica",[18],"top choice for corporate logos",[10,158,159,160,165],{},"Roboto is the work of independent type designer ",[14,161,164],{"href":162,"rel":163},"https:\u002F\u002Fbetatype.com",[18],"Christian Robertson"," and until I see it on a Droid device I’ll cut him and Google some slack. From the screenshots I’ve seen online it looks like a good fit.",[10,167,168,169,173,174,179],{},"You have to at least respect Google for continuing to improve typography by commission fonts. Microsoft are the only other major UI player doing this as Apple’s sole contribution to typefaces in the last 10 years has been a ",[14,170,172],{"href":171},"\u002Fblog\u002F2009\u002Ffirst-impressions-of-snow-leopard\u002F","hack-job on the open-source Deja-Vu Mono to rename it Menlo, move some bars around and to trash the hinting in the process"," so they have something to replace the aging ",[14,175,178],{"href":176,"rel":177},"https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FMonaco_(typeface)",[18],"Monaco"," with.",[10,181,182],{},"If you want to download the font yourself here is a complete set of the files taken from the SDK (unlike the other zip floating around this one has all variants + the license).",[107,184,185],{},[10,186,187,188,192],{},"Download ",[14,189,191],{"href":190},"https:\u002F\u002Fmaterial-design.storage.googleapis.com\u002Fpublish\u002Fmaterial_v_4\u002Fmaterial_ext_publish\u002F0B0J8hsRkk91LRjU4U1NSeXdjd1U\u002FRobotoTTF.zip","Roboto (2015) Font Family (ZIP of TTF)"," (1.2 MB)",[10,194,195],{},[196,197,198],"em",{},"[)amien",{"title":200,"searchDepth":201,"depth":201,"links":202},"",2,[],"Typography",8,"2011-10-19T21:44:10+00:00","Google have switched system font for Android’s latest release (known as Ice Cream Sandwich) from the Droid Family to a new typeface known as Roboto.","[object Object]","md",null,false,{"className":212,"src":40,"alt":41},[39],{},3,true,"\u002Fblog\u002F2011\u002Fandroids-roboto-system-font-for-ice-cream-sandwich",{"title":5,"description":206},"blog\u002F2011\u002Fandroids-roboto-system-font-for-ice-cream-sandwich",[220,221],"Android","Google","\u002Fblog\u002F2011\u002Fandroids-roboto-system-font-for-ice-cream-sandwich\u002F",481,"2pKsqU_SYpfFxD8s_YDw68nvP_MHGWiEZ_MMxlFqrrY",[],[227,231,235],{"title":228,"date":229,"url":230},"Using variable web fonts for perf","2021-12-03","\u002Fblog\u002F2021\u002Fusing-variable-webfonts-for-speed\u002F",{"title":232,"date":233,"url":234},"ZX Origins - free 8-bit fonts for games","2019-06-03T08:00:00-08:00","\u002Fblog\u002F2019\u002Fzxorigins-free-8-bit-fonts-for-games\u002F",{"title":236,"date":237,"url":238},"Typography in bits: For a few pixels more","2016-08-09T20:43:53+00:00","\u002Fblog\u002F2016\u002Ftypography-in-bits-for-a-few-pixels-more\u002F",1780900536746]