Designing and developing your app is a full-time business. You know this already. Right from the conception of the idea, through to the drawing board, the pitches for funding, the sourcing of the development team, the testing, the re-testing, the re-re-testing – basically the whole software development lifecycle (SDLC) – you’re going to be hard at it, realising and perfecting your idea, making amendments, listening to feedback and taking decisions on a daily basis.
It’s certainly a hard task. So much so that you could almost be forgiven for completely forgetting about your app icon.
An App Is Only Ever As Popular As Its Icon
When choosing a restaurant at which to eat for the first time, what do you look for?
If it’s a nice romantic place that you’re after – dark, candlelit, oysters on the menu, Verdelho on the wine list – when you’re browsing your choices on your Restaurant Discovery app, you’re not going to take your beloved to the place that has a grinning jalapeno chilli in a sombrero hat as its logo, are you?
No, of course you’re not.
And that fine dining shellfish establishment will of course do well not to have such a thing as its logo either. It doesn’t matter how exquisite the food is inside the door – if you can’t entice the right customer to step through it, then the ‘closing down’ sign will soon be swinging from the coat hook.
And the same principle applies to your app.
You will no doubt have created the very best app that has ever been brought into existence – but if you don’t get the app icon right, then no one’s going to want it hogging up the pixels on the home screens of their smartphones.
Your Most Vital Marketing Asset
In some ways, the app icon is the most important piece of marketing material that you will have at your disposal.
As well as an app enthusiast, I’m also an avid reader – and so I want to honest with you. With so much choice these days – so much choice – on both the digital and library bookshelves, that I’m afraid that I do indeed judge a book by its cover. Even before I’ve read the blurb.
And I want to be honest once again…
I judge an app by its icon. Even before I’ve read the description and flicked through the screenshots.
And I’m pretty sure that I’m not the only one with this habit.
So Much Choice
Statista’s most recent figures show that, as of May 2015 “Android users were able to choose between 1.5 million apps [and] Apple’s App Store remained the second-largest app store with 1.4 million available apps.”
Put all of the stores together and there is a whopping 3,730,000 available apps. Now, of course, some apps will be available on more than one platform – but, if you’re planning on peddling your app on either iOS or Android, then you have at least 1.4 million and 1.5 million competitors respectively.
All of these apps have an icon.
Users judge an app by its icon – I’m an app user and I do, and I suspect that you do too.
The app icon has to stand out to get noticed. The marketplace is jam-packed. But, as consumers, we just can’t get enough apps.
Here’s another graph visual from Statista, this time showing the cumulative number of apps downloaded from the Apple App Store from July 2008 to June 2015 (in billions):
“As of the last reported period, Apple announced that 100 billion apps had been downloaded from its App Store.”
I hope that I’ve managed to illustrate that if you want a piece of this, then your app has got to have a store-winning icon – because app stores are extremely crowded marketplaces.
Designing A Store-Winning App Icon
You want to be thinking about the design of your icon right from the moment that you decide to hit the green light and start putting your app into development.
It will require a lot of thought and collaboration with the rest of your team. You need to get your app icon right for launch. There is no room for error. If you get it wrong, then, just like a fine-dining restaurant, it won’t matter how tasty your offering is inside, because a huge percentage of your potential customers won’t even bother stepping foot through the door.
Put simply, you need an app icon that simply screams to all of those app store window shoppers – “Install me!! NOW!!”
Below, I want to give you a few tips and point you in the direction of a few tools that will help you put together the store-winning icon that your app deserves.
AppIconTemplate.com is a great place to start when designing your icon. It’s essentially an open-source Photoshop resource that makes the job of designing app icons a whole lot simpler.
“App icon template started as a free photoshop resource aimed to make the life of icon designers easier. Since then new templates, tutorial videos and blog posts have been added with the overarching goal of empowering designers, developers and everyone in between to more easily and with greater confidence create awesome products.”
If you’re not a designer, then getting to grips with Photoshop is not the easiest thing that you will have ever had to do. But, with AppIconTemplate, the process is made a whole lot simpler. The templates available are intuitive, and on-trend with the latest in app icon design.
“Edit a single object and it’ll automatically render out all the various sizes required on iOS & Android. Built-in textures and colors make it easy to get started and the bundled actions make exporting a breeze.”
It really is as good and as simple to use as it sounds, and the site is packed full of helpful video tutorials and advice from designers all over the globe, so you should never find yourself stuck.
So, this is the online tool that I’d recommend you start getting to grips with when it comes to doing the actual work on your design.
But now let’s start to think about the actual design itself, and start to answer the most important question of all…
What Makes A Store-Winning App Design?
Ok, first thing’s first with this one…
Choosing The Right Colour(s)
Colour psychology. It’s certainly a hot topic in marketing. We remember brands by their colour, or perhaps, rather, we associate colours with certain brands.
And this is the crux of the matter. The colours you choose for your app icon need to ‘marry’ with what your app is all about. “Color,” Neil Patel is quoted as writing on KissMetrics, is “85% of the reason you purchased a specific product.”
Here’s a great infographic on colour psychology and brands:
There is of course some controversy surrounding the whole colour psychology argument – after all, depending on personal experience, the colour red is just as likely to signify danger, as it is to signify love, excitement or sex.
And so, without going too far into this rather sticky, albeit fascinating, issue, I think the most important thing to bear in mind is appropriateness. That is to say – does the colour of the brand (i.e. the app icon) fit well with the product being sold (i.e. the app itself)?
If your app is about the gloriousness of red wine, then perhaps a fluorescent yellow or green app icon might give the wrong impression. Similarly, if your app is to help after-hour partiers find the nearest rave when all the clubs have kicked out, then a deep, rich mauve will probably be the wrong approach as well.
KISSmetircs produce a very interesting infographic with some very telling insights on colour use for websites and apps. And below I’ve taken a few screen shots of the most helpful statistics.
Remember, your app icon is going to be used for various marketing efforts in various sizes and will be appearing on various screens and on various menus. Some devices will be equipped with Retina screens, and some will not.
When designing your app icon, you must always bear in mind that it will be occurring in lots of different places, and you need to think about if a user will be able to recognise your icon from only a small glimpse.
Here’s what AppIconTemplate.com has to say:
“A very big part of the conceptual stages of app icon design should be dedicated to thinking about if any given design scales gracefully.
- Working on a 1024 x 1024px canvas can be deceptive – make sure you try out your design on the device and in multiple contexts and sizes
- Embrace simplicity and focus on a single object, preferably a unique shape or element that retains its contours and qualities when scaled
- Make sure the app icon looks good against a variety of backgrounds”
Keep It Simple, And Don’t Include Words
With scalability in mind, think how hard it will be to read any text as your app scales down and down and down. Graphics is not text. Your icon is a graphical representation of the name of your app and everything that will eventually be associated with it.
Let’s face facts – there isn’t enough room on your app icon to include the app’s title, and, if you try and squeeze it on, then it may well end up looking like these:
In the end, you want your app icon to be clear and simple and memorable. It should somehow connote what your app does, and be cool, stylish and striking all at once.
You may need to get back to the drawing board and work out what the absolute primary function of your app is. What is your app really all about? If you could only show people one thing that would represent your entire app, what would it be?
My favourite new app icon that has emerged is the one for periscope – at once looking like an eye, a peep hole, and a location pin on a map. Just 3 colours. No words. The designers absolutely nailed it in my opinion. Here it is – be inspired.
Good luck with your app icon designs – let us know how you get on.