Android and iOS: Why Different Platforms Need Different Designs

17 January 2017 by Sam Griffith

Smartphones have been on the market for long enough that major players have come and gone. Now, Android and iOS have established themselves as the major options. If you are looking at building a mobile app, you’ll want to consider one or both of these platforms. And, if you want to build for both platforms, you’ll need more than one interface designed. Without the right design considerations, your app could feel like it’s out of place or difficult to use.

Style

The most obvious difference between Android and iOS is the style – namely, Google's Material Design and Apple’s iOS. Material Design is characterized by solid icons, bold colors, and animations that remind the user of transforming paper, meanwhile the current iteration of iOS makes use of line icons, high contrast, subtle blur, and uses color sparingly to show interactions. Android is about using Material Design to improve interactions, while iOS uses its style to highlight content.

Bars

The most common elements of each interface are the bars. While the bars are in similar locations, Android and iOS often use the same name to describe different things. Key to making apps feel native to their particular platform is style and sizing consistent to other apps in the ecosystem. The Android guidelines are here, and iOS can be found at this website.

Android & iOS Bars

Consistent buttons

Android phones will always have the Back, Home, and Overview buttons within the Navigation Bar. The global Back button in particular is a big deal as it becomes much less important for Android apps to provide their own “back” button. Whether an app provides the option to return to a previous screen or not, Android users can always use the global Back button.

On the other hand, iOS users only have the physical Home button. Because of this, iOS users expect to see “back” or “dismiss” actions in the top left of their screen if they need to return to the previous screen. Without either of these buttons, users may become stuck in a screen.

Navigation

As mentioned above, Android and iOS do share some similar interface elements; however, some elements may be platform-exclusive or more common on one than the other. This is the most important reason that apps being developed for both Android and iOS should be designed individually. And as a side note, while it may be possible to re-create iOS style and behaviors on Android (or Android on iOS), it would actually take less time overall to create an app with styles and behaviors that are native to the platform.

Android navigation occurs primarily through the top tab bar or navigation drawer, and iOS uses the bottom tab bar. As of 2016, Google has officially added the bottom tab bar to Material Design guidelines, but the top tab bar is still a more common interaction within the Android ecosystem.

Menus Combined

On Android, the primary action of a screen would likely appear as a floating action button near the bottom of the screen. While on iOS, primary actions generally reside at the top on the right side of the navigation bar.

Primary Actions

Typography

Along with style guidelines, Android and iOS also have recommended fonts. Obviously these fonts are just recommended, but using non-standard fonts can be jarring for some users.

Roboto is Android’s default typeface, and Google recommends using Noto for languages that are not supported by Roboto. Check them out for free on Google Fonts.

The default font family for iOS is San Francisco. Apple’s guidelines say to use SF UI Text for text that is smaller than 20 points, or SF UI Display if text is 20 points or larger. Unfortunately, these fonts are slightly more difficult to download. Members of the Apple Developer Program can download it from this page.