With iOS 7 now upon us, the design wars are in full-swing. Who’s pulling away? Well, no one really. If anything, there’s an argument that they’re converging.
And while flatness is certainly a factor, you may have noticed iOS and Android started looking a bit more similar starting a couple years ago. The reason? Typeface.
Back in October 2011, Google released the Ice Cream Sandwich (4.0) SDK to the public. As part of its many changes, Google introduced Android’s current UI font, Roboto, which was created in-house to replace Ascender’s Droid Sans.
The response to Google’s Roboto was mixed. Typographer Stephen Coles branded it a Frankenfont, claiming it was “an unwieldy mishmash” of Grotesk sans and Humanist sans fonts. He then went glyph by glyph and compared Roboto to its influencing typefaces.
Apple stalwart John Gruber initially said he didn’t consider the font to be a Helvetica rip-off and judged it be an improvement on Droid Sans. A day later, he recanted, slamming Roboto: “I was too kind last night. Roboto is a Helvetica rip-off. It’s Google’s Arial.”
In the latest update of Roboto in Jelly Bean (4.3), we saw a bit of a reduction in the font’s distinguishing geometric nature. In Liam Spradlin’s thorough teardown, we see a glyph by glyph softening of the font. One good example is 4.3’s update of the comma, with Google instead opting for a softer, more rounded edge.
With Roboto’s letterforms becoming subtler as it ages, the loss of it’s unique geometries inch it closer in many ways to Apple’s iOS font, Helvetica Neue. Nevertheless, to go as far as calling it a total Helvetica rip-off is unfair.
If you look through the full glyph comparison, you’ll see Roboto does have uniqueness to its form, targeting a closed ‘a’ and ‘s’ and an open ‘e’ and ‘g’ to improve the texture across long blocks of text according to its creator, Christian Robertson. For his full rebuttal to frankenfont accusations, scroll to the bottom of Coles’ post here.
At this point, it should be clear that Helvetica and Roboto are similar, but not interchangeable typefaces. It could be the growing similarity in typeface or the shared flatness that might have you doing a double-take between iOS and Android at times, but it’s important to examine the trend in font weights as well, in particular, the shift to lighter ones.
Originally iOS had planned to go with a combination of Helvetica Neue Light and Ultra Light almost everywhere it could fit them before being forced to dial it back after considerable backlash to beta 3. That isn’t to say Apple didn’t fit Helvetica Neue Light a few places though, and it certainly hasn’t stopped app developers from working it in if you look at tapfame’s iOS 6 and iOS 7 app comparisons.
While Apple began to try to work in lighter font weights into iOS 7, Google started introducing some Roboto Light starting with ICS. In my experience with the Nexus 7, I noticed Roboto Light creeping in a couple places.
If you look at the left screenshot though, you’ll see a few unique characteristics of Google’s type. First, it uses ALL CAPS for some navigational elements in its UI. In addition, Google doesn’t hesitate to mix different weights and font styles on a single screen, using various weights, italics, and the aforementioned capital letters.
While the mixture may appear less elegant than iOS, there are some UX folks would contend it allows for improved information hierarchy. In short, you’ll read writing that contends Apple goes for aesthetics while Android strives for function.
While a potentially acceptable UX conclusion, it should be clear that design and UX do not exist on opposite ends of a continuum, but rather orthogonally as having one does not preclude you from having the other.
Nonetheless, Roboto Light has seen increased frequency though and I would be surprised if it doesn’t work its way more with KitKat. There’s also a chance Apple’s backtracking on its ultra-lightness in iOS 7 will influence Google’s upcoming unveiling. That being said, some major Android apps have already embraced the lighter Roboto, like Twitter which uses it for all tweet text.
So while we’ve seen convergence on typeface and weight for iOS and Android, what about the Windows Phone? Microsoft’s offering has always been flat while featuring lighter fonts throughout its UI, vectors on which both iOS and Android have both been traveling, albeit with lesser magnitudes.
As for typeface, Windows 8 uses Segoe UI while Windows Phone 8 uses a variant known as Segoe WP. Initially the two were slightly different, but Segoe UI has seen been brought in line with Segoe WP. In general, the Segoe fonts have a softer, more rounded glyph forms when held in comparison to both Helvetica Neue and Roboto.
As far as flatness and typography, there’s certainly an argument that Microsoft has been the design leader. Even so, I don’t think you can expect to see tiles or the horizontal app layout on iOS or Android anytime soon.
It’s clear with iOS 7 Apple wants to move to a more elegant look, featuring type where it used to have buttons while leveraging light weight fonts in various locations. KitKat should be a very interesting release to see the direction Android design travels.
Will Android also strive for elegance and uniformity or continue to favor using different Roboto weights and styles? Next month should be interesting.
As always, feel free to reach out with feedback on Twitter.
Disclaimer: I previously worked on text and fonts for Microsoft Office 2013.