Advanced MIUI Theme Guide, Advice & Tips

mitu optimize

Over the past three years within the MIUI Theme Community, theme developers have produced some outstanding and fantastic pieces of work to show off their skills and vivid imagination which is met with great praise from the end user and from fellow enthusiasts. In the eyes of the theme developer this is encouraging and time worthy, as it allows constructive feedback to either update or improve the theme in question and also go on to develop more great themes.  This is perfectly fine but…

Now from experience and many veteran theme developers would agree on this next statement is that ‘a theme developers work is never complete’ but what if all avenues and options were not being pursued?.  Sometimes, if not all the time the theme developer can go that extra mile to really get the best out of their themes for the benefit of the end user and by doing so pushes the quality of work to the limit and beyond. Remember this is a two way street for both theme developer and end user.

I am going to explain some ‘under the hood’ tips/advice when it comes to developing that high quality theme so that in turn the end user reaps the full benefits, visually and practically in every day use.

I’m not going to go into to much detail but will give you a general overview of what one should be doing.

So here we go :

  • .9.png images

Lets get the worst part out of the way – .9.png, every theme developers worst nightmare maybe? If you are going to modify these images try to avoid adding to much detail to each .9.png. as when it comes to compiling these images for use, sizes can bump up quite a bit and also image performance can degrade depending on modifications.

  • images (colors, effects, gradients)

Colors, image effects such as emboss and gradients all effect the quality and performance of a theme. Always experiment with different colors, shadings and levels, you’ll be surprised on the comparisons you find.

  • remove unused images

This is a must! Always remove unused/unwanted images from your theme.mtz, it helps a lot especially when it comes to when the user is downloading (low mb size) and also when the user applies a theme it saves the theme manager from having to re-apply the same images when it does not need to do so, and more importantly sometimes you may be using a outdated image. Remember MIUI is always evolving and that 1 pixel can make a big difference.

  • optimization/compression

The fun part! performing image optimization is were the fun begins for the theme developer. As we are dealing with PNG’s that will be the main focus of this topic, though you may stumble on some jpeg images, and if you happen to be modifying these at any poiny the same rule of optimization can be applied with jpeg optimization tools.  There are many png optimization tools widely available on the internet some simple and some which pack a ton of features so give a few a try and see what best suits you.

Don’t forget you can also apply optimization to icon(s) as these are also in png format, and optimizing these brings benefits to the launcher when scrolling etc.

The benefits of optimizing png’s within a theme are a no brainer. Here are a few things to note :

png(s) size reduction when running non .9.pngs through the optimization tool of your choice you will seee and the tool should give you an output of the reduction size of the png(s) for example see below :

Before optimization : PNG Test Image.png 414 x 220 (89.1 kb) – high quality image

After optimization : PNG Test Image.png 414 x 220 (66.5 kb) – high quality image

which is 74% of the original size!  Now when once you have started optimizing many pngs thats when you start to see megabytes being shaved off the theme package.

Opti Test Image

reducing the size of the theme package and this allows the user ease of downloading over mobile network 2g/3g if no WiFi is available. Always take into consideration the end users needs and requirements.

high responsive touch on devices, this is a known factor when images are optimized and cleaned up, compare a un-optimized theme with a optimized theme, visually and you will see the big difference especially in the fluidity of animation transitions.

low resource usage is a very interesting one, once you have carried out all the important tasks which involve cleaning & optimizing your theme you will also notice that less resources are used after applying the theme, compared to a theme that has not been optimized.

This is the advantage of the MIUI Theme System over a compiled apk, with a MIUI Theme YOU are in control from start to finish, whereas, with a apk system, you can optimize images but when it comes to compiling the apk, thats were you loose control of any optimization you have done.  Optimized png images thankfully do not loose there image quality after they have been optimized too! And the end result of all this is that you as a theme developer have produced a much better end product  and that the end user will visually and practically reap the benefits.

Feel free to ask any questions by visiting the Theme Development Forum