It is possible to create an adaptive app icon for your app, since the Android Version 0.
For Android, adaptive app icons are being supported by the Purple Apps with the template version 6.3.
Why? Adaptive app icons make devices more coherent by unifying the shape of all app icons. In addition, you have the possibility to create new visual effects for the symbols.
Important: It is mandatory to adjust your existing app icons, if you are upgrading from a version, that is older than template 6.3, to a higher app template.
If you want to modify your app template, we recommend to read this article.
Table of contents
- How to create the adaptive app icon
- How to change the Build Template in Manager
- How to upload the adaptive app Icon into the Manager
- How to test the adaptive app icon
For further information about the advanced use of the icons, visit this external Links:
Understanding adaptive app icons https://medium.com/google-design/understanding-android-adaptive-icons-cee8a9de93e2
Designing adaptive app icons https://medium.com/google-design/designing-adaptive-icons-515af294c783
How to create the icon
Adaptive icons are actually made up of two layers; a foreground and a background. Both layers are at least 432 pixel x 432 pixel; the background must be fully opaque while the foreground may include transparency. These layers are stacked on top of each other. Please, create both as PNG.
You can find a template to hand over to your designer, here:
Download template as Adobe Illustrator (ai) or Encapsulated PostScript (eps) file
How your icon should look like:
App Icon foreground | App Icon background
Please note: It's important that your logo/Icon for the foreground has enough space to the outer border, so that the icon is not getting cut of later:
The following dimensions must be taken into account:
01. 432 pixels, represent the total size of the icon area.
02. 262 pixels, is the safe area for the different shapes of the adaptive icon.
03. 211 pixels, is a small distance between the logo and the edges of the adaptive icon to avoid cropping.
In order to check whether the dimensions of the icon fit, we recommend the following website, where you can upload and check the foreground and background files. https://adaptive-icon-tester.nabettu.com/
How to upload the adaptive app icon into the Manager
Follow these steps to upload the Icon:
1. Go to App Design
2. Go to Android – Basic Settings
3. Upload the new App Icon to 01. App Icon Foreground (432 x 432 px, PNG)
4. Upload the mask to 02. App Icon Background (432 x 432 px, PNG)
5. Click on Save on the bottom of the page
How to test
Follow these steps to test the Icons on Android devices:
1. Go to Overview
2. Go to Build App
3. Choose Preview App – choose Android – click on Build
4. Back in Overview – find the QR code on the right side of the page, scan the code and download the app to your Android device
5. Important: In order to test, you need at least Android Version 8
6. Test on several devices how the adaptive app Icons look like on launch screen. If everything looks good, you can submit the release app in Manager.