Concept: What might Google’s iOS apps look like with native UI components?
In October, Google announced that they would eventually move their iOS apps away from Material Design and introduce more native user interfaces. While we still haven’t gotten a glimpse of what some of the most used apps on the planet might look like, built with native UIKit components, I thought it would be cool to work out some concepts and design. ‘imagine what they might imply.
Google introduced Material Design to its iOS apps shortly after introducing Android Lollipop in 201, but they’ve been sharing UI elements for a bit longer. They have updated their iOS apps as their design language has evolved over the years. But this year Android took a major turn in a new design direction with Material You, and it’s clear Google has no plans to bring it to iOS.
So I took six of the most used apps on the App Store: Google, Chrome, Google Maps, Gmail, YouTube, and Google Docs and redesigned them with Apple’s own UI elements. The first thing that struck me was how drastically different they are. Google’s design language is great, but it’s drastically different from native iOS, and it can be off-putting for users when they switch between many different design styles. With native iOS elements, Google apps feel right at home.
Let’s take a look at Google Maps. The first thing to do is to eliminate that floating search bar with the heavy drop shadow. I replaced it with a standard navigation bar that has a search box, an account button and below them a series of filters with more native buttons. The floating buttons in the lower right and left corners of the screen also need to be updated. I gave the Google logo a blurry background and used a floating button design more reminiscent of Apple Maps for the current location.
Google’s apps use a custom tab bar at the bottom of the screen that reacts a little differently than the native version. Google’s version has slightly different formatting and icon placement, so I swapped it out for Apple’s own version. It would also no longer have the heartbeat animation when you tap it. This is just one example of how a Google app could be adapted to look more native on iOS, at least on the surface.
Here’s a Google app, ironically, with very little UI chrome. Google’s Chrome browser uses a single toolbar at the bottom and a custom search box at the top. I simply replaced the two with their native counterparts. Of course, the app looks a lot more like Safari. But the changed layout is still clearly Google’s.
Gmail, Docs and Search
Moving on to the Google app, there is very little work to be done. All Google has to do is change its choice of icons, swap the search box, and tweak a handful of buttons. The app doesn’t even look that different with native elements.
Gmail, on the other hand, is vastly different when imagined with native elements. I’ve taken a little creative freedom here and done some slightly unusual things, so it might look vastly different in reality when it happens in the future. I took the design of the square button from the Home app and adapted it to the three other mailboxes that float above your main inbox.
Like the Google app, Google Docs doesn’t require too many tweaks. It definitely looks like Google Docs, but it’s also clearly a native iPhone app. There is no trace of material design left here.
The YouTube app needs perhaps the most radical overhaul. It’s an app full of heavily customized UI elements, so it would essentially be redesigned from the bottom up. Just to give you a bit of a background on some of my picks here, you can see that there is now an Apple-designed stacked modal view when watching a video rather than Google’s custom fullscreen modal.
I also replaced all of the Google icons with Apple’s and cleaned up the UI with better spacing. Eagle-eyed readers will notice that I’ve also replaced the Chromecast icon in the top toolbar with an AirPlay button, an obvious change for people living in the Apple ecosystem.
This exercise was very interesting for me, because there are many ways for Google to reimagine its applications with native elements. These are very safe versions of the redesign of these apps, but Google could do something a lot more drastic and really rebuild them for iOS.
What do you think about Google getting rid of Material Design in its iOS apps? Let us know in the comments below.
FTC: We use automatic affiliate links which generate income. Following.
Check out 9to5Mac on YouTube for more Apple news: