How to Design Top Converting App or Game Icons for Android
After doing over 100 A/B tests here in Peaksel, we decided to analyze them all and see what we can learn from them when it comes to icon design. It was originally intended for internal use only and shared with our UI designers, but because of the lack of quality articles on the topic, we decided to release it to the public.
We performed all the tests on our apps and games on Google Play, using their official A/B testing tool available in Google App Developer dashboard.
The cases and conclusions are here to point you in the right direction when designing icons, but make sure to always test at least 4 different icons on your audience.
A/B Tests
1. App name: Alphabet Coloring Pages
“N” is more popular than “A”. One would assume that A would be more popular being the first letter of the alphabet, used much more than “N” in conversation or writing, but for some reason, “N” turned out to be 50% better than “A”.
Conclusion: Never assume, always test.
2. App name: Classical Music Ringtones
A few things to think about:
- The “M” letter that looks like a piano is a “brandable” symbol created by a designer to be original. In reality, it is just a meaningless symbol to all users and that is why it performed the worst in this test.
- Mozart in both versions is definitely better than the other two so we could say “people over objects”. Plus, it is a more relevant association to classical music.
- Classic round-corner shape (the winner) performed better than the circle-shaped one and here is why we believe that to be the case: first, the square is bigger then the circle so the image is more visible; second, the losing icon has bad shadows and is not visually pleasing.
Conclusions: Don’t do “branded” icons unless it is an already established brand. Characters are better performing than things, if relevant. Think about using the space more efficiently and make sure the effects are looking good if any.
3. App name: Cat Coloring Pages
The winning icon performed 20% better than the other one, despite having the same character.
The winning icon is better at visually explaining what you can do with the content. Based on that, it gives users no doubt what the app actually is about. The losing one could represent other things as well, like a wallpapers app, an illustration portfolio, an animal shelter organisation app etc.
Conclusion: Make sure your icon cannot be understood incorrectly by indicating a way of using it, if possible and if needed.
4. App name: Dinosaur Coloring Pages for Kids
The losing character may seem more interesting, but the one with ¾ position won, for the sake of that position only. It may look like a bold statement to say that the position of the character determined the winner, but this has been confirmed in multiple cases.
Conclusion: If using a character, try to do ¾ view like in the example above. Make sure the character looks the user in the eyes when the user is holding the phone.
5. App Name:
Emma the Cat — My Talking Virtual Pet
In this case, Pocahontas over-performs Little Red Riding Hood by 9.22%.
Please be advised that characters may have the face and figure protected by copyright and most of them actually do. On the other hand, the wardrobe they wear and haircut are not, especially if it is something common in the real world, like an Indian traditional dress and haircut, or a simple red hat.
Respect other people’s work, don’t steal it, but we do recommend doing one version like this for a test.
Conclusion: Characters that remind users of popular characters they love perform better. Stay within the limits of the copyright law and aim for a light impression of familiarity, but don’t overdo it to mislead users.
6. App Name: Free Ringtones for Android ™
This clearly shows that Samsung series icon shape (the winning one above) performs the best. Considering that the app already has the word “Free” in the title, the badge on the icon is superfluous and only increases the amount of details. If your competition is mostly paid apps and you have a freemium model, it is still worth testing it with the “Free” badge, especially if the word “free” is not in the app name.
Conclusion: Classic round-square icon shape looks old fashioned and gives the impression of an outdated app. Avoid too many elements on the icon unless they provide a strong value in informing the user.
7. App Name: Kimmy Superstar: Talking Fashion Cat
Once again, ¾ view of the caracter wins. For this audience, obviously a natural look performs better.
This test was active in December, just before Christmas. Again, ¾ view test confirmed and the seasonal version dominated the regular one.
Conclusion: ¾ view of the character almost always wins. Take trends and holiday seasons into consideration.
8. App Name: My Talking Dog 2 — Virtual Pet
One more confirmation of the ¾ view of the character and in this case, more lively color scheme with a better contrast wins.
Conclusion: Make sure the contrast between content and background of the icon is good enough.
9. App name: Old Telephone Ringtones
One of the few cases where a character doesn’t outperform the object. Simple reason is relevance. Another reason may be that the audience is more familiar with the phone on the left compared to the one on the right.
Conclusion: Always use the most logical thing you think of when you read the app name out loud. Even better yet, use what your target audience would think of first.
10. App name: Popular Ringtones
There will be times when an icon that meets all the requirements still loses to a one that does not just because the latter looks better. Avoid icons with too many details (far right) and always use symbols instead of text.
Conclusion: Always make sure your icons look good. Avoid too many details because icons are very small on the phone and high complexity images fail. If you use text on the icon, think about the fact that most of your users will speak other languages than English.
11. App name: Pregnant Talking Cat Emma
Same character view, similar belly size. The detail which removed the doubt in the cat’s pregnancy is the baby stroller. Christmas tree didn’t win regardless of Christmas time and the only reason is relevance. Blue stroller has a very low contrast and not clearly visible, especially on the phone.
Conclusion: If you think that you are not making a strong enough statement with your icon, add a detail that will remove the doubt, but make sure it is a relevant one.
12. App name: Romantic Love Ringtones
Relevance again. Hearts represent love, but the couple in front of the hart shows the romance as well. Both users searching for Romantic ringtones and those searching for Love Ringtones are satisfied, despite the increased complexity. There is also a factor where all the competitors use hearts and this one stands out from the faceless crowd.
Conclusion: Always check the competition before you start. Go with the version that sends the same message and looks significantly different than others.
So, there you go. These are some of the things A/B icon testing on Google Play has taught us. We hope some of these will come in handy for you once you start designing your own app and/or game icons.
