Here’s an interesting take on app store icons: Think about the first thing people see when they are looking your way, the first impression, the one that leads the way—hopefully in the right direction.
When it comes to your app, this first impression is as important as in real life. Very much like the human face, a quick glimpse of a mere second at your app can tell so much: What is it for? What’s its purpose? Do I want any relationship with this app?
In the case of the app stores, there’s a lot you can do to change and affect that first impression. In this article, we’ll teach you about what is inarguably one of the most crucial parts of your app store optimization (ASO): the icon. It will explore how significant the icon is to your ASO strategy, the impact it holds over your conversion rates, and the components needed to benefit from a great icon.
What role does an icon play in the way a user discovers and installs apps?
Consider the icon’s role: it’s the only element that appears throughout the user’s journey. It doesn’t matter if that journey takes the user from a featuring placement straight to your app, from the search result page, or even from an ad on Facebook.
Moreover, the icon is the only visual element that sticks with a user after they install the app, as it is on their home screen; thus, it impacts engagement/app opens as well.
You will find the icon across all different pages. Regardless of what journey the user is taking, they will meet the icon in their path: on the featured page, the top charts, the category page, the app of the day, top games, the ‘for you’ page, editor’s choice, the daily list, when exploring, browsing, searching, or being referred. And since 70% of users are decisive ones—those who decide whether to install an app or not within three seconds—your icon may very well be the only thing their eyes will look at during this close, short encounter with your app.
What’s the impact of an app icon on conversion rates?
If you’re interested to learn more about the impact of App Store creatives on user behavior, we got you covered. We researched 500M users to uncover how they behave on the App Store and which asset are the most important ones to drive installs. Get it below:
Get the App Store Behavioral Report
Know which assets drive installs in the App Store
Check your inbox in a few 🙂
As previously mentioned, your app’s icon has a profound impact on visitors throughout all areas of the funnel; plus, it has a lasting impact on re-engagement since it can act as a reminder for users to open the app when they see it on their smartphone home screens. In the Apple App Store, the icon is the most dominant marketing asset in browse pages (i.e. today page, games page, and apps page). It also plays a big factor in search results and in the actual product page. For the App Store, the median potential conversion rate (CVR) for icon optimization is 18%.
In the Google Play store, the app icon plays an even greater role because, in addition to browse pages, the icon is the only creative marketing asset shown on the search results page. For the Google Play store, the median potential CVR lift for icon optimization is 11%.
Choosing the design style and message for your icon
What are the different messaging types when it comes to app icons?
Icons appear in different places in the funnel. They serve different purposes depending on the step in the funnel and the app.
The icons can also help create an emotional connection with the app and can support/reflect general marketing campaigns. If the app is developed based on intellectual property (IP), the icon serves to prove that this is the “official” app and makes the message more powerful, using creative assets that users easily connect to and identify with. It can also be used to demonstrate a value proposition (for example, in the social casino category, many developers feature a joining bonus in the icon, but it might also attract low-quality traffic that’s only interested in “free stuff”).
What types of app icons are there and what types are being used?
There are multiple creative directions to pursue when designing an icon. You should start with developing the right hypotheses around the desired design style and messaging and then testing it to see how it performed. If one of your hypotheses suggests that visitors prefer to see a specific feature of the app rather than an emotional experience of using the app, then the design of each icon variation should bring that statement to life.
Look at these examples of different design styles and ideas for additional testing within each style:
Characters centric: In this example, users will immediately connect with a recognizable character they like. You can choose between using a single character or multiple ones, whether to include text, or having a branded character.
Branding centric & title centric: The same concept is used here—users will recognize the brand within a second and will engage with it based on brand awareness.
Functional centric: When looking for an app, users are searching for a solution. Here, they will understand the core functionality of the app from the image that connects with what they’re looking for.
Universal principles for designing app icons
This section is based on the principles of Danish designer and entrepreneur Micheal Flarup, a well-known keynote speaker in the icon designs realm, who listed five core aspects of icon design:
1. Scalability – Remember that the icon is going to be shown in several places throughout the platform and in different sizes. Don’t overcomplicate your icon or cram too much into it. A big part of the conceptual stages of creating an icon should be considering the design scale. Make sure you try out your icon on the device and in multiple contexts and sizes and remember that simplicity is the way to go—focus on a unique shape or element that retains its qualities when scaled.
2. Recognizability – Flarup compares the icon to a song and the importance of being able to identify it among all the noise of the store or your home screen. You basically want your icon to stand out and be easy to identify. Try to figure out what makes your app unique, but don’t overcomplicate the icon. Flarup recommends removing details from the icon until the concept starts to deteriorate and see if this improves recognizability. Also, try to deconstruct your favorite icons to see what methods they used and what caught your eye.
3. Consistency – Good icon design is an extension of what the app is all about—making sure that the two support each other will create a more memorable encounter and more easily stick in the mind of the user. For example, keeping the color palette of your interface and icon in line, such as a green interface reinforced by a green icon.
4. Uniqueness – Not a lot to elaborate upon here—look at what others are doing in your field, and then try to go in a different direction. Play with colors and compositions, and bear in mind that the world doesn’t need another checkmark icon.
5. Don’t use words, but… Well, here, our data shows otherwise. Yes, automatically going towards the written word isn’t putting your full design expertise into good use. But there are occasions when it is OK to use words on your icon. Users don’t like to read—this much is true—and usually, you should aspire to find a better way to visualize your app then just mentioning your app’s name one more time; yet, there are cases when your message is so powerful or your brand is so strong that you cannot avoid it.
The dos and don’ts for designing app icons
Here are some extra tips from Storemaven’s ASO experts—the dos and don’ts you should follow before starting to design your app:
1. Use an icon that pops out but matches the unique voice of the app and looks cohesive with the rest of the page.
2. It’s important to make sure the icon looks good in different places in the funnel where it is visible: top charts, search results, the product page itself, and even on Facebook ads.
3. Make sure your app icon looks good in dark mode; we’ve seen many mistakes here.
4. A safe bet is to use icons that are easily recognizable by users. There are a few icons that enjoy mostly universal recognition from users, such as icons of houses, magnifying glasses, and envelopes. For example, the Gmail icon uses an envelope, which is universally associated with mail.
5. Given its crucial role within the user journey, there are multiple stakeholders that care about the icon, be it the brand team, the ASO team, the user acquisition (UA) team, and even product marketing teams that strive to re-engage lapsed users. When experimenting with a new icon or testing and improving a current one, make sure your goals are aligned with those of other teams.
1. Don’t use abstract icons—they rarely work well. Users can’t rely on previous experience to figure out the meaning behind the icon, even if that meaning makes perfect sense to you. The Game Center icon is a great example—an interesting, colorful icon but people usually wonder what it means.
2. Don’t include nonessential words. Repeating the name of the app or telling people what to do with it, such as “watch” or “play,” is useless. See section six again for the use of words—use them only when they’re essential or part of a logo.
3. Don’t include photographic details because they can be very hard to see in small sizes.
4. Don’t use 3D perspectives. Using 3D perspectives and drop shadows can make icons hard to recognize.
5. Don’t make icons merge with the background.
Testing your app icon: Why do icon tests fail 80% of the time?
Given the icon’s importance and effect on conversion and retention, you want to ensure you’re displaying one that gives your app the best chance to maximize growth and drive conversions. App store testing is one of the most effective, data-driven ways of doing this.
Since icons appear in a variety of areas, it’s not possible to test them cohesively throughout the different funnels in which users are exposed to them. However, this downside doesn’t eliminate the benefits of testing—and improving—the likelihood of success through a better icon.
After tracking thousands of icon tests that leading mobile publishers have run on Google Experiments, we found that, on average, about 20% of tests actually succeed in finding an icon that converts better than the control. In fact, out of all the possible elements to A/B test, icon tests fail the most.
Why? There are several reasons:
1. Weak hypotheses lead to too subtle differences.
One of the major reasons most icon tests fail is related to hypotheses, or lack thereof. Hypotheses, in app store testing, are precise statements that can be proven or disproven and should be used as a starting point for further investigation. These are what drive the creative design and direction of the test and they lead to actionable results. However, people tend to think of A/B testing in general—no matter what you’re testing and on which platform—as a one and done trick, as though changing a single button color will bring a boost in the number of clicks. A/B testing is not a ‘grow hack’ to achieve quick wins. That’s even more true for mobile apps due to the nature of the platforms and the unique challenges of app store testing in general (e.g., 100% of users are sent to the same place, every app store page has the same layout, visitors engage in different ways, the fast rate users make decisions, etc.).
Here’s a clear example of a strong hypothesis:
The key is to understand how to drive conversion, which means understanding how visitors respond to different creative assets and marketing messages and what aspects of the app are most appealing to them. It’s important to develop a long-term strategy rather than continuously running multiple, unrelated icon tests that don’t lead to valuable insights.
Good hypotheses are precise and framed in a way that will, once tested, advance your understanding of your app store visitors.
2. Siloed brand teams hold the keys to the icon and, consequently, hurt progress.
For this process to work, teams mustn’t work in silos and should strive to join forces and share their progress constantly. Every so often we encounter teams that generate some great results from our tests but, based on these results, face distressing challenges trying to convince the company to take a clear new direction. Remember this common mistake before you start the process and even more so when going through a rebranding phase: you need your brand team by your side, understanding the impact and benefits of rebranding and willing to change on the fly if necessary.
3. The icon is part of the larger story.
Another important thing to consider is that the icon is just another part of the story, but it has a major part. It needs to have a clear role within your narrative, and it’s vital that it blends, matches, and works inherently with other elements. A good example of neglecting this is having a strong character on the icon that isn’t portrayed on any other element.
Testing done right – how can you test your app icons to optimize app store conversion rates?
It’s hard to emphasize how important it is to master the testing process before moving on to making actual decisions. Understanding why B outperformed A in a specific test will allow you
to make sure you’re getting the most value out of each and every test. Knowing where you stand compared to others in the industry and working with best practices as a guideline will stand you in good stead.
Here are examples of some of the important things you would want a test to tell you:
What’s the impact of the icon on decisive users? Remember: decisive users are those who decide to install or leave without ever engaging with the page. The average time a decisive user spends on your page is between three and six seconds.
What’s the power of the icon in driving explorative behavior?
How does the icon fit the overall narrative you are trying to convey in the rest of the store? Does it increase conversion rates of explorative users or hurt them?
In order to answer these questions, you need to run a test on a platform that provides you with granular data specifically meant to answer them.
The ingredients of a great app icon test:
- Hypothesis: We’ve discussed this thoroughly above—choose a clear, strong hypothesis you can act upon. Changing an icon background from red to blue isn’t a strong hypothesis. So, let’s say your users like the blue icon better, now what? Test a yellow once? How about a teal one—who doesn’t like teal? What about the hundreds of other colors? How does this test help you to better understand your users?
- Design: Based on the hypothesis you came up with, create the design brief. Think about how these hypotheses are reflected in your creative assets and start designing different variations of your icon.
- Traffic Strategy: A test is as successful as the traffic you are directing to be part of this test. Knowing your audience and understanding exactly who to target (based on the hypotheses you came with) is crucial for a test’s success. StoreMaven can help here, as can the right insights to better define and segment your audience.
- Run a test: Setup ASO tests for the App Store and Google Play pages using a testing platform such as StoreMaven by creating replicated versions of these pages and sending live traffic by using banners on Facebook / Instagram / Adwords or other digital channels. Click here to learn more.
- Analyze results: When your traffic strategy is in place and the test has been run, it’s time to carefully analyze the results.
- Start over: It doesn’t end there. Now you are equipped to come up with new hypotheses based on the results and insights from your test and run more tests to help improve your CVR. We constantly strive to improve, don’t we?
Icons are only a part of your creative ASO strategy
Remember—your icon is not the only test-worthy app store asset. On average, elements such as your video or screenshots can yield higher returns—in some cases up to 40% higher CVR.
At the end of the day, an icon test is a great place to start, and the results can give you unique insights into your users and the best way to showcase your brand through your app store creative assets. But when you’re designing icons, it’s equally important to consider the other creative assets at your disposal, such as screenshots or videos, so you can create a long-term ASO strategy that incorporates all of these visual elements. This is what can truly set you apart and positively impact the return on investment of your mobile app marketing efforts.
App icons requirements and guidelines for the App Store and Google Play
You should know this by heart already, but let’s share it again: here is a quick reminder of app icon requirements:
This article gives you a good framework to start thinking about and designing your icons: which category to choose, what principles to follow, and the many blunders to avoid. We also discussed the importance of app icon testing as well as how crucial it is to pick the right hypotheses and the right ways to do it.
But there are many more aspects on your way to conversion rates supremacy: you’ll need to master the lot to enjoy a superior CVR.
So, if you’re now asking yourself about choosing the right title for your product page, check out Storemaven.com for more articles that will help you become an ASO wizard.