With the first Android 12 Developer Preview, a massive redesign of the Settings app was uncovered, pointing to a revamp of Google’s Material Design. Let’s take an exploratory look at what some of Google’s other Android apps might look like with these next-gen Material Design cues.
Based on alleged Google design mockups that were leaked prior to Android 12 Developer Preview 1, the OS update is poised to bring a major redesign to Pixel phones and beyond. In another leak, it has been said that this redesign is known as “Material NEXT”, suggesting a third generation of material design guidelines.
While there were fewer surface-level changes in Android 12 Developer Preview 1 than seen in the leaks, our team was able to enable what appears to be a Material NEXT redesign of the Settings app. The stamps include a more accessible design similar to Samsung’s One UI, a redesigned search bar, thicker items in lists, and a layout that responds to your chosen system-wide theme colors.
With these recommendations as initial guidelines, we decided to try to imagine how Google applications might Look with the next generation of Material Design. Throughout this post, you will see mockups that serve to visually demonstrate the possible ways in which Google could redesign these apps. Please note that Material NEXT is still in an early stage of development and each application is also subject to its own design options.
When Google first introduced Material Theming as a step up from Material Design, Gmail was one of the first apps to get a “Google Material Theme” redesign. Starting our mockups on the simpler side, Gmail doesn’t need much in the way of a design change.
Here, we’ve simply changed the search bar from “rounded rectangle” to the more pill-shaped bar you see in the Settings app. The biggest change to the search bar is that the Google account avatar is significantly larger and now floats outside the search bar, making it easier to tap or swipe it.
The Play Store homepage was an equally perfect candidate for the revamped search bar. In fact, the Play Store is better prepared for this Material NEXT redesign for the search bar than most other apps, as Google has previously experienced ditching the drawer menu entirely. In that particular experimental redesign, the drawer options were moved to the menu that opens when you tap your avatar.
Meanwhile, other sections of the Play Store are the best for another important piece of Material NEXT’s redesign. In the Settings app, each page is given a sort of banner that takes up about the top third of the screen, keeping the page content at your thumb’s fingertips. The banner contracts and grows smoothly based on scrolling. In the second Play Store mockup above, we applied this flexible banner design to the “My Apps & Games” page.
Adding another layer to the mix, we believe that Material NEXT is closely related to the leaked and recently demonstrated theming system of Android 12. When developers in the Android community were able to enable the theming system, the colors were also used prominently in the Settings app, even as the main background color.
For this mockup, we took the Google Contacts app, changed the search bar, added a banner in the top third, and added the default bluish-white color seen today in the Settings app.
The last piece of Material NEXT that we can point to today is that Google has revamped the Settings app’s home page to make the elements thicker. Application developers will need to use this particular layout choice selectively as it significantly reduces “content density” or the amount of useful information that can fit on the screen. For example, Google would do well to bypass this particular setting in Gmail.
Putting it all together, the Google Files app could get a pretty significant makeover from Material NEXT. The mockup above uses a top third banner to keep everything within thumb’s reach, recolors the app’s background to the default blue, and uses thicker list items.
Bonus: Google Fit
Looking at these redesign suggestions, in some important cases, it’s natural to wonder how long it can take Google apps to catch up with what’s happening on Android 12. In the process of putting together this collection, we realized that Google Fit is already using the top third flex banner in some places. Take that for what you want.
FTC: We use income generating automobile affiliate links. Plus.
Check out 9to5Google on YouTube for more news: