If you want to list the most impressive changes of Android 12 , Google is based on the new design language Material You for Google Pixel. This new set of UI must be one of them. In Android 12 on Pixel devices, changing a wallpaper can give the entire system UI a new look, from the font color of the lock screen time, the launcher icon, the search box button, to the notification center, and the quick setting panel switch. Even the widgets placed on the desktop can display real-time background color effects based on their placement on the desktop by adapting the dynamic colors of the Android 12 application.
More importantly, in order not to let this personalized customization system centered on wallpaper color selection only stay on the surface of the Android system, Google is working hard to "proof samples" with Pixel models, while also actively promoting Material You in Adaptation in your own application. When the source code of the official version of Android 12 was submitted to AOSP, we compiled the Android applications that have been adapted to Material You design at present (as of October 6, 2021).
Google application
Three-piece basic communication
Although it is the "infrastructure" of smartphones, Google's own phone, address book, and text messaging applications are not fast enough to follow up Material You, and the degree of adaptation It can also be said to be uneven.
In the address book, the search box, the left navigation drawer, the view filter menu in the upper right corner, the title bar of the application settings and other areas will be decorated with colors extracted from the desktop wallpaper, Material Design iconic floating operation buttons (FAB) While applying dynamic colors, the shape has also changed from a round shape to a rounded rectangle.
And in the dial-up application,When the dial keyboard is stowed, the floating operation button in the lower right corner also uses the same style of rounded rectangular buttons. The floating operation buttons at different levels are also visually distinguished by different dynamic colors; in addition to the same applied to the search box background and highlight selection In addition to the dynamic color matching of the background, setting interface background and other areas, the bottom navigation bar of the dial application also uses icons and backgrounds of different dynamic colors to create a more layered bottom navigation bar design.
is the "blind spot"1 of Google's own standard adaptation. The dial-up application does not even have the most basic edge-to-edge adaptation. The background of the top status bar and the bottom navigation bar is always white under the light-colored theme, and the visual effect is impressive. Feel unwell. But the new style of the bottom navigation bar here, together with the dynamic color and rounded rectangular floating operation buttons mentioned above, constitute the core style of Google's own application Material You.
As for the information application, as of press time, Google has only updated the floating operation button in the lower right corner of the main interface of the application. The same is changed from a circle to a square. When scrolling through the information list, the floating operation button will change Switch between the expanded form and the simplified form according to the sliding direction; the setting items have been reorganized and made clearer. But in addition, the update of the information application can be said to be lackluster. We can't even see the shadow of the dynamic color. Regardless of the desktop wallpaper, the application uses blue as the default color.
Calendar
Google Calendar , which is also the basic application, has done much better in Material You adaptation: the dynamic colors extracted from the desktop are extracted from the main interface, the title bar, the main, The second floating operation button extends to the navigation drawer and settings on the left. The current date marker, activity card (default style) and other controls in the schedule view are also decorated with dynamic colors with different values, which look harmonious and not. Lost changes.
more importantly,Google Calendar also uses the Material You dynamic color in the desktop widget. Depending on the placement of the desktop, the color of the widget title bar will dynamically change. Generally speaking, the calendar application is one of the adaptation cases that interprets the new design in place.
Chrome
Chrome has always been conservative and cautious in function and design. After upgrading to Chrome 94 and above, users using Android 12 should also see some new changes 2: The main interface The search box, address bar and quick access tabs, the title bar when browsing the website, the tab border of the multi-tab management interface and other interfaces have been extracted and adapted to different dynamic colors. The tab cards of the multi-tab management page are also A more rounded design with rounded corners is adopted.
Chrome 94.0.4606.50 The effect of turning on the above function tabs
In addition to Chrome browser , there is almost no design adaptation, even the browser setting interface is still old Look like.
Calculator
The new version of the calculator equipped with Android 12 Beta 5 officially adopts the Material You design style, and the visual perception of this system gadget has also been greatly improved.
First is the color. Through different dynamic color values, different areas of the calculator and different keys can retain the sense of hierarchy while also responding to the overall color style of the system. If you change Android 12 to dynamic The colored egg widgets are added to the desktop and fully expanded, and you will find that the main interface of the calculator is basically the extracted N1, N2 and A1, A2 similar color columns. Clear all (AC), a button that requires careful operation, is directly retrieved Column A3 is emphasized.
In addition to the color,The calculator button changes from square to round, and the calculation result and calculation history area are also distinguished by soft rounded edges and similar color values.
Clock
In Android 12 Beta 5, the clock application is also added to the Material You package along with the calculator.
Although the clock application still uses the dark theme by default and cannot be changed, the Material You in the application is fully adapted, except for the switch, button, bottom navigation icon, and the highlighted background when selected. A large number of areas are extracted and used In addition to the dynamic colors, the weight change of the alarm clock when it is turned off and activated, the rounded corner cards and the stack of round buttons with large color blocks all give people a strong sense of visual freshness.
In addition, the clock widget has also been updated synchronously. In addition to the three different styles of digital clock , the countless polygonal analog clocks in the Android 12 debut video are also included. These components are placed on the desktop. The color can still be dynamically changed according to the different placement position.
File Geek
Although file geek can be said to be a general existence in Google’s own application 3 from the design rule, this application still follows Android 12 to extract and extract Material You dynamic colors. Applications include the cleaning operation buttons on the main interface, the pop-up menu of the file browsing interface, the navigation icons in the bottom navigation bar, and the navigation icon selection background.
However, in general, the Material You design adaptation of document geeks can still be described as "broken". In addition to disrespect for the Material Design design specification itself, there are still a lot of crossovers in the app. A generation of "combined" design, whether it is a rounded rectangular card with shadows, a bottom navigation bar and a quick index tab on the right, or a file browsing menu that still uses Roboto instead of Google Sans fonts,The overall visual style gives people a feeling that they are still changing the skin and still not being able to material design essence.
Google Podcasting
As Google’s first-party podcasting application, Google Podcasting has also followed up the Material You design style in the latest version, and improved the visual consistency between the application and the system interface through the dynamic color of a large area of application sex. At the same time, the iconic new bottom navigation bar design is also used.
However, in addition to the dynamic color and the new bottom navigation bar, the Google Podcast app and the dial-up app also exposed the problem of not adapting side-to-side because the bottom navigation bar "changes color". The pure white navigation bar background It seems to have a very obvious sense of fragmentation. In addition, as Google’s first-party player application, we also expect that Google will be able to come up with more Material You player design ideas in the future-such as the wavy progress that appeared in the promotional video but has not yet been implemented by any app. strip.
Google Photos
Similar to the calendar application mentioned above, Google Photos can also be said to be one of the Google applications that Material You is well adapted to.
In addition to the extensive use of dynamic colors and brand-new bottom navigation tabs, the rounded corners and card designs that have been widely used in the main interface of Google Photos also add a lot of color to it, buttons and search boxes in the application. Other controls also use similar colors instead of shadows to reflect the hierarchy. When browsing the album, the time-separated text also uses a large font title similar to the Android 12 system settings, which has both visual effects and separation effects. Although the
camera and Google Lens
camera application are more functional than design in the Android system, the dynamic colors of Material You still play a good embellishment effect.
In Android 12, the current shooting mode selected at the bottom of the camera viewfinder will be prompted by a label background with a dynamic color. The zoom button in the viewfinder, the security album switch, and the top settings panel are also indicated. All use dynamic colors extracted uniformly to present the selected effect.
Similar to the camera application, Google Lens has partially adopted the Material You design, such as the word translation prompt in the viewfinder. But the bottom function label still did not follow up the dynamic color adaptation.
Google Workspace
Although the left navigation drawer is still retained, Google Drive uses the dynamic colors extracted from the desktop wallpaper, navigation bar, background, bottom pop-up menu, search box and other different interface The level is also reflected by the change of similar colors. The new version of the bottom navigation bar design and the desktop widgets that support dynamic colors are naturally not absent.
Other applications in the Google Workspace suite, such as Gmail, documents, tables, slides, etc., also have a relatively complete Material You adaptation, dynamic colors for large-area applications, and suspension of rounded rectangle styles There are many operation buttons, Gmail also has a new "four-leaf clover" dynamic color widget.
What's interesting is that Gmail should also be the only Google app that has different ideas about the bottom navigation bar design of Material You. If you turn on the bottom navigation tab pages such as chat rooms and Chat in the settings, you will find that the bottom navigation bar of Gmail is a bit shorter than other Google applications.Obviously, the Gmail team believes that although the bottom navigation bar of the new version has a new look and feel, the screen utilization rate can be slightly improved.
Keep notes
Keep notes The adaptation of Material You is mainly focused on color matching and widgets.
In the application, the search box, the bottom operation bar and the floating operation buttons on the bottom operation bar have been replaced with new styles and dynamic colors. The background of the main interface and the labels on the note cards are changed to lighter or Deeper similar colors are used to highlight the hierarchy. The only catch is that the rounded rectangular floating operation buttons on the bottom operation bar use shadows instead of different colors for emphasis.
Google Keep also provides a new version of the "four-leaf clover" widget, which can automatically change colors according to the placement.
Gboard
The more obvious it seems, the easier it is to be overlooked. At first we even forgot to add Gboard to the outline of this article.
In Android 12, Gboard provides a new dynamic color theme scheme. After opening, the keyboard background and keys will be embellished with the colors extracted from the wallpaper.
Gboard is small, but it best reflects the core design concept of Material You: flexible use of different geometric shapes according to functions and scenes, use color to emphasize key operations and key areas, use color difference to reflect the level while avoiding use as much as possible Shadow... It should be regarded as one of the outstanding representatives of the Google application Material You design.
Third-party application
Sleep as Android
Sleep as Android is an older sleep tracking application. In the beta version of 20210910, Sleep as Android is officially adapted to Material You’s dynamic color system.With the extensive use of rounded rectangular cards in the main interface, extended floating operation buttons, and clear, layered interface and setting items, we can't see any "old brand" taste at Sleep as Android. The fragrance of the new design is blowing on the face.
Tasker
The same old Tasker has been very active in adapting new features to Android in recent years. The latest version of Tasker still retains a lot of the flavor of the "nougat" era, but the color scheme of the main interface has followed Material You.
The only thing I have to complain about is that Tasker seems to be a little bit off in dynamic color selection. For the same wallpaper, the color scheme of Sleep as Android is obviously much better than Takser. This actually reflects a problem: The colors extracted by Material You are only the first step. Whether these extracted colors can be used reasonably to add points to the application's appearance depends on the actual understanding of the application developer.
DarQ
DarQ is a small tool that uses root privileges to forcibly open a dark interface for applications that do not support dark themes (such as Handshaker ). In version 2.0 at the end of June, DarQ has already added support for the Material You color system. After minor repairs in version 2.1 at the beginning of July, its current experience on Android 12 has been quite complete.
It is worth mentioning that DarQ, as a tool application, is designed to follow the Android 12 system settings as much as possible in the design of the application settings. The title bar at the top uses a large area of white space, and the total function switch is also It is consistent with the new style of system settings, and eliminates the visual difference between third-party tools and system settings to the greatest extent.
Inware
Inware is a system information detection tool similar to AIDA64. Compared with the tedious design of AIDA64, Inware's UI is more modern, and a part of the information is sacrificed in exchange for better legibility.
In the latest Inware beta, enter the software settings in the upper right corner of the main interface, and you can find a switch named Use system colors in the appearance menu. After turning it on, you can make Inware's color scheme match the system wallpaper .
texture file
Unlike the file geek mentioned above, texture files from third-party developers have always maintained a standardized Material Design style design. Therefore, the texture file is also one of the first third-party applications to adapt the Material You dynamic colors. Just turn on the relevant switch in the application settings to unlock a new color scheme that is completely different from the preset theme scheme.
However, in addition to the adaptation of the color scheme, the texture file does not currently have too many interface elements and controls on the renovation, here may wish to look forward to the follow-up update of the following gadget.
Swift Walls
There are too many third-party wallpaper apps on the Android platform, but there are not many wallpaper apps like Swift Walls that attach the same importance to wallpaper browsing, setting, and editing experience. In the latest version, Swift Walls not only adapts the dynamic colors of Material You, but also adopts a large number of interface controls that comply with the Material Design design specifications. The application settings are also in line with the overall style of the Android 12 system settings. The visual impression and user experience are very good. .
Infinity for Reddit
is similar to Twitter and Weibo ,The social networking site Reddit also provides a variety of third-party clients with opportunities to display technology and aesthetics by opening related interfaces. This includes Infinity for Reddit (hereinafter referred to as Infinity).
Compared to the official Reddit client, Infinity adds a lot of Material Design design flavor to the app without changing the main function layout-from the bottom operation bar and centered floating operation buttons in the Material Design 2 era to Material You dynamic color scheme introduced in version 5.0.4.
However, Infinity also has similar problems with Tasker. After manually turning on the Material You theme switch, it will use several key colors with high saturation in the system color table as the top bar, bottom bar and information The default background color of the card looks a bit "excessively". However, Infinity itself also provides a fairly mature solution to this problem: After enabling the Material You theme switch, we can still manually modify almost every color in the app.
Todoist
Google Tasks, the first-party to-do app of Google, does not seem to follow Material You after replacing the new icon. The well-known GTD app Todoist, which has been on the minority homepage many times, took the opportunity to overtake the car in the v8602 version. Brings Material You dynamic color support to users.
It’s worthy of affirmation that Todoist’s dynamic theme color option is not included in the subscription unlocking area. Free version users can also enter the settings menu to manually open after installing the latest test version; but the current dynamic color matching of Todoist The solution has not had time to adapt to the dark theme, nor can it be synchronized to other devices across platforms.
notification filter box
notification filter box is also a "frequent visitor" of the minority homepage. As a system notification management software, it can solve the problem of spam messages from another angle-since receiving spam messages is unavoidable, it will save the country and achieve "management" without letting them pop up notifications. Target.
In the recently updated notification filter box v2.1.1, the developer has accessed the Material You dynamic color scheme for it, and even the floating operation button in the lower right corner of the app has been changed to a rounded rectangle style like the Google app.
Notification Filter Box-Notification Management & Blocking Tool
Tachiyomi
As a free and open source Android comic reader, Tachiyomi has always been a loyal follower of Material Design, and many of its branches can be said to be The blossoming of a hundred flowers reflects the different understanding of Tachiyomi's function and design by different developers.
At present, Tachiyimi has supported the Material You dynamic color scheme, and some excellent branches, such as TachiyomiJ2K, are adapted to the SplashScreen API of Android 12 and have amazing opening animation effects.
Summary
In the Google Pixel experience, Material You is only part of the visual and interactive experience Google designed for Android 12: With the Pixel Launcher as the starting point, Google applications can apply different color styles of desktop icons based on the desktop wallpaper ; From clicking the icon to start the application to entering the application to complete the main interface loading, the system will call the SplashScreen API to bring a comfortable and natural splash screen animation effect; after entering the application,The design based on Material You dynamic color will continue the familiar visual look and feel of the wallpaper and launcher into the app.
From desktop icons to in-app effects
Reviewing the history of Material Design from its development to the present, it can be said that this year should be the year with the fastest adaptation and widest coverage of the new design language on the Android platform. With Material You, whose shapes, colors, and animations are more lively and changeable, Google has also promoted the previously promoted Material Theming (to create brand recognition with the help of Material Design) to a new level. At least until the official open source later this year, when we see a screenshot similar to this article, we will immediately react-this is Material You, this is Google's Android 12 visual experience for Pixel series models.
Material Theming | Picture: Google
However, the Material You adaptation scheme we have seen so far also exposes some problems.
From the design point of view, some details of Material You in Google's own application still conflict. For example, the large color circle button of the Android 12 lock screen PIN code will become a rounded rectangle when pressed, but the same color is used. The calculator designed with a round button does not use this feedback animation. Another example is that the degree of adaptation of different Google applications is still uneven. The Gmail team obviously has a different view on the design of the Material You bottom bar. In the subsequent updated version The default bottom bar height has been fine-tuned.
The good news is that although this wallpaper-based color picking system will not be open source until Android 12.1 at the earliest, vendors such as , OPPO and Samsung have also followed Android 12 for low-level adaptation.But in the recently released One UI 4 Beta version, Samsung has already begun to respond to Google's design ideas (source).
Material You dynamic color adaptation in One UI 4 | Picture: XDA
How do you think about Material You and the existing Google application Material You design, and what are the good applications that are adapted to Material You not mentioned? Welcome to leave your opinion in the comment area.
.
