Designing the icon for your application is a crucial part of finding success on any marketplace. Popular platforms such as the iPhone App Store are crowded and fiercely competitive. This makes the design more important than ever for both your icon and user interface.
Your app icon will be the first thing potential users see which is why I would like to share some tips on creating an attention-grabbing app icon that will also serve as an extension of your brand.
Here are 7 tips on creating a timeless and powerful app icon:
1. Reflect on your product
Start by reflecting on your product and consider the message you would like to communicate. Both the color and graphics used in your icon will play a role in how your app is received so make sure they align with your message. Consider both the value your app provides as well as the audience you are targeting.
While trying to determine how your brand should be communicated, ask yourself this question: “How would you explain your application to a five-year-old?” This will help you establish your apps purpose in layman’s terms which is a great starting point for developing your app’s icon. This approach is often used to determine a company’s ‘elevator pitch’ which should always align with your branding.
2. Set the tone
Now that you know how to communicate your app you need to set the tone by establishing your colour palette. Colours are a huge consideration in branding and marketing collateral so it comes as no surprise that the colours you use in your app icon will dictate how your message is received. Colour has perhaps the largest influence on social psychology and acts as one of the main triggers in user behaviour. If your brand colors have not yet been established I recommend using the following cheat sheet during the process.
RED: Red is the color of fire and blood. It is associated with energy, war, danger, strength, power, determination as well as passion, desire, and love.
ORANGE: Orange combines the energy of red and the happiness of yellow. It is associated with joy, sunshine, and tropics.
YELLOW: Yellow is the color of sunshine. It’s associated with joy, happiness, intellect, and energy.
GREEN: Green is the color of nature. It symbolizes growth, harmony, freshness, and fertility.
BLUE: Blue is the color of the sky and sea. It is often associated with depth and stability. It symbolizes trust, loyalty, wisdom, confidence, intelligence, faith, truth, and heaven.
PURPLE: Purple combines the stability of blue and the energy of red. Purple is associated with royalty. It symbolizes power, nobility, luxury, and ambition.
WHITE: White is associated with light, goodness, innocence, and purity. It symbolizes safety, purity, and cleanliness. In heraldry, white depicts faith and purity.
BLACK: Black is associated with power, elegance, formality, death, evil, and mystery.
3. Communicate visually
An app icon is meant to be a visual representation of your application. Creating a graphic that represents your application and fits within a tiny square is not an easy task but it can be done. See below for a perfect example of how simple lines can convey services in an abstract way. Listatic is a popular app that allows for collaborative list making and their design communicates that concept very effectively.
Try representing your core functionality in an abstract way on paper before producing your icon. Taking the extra time to sketch will help you refine your idea and make the design process more efficient.
4. Keep it simple
While potential users are searching for apps they will spend much of their time skimming over an assortment of listings. Since App stores display icons in a small square, simplicity is crucial to creating a recognizable icon that stands out from the rest. Cluttered designs will be difficult to decipher and make for a less appealing app. Try to limit the number of objects within the design and test your icon on smaller scales before launching.
Puzzlejuice does a fantastic job of incorporating the company name into the icon while creatively displaying their apps purpose.
The ESPN icon is another great example of how a logo can be incorporated in a simple and visually appealing way.
5. Avoid trends
Much like fashion, graphic design is prone to trends. With ever changing design software, mobile apps are particularly disposed to generic fads. Try to avoid following the herd. You want your app to be around for the long haul so aim for being unique versus trendy. A great icon should be timeless and recognizable even after the latest fad passes by.
Over the years we have seen many apps use variations of trendy effects while the majority of successful apps opted for high contrast colours and creative shapes to stand out from competitors.
6. Be format conscious
The way app icons are displayed on Android will vary from iOS so be sure to consider the differences. Your final app icon should utilize a layout that works for both operating systems. Apple will round the corners of the icon which means you need to ensure that crucial elements have enough padding to maintain visibility on iOS.
7. Test the icon on your phone.
Once your icon is complete and your files are ready be sure to do a round of testing before the big launch. Check to see how the icon looks on both Android and iOS and get some guidance from third parties. A second, third or fourth set of eyes can do wonders for refining your design.