Cross-Platform Design Strategy Tips in 2019
Android and iOS users have been at odds for over a decade. Each platform carving out its path and even stepping on each other’s toes in the process. However, for many consumer app developers to pick a side would mean to ignore a large chunk of users. Android and iOS make up 97% of the mobile operating system market share with iOS dominating the profit share because of user’s high activity levels and Android dominates with 74% of the global total. So a cross-platform design strategy is needed to reach as many users as possible.
Design implementations can change from platform to platform. These differences in convention can affect the user’s ability to understand the UI or complete certain tasks. Platform-specific conventions are recommended, however, in cases where the design differences are minimal, adapting to the platform is optional.
When I approach implementing a design I always look for components that may seem difficult. It gives me time to brainstorm an approach or raise any red flags that I may have. It’s always good to approach designers with other options that both fit that style and also make it much easier to develop. We wrote a blog post on design trends to take into consideration when building your strategy, which is another layer to the process. Larger changes like app navigation, or custom interactions may take further explaining to make others aware of the risks. These concerns from a developer are necessary to make for a smoother development cycle.
When going the route of creating custom components so that each platform looks and feels the same way, understand there are things that you must be aware of. Although the design may stand out visually it is likely that users won’t understand how to interact with the UI and will likely give up in confusion. With that in mind consider the following:
- Custom components come at a high risk and a high cost. This requires more development work and further testing with a higher tendency to fail for users. For example using cards to approve and deny requests in a tinder/card deck style. Although it may sound and look cool however in combination with asynchronous tasks, creating, updating, deleting, card animations and transitions it can get a bit trick later on if not setup correctly.
- There may also be technical constraints for a platform that may result in an easier implementation of a component on one platform than the other. For example, creating a Floating Action Button may seem easy to add on Android but iOS may run into more problems regarding the FAB down the road.
- Consistency is a key principle of UX Design so consider what may be familiar to the user. This may mean that you should tailor components to other apps the user may use on that platform.
Platform Specific Design
When taking a more platform specific approach to design it is recommended that you use iOS Human Interface Guidelines and Google Material Design native components. This way is one of the best approaches, especially coming from a development perspective. With fewer custom components it will reduce the time it takes to development. Furthermore, users should be more familiar with native platform patterns and controls. However, strictly following these native guidelines can leave little room to create unique and innovative experiences.
These are Guidelines, not Hard Rules.
“It’s important to understand the idioms and behaviors of each platform before you start design and development. That way your users will be able to use and easily understand your app on the platform that is native to them, and you will have the most clear and true version of your product — no matter where it’s used.” – Design from iOS to Android (and Back Again)
The key for platform specific design is that it is important to understand the actual platform itself in order to explain the reasoning behind any design decisions. Are we following the guidelines or are we doing this because we are concerned about users experience?
When taking this approach you’ll run into native features that are relatively simply to do on one platform than the other. Navigation has always been pretty troubling in how many different configurations you can come up with. Android apps typically use the Navigation Drawer while iOS takes advantage of Bottom Tabs. However, Android does have support for Bottom Bar Navigation, this may conflict with Android’s on-screen navigation buttons. Gestures and interactions can also get tricky when trying to mimic 3d touch on Android and other native navigation gestures on iOS. In these cases take some time to decide what’s worth replicating and how to do it natively.
Moving from iOS to Android and back
In my experience, making the transition between developing for Android and then moving to iOS and back can be difficult, at first. When you begin to understand each platform’s tools and limitations you are able to separate concepts from implementation. You’ll see that many of these platforms have similar interactions and tools. With more updates to development tools, sdks and physical devices, what’s done on one platform can be replicated on the other (in most cases).
Pro Tip: Forget About iOS When Working on Android
Apple has been known to be the standard for mobile design due to their commitment to UX and _ . Along with many 3rd party platform tools catering towards iOS, Android gets less attention and this is why we come across many Android apps that have been ported from iOS. However with many improvements to Material Design it would be in your best interest to understand both platform’s guidelines. Being built on a foundation of best practices in both traditional and web design, Material Design is informed by user experience research and cognitive science. These guidelines that were developed from these findings are intended to be universally applied across all platforms and devices.
These are just my recommendations from the other side. Shouting from across the street to look out for oncoming traffic. There’s no one correct way to design for cross platform, although you’ll know where you stand from user’s reactions and feedback or lack thereof. Using these guidelines will of course lead you in the right direction however don’t be afraid to set your own path. All means of solving a problem are correct if they work.
Want to find out if your design strategy is working?
Shae is a mobile developer with a passion for producing business-focused applications and strategy-based mobile development. What began with home-grown app prototypes has turned into a career at Shockoe focused on Titanium and Android development as well as considering market deployment practices. When he’s not deep in code, Shae spends his time playing video games and listening to Hip Hop.