[MIUI Central] XDARoni:
MIUI 12 brings a new look and feel to Xiaomi phones. With each new update, we get new and exciting animations and UI updates that make your phone better and more fun to use. I am running MIUI 12 on my Xiaomi Mi 9T and have been looking through some of the new improvements that you can expect once the official update begins to roll out. In this thread, I'm going to go over some of the new UI changes that I've found, and show you some animated gifs of everything in action.

Navigation gestures

MIUI 12 has brought full-screen navigation gestures to this newest update. If you've ever used an iOS device or other newer Android phones, you'll probably be familiar with the new navigation option.

To enable full-screen gestures, go to settings > Display > Full screen display. In this menu, you'll be able to switch between traditional button navigation or full-screen gestures.

Screenshots:

View attachment 5037131View attachment 5037133

Once this feature is activated, you'll have a new way of switching between apps. This gif shows what it looks like when going through your apps, and the animations that make everything look nice.

After using this feature for a few days, I got used to it very quickly. Many users will be perfectly happy with traditional button navigation, so it's nice that it's still included. I would recommend giving full-screen gestures a shot and see what you think after a few days of use.

New icons, fonts, and animations

When you first start using MIUI 12, one of the things you're going to notice is that there are some new animated icons. These icons are part of the pre-installed “Classic” and “Limitless” themes that you'll find on your Xiaomi phone.

Screenshots:

View attachment 5037127View attachment 5037129

MIUI 12 continues to improve on old designs with a new system typeface. This new typeface is more modern and matches the new UI and overall look of MIUI 12. In the screenshots below you'll be able to compare the MIUI 11 typeface

with the new look from MIUI 12

.

This gif shows off the new animations that you'll find in some of the system icons. This gif specifically shows the animation on the gallery and weather app icons. You'll notice that once the app closes and you're back on the homepage, the animation is triggered.

Here are two more examples that include the settings and camera app.

These new animated icons make your system feel more alive. It adds an element of UI design that makes using your phone more visually appealing.

You'll find new animations across the system with graphics like battery indicators, charging data, and more. And my personal favorite animation is still here from MIUI 11, which is the popup selfie camera glow.

MIUI 12 brings a more organized and beautiful layout for all data visualizations. Screens that display battery consumption, storage capacity, app usage, or other forms of data, use animations to give you a better understanding of what you're looking at.

When I select my storage settings, an animated graphic shows a color-coded meter displaying my usage. When I select different colors, you can see how the new UI makes it easier to see and understand the data at a glance.

This results in less time spent looking at usage data, and an easier way to keep track of this data.

Live wallpapers

New options for live wallpapers are included in MIUI 12, with themes of space, landscape, and aerial shots. How to find these new live wallpapers isn't immediately apparent, so I'll walk you through the navigation.

Go to settings > Wallpaper > My page (bottom right) > Wallpapers

“Super Wallpapers” are options that include backgrounds at four levels of zoom, from the always-on-display to the homescreen background. Depending on whether you choose the Earth or Mars live wallpaper as the background, you can see the planet from a far off distance on the always-on-display to a close-up on the homescreen.

While these are just a few of the UI changes in MIUI 12, they are my favorite so far. What new changes have you spotted? Post screenshots in the comments below.
​

​