As a developer, you are given a small opportunity to advertise your application by way of an icon. An icon is often the first impression your application makes: it shows up in the application store, it might be the image for your social media accounts, it could be discovered during organic searches including those for images. If your icon is the handshake you give the user every time you meet them, we all know there is not a single person out there that is an avid fan of the dead fish. As the first introduction to your application, the notion of quality can be shaped through great icon design. A poorly designed icon could suggest that the quality of the application is also poor.
What makes for a good icon?
Icons can do a great job of instantly communicating the intent of your application, or what your application does. In the context of the app store, the application icon will initially be listed amongst several other application icons, all rivals for the user’s attention. It should be simple, symbolic and effective; overcomplicated icon design can reduce its effectiveness to convey meaning.
Well-designed icons should take into account the overall design theme of the application ecosystem. For example, an icon designed for the Windows Store might seem out of place in other application stores and vice versa. The modern UI of Windows 8 focuses on content and typography – something many have categorized as flat design due to its lack of gradients, shadows, and general ornamentation. Icons that do not fit in with the overall OS aesthetic can be disconcerting.
Color also plays a big factor. For example, red can make a user feel unsettled, as it’s a color reserved for failure or urgency in applications. Alerts, warnings, and errors: all these tend to have red in them along with the inevitable exclamation point screaming at you to pay attention. Sometimes starting in black and white, and making sure your icon communicates an interest or is visually interesting, is a great way to start before you worry about color.
I’m no icon expert, so I asked two icon designers some questions about icon design.
Max SteenBurger and Robbie Kaner are two professional designers who weighed in about icon design. When asked what makes for a good application icon, one said “It’s about grabbing the user’s attention. If it fails to do that you should probably go back to the drawing board”. When you start creating an icon, a recommendation was made to not worry about color at first, that “If that shape (the core of your icon) works on black and white, it’ll likely work in colour as well”. Sharing your work will make your icon better. Another designer recommended “Use your friends and family as a focus group and don’t get offended when they can’t see what you see. Take their constructive criticism and go back to the drawing board”.
You can read the advice from the pros here.
Creating an Icon: Where do I start?
Design Crowd Sourcing
If you have no desire to tackle this part on your own, and don’t really have access to a designer, you can easily get an icon created for you by a professional through various design crowd sourcing sites. Now, let me be clear – I am not a huge advocate of design crowdsourcing for a variety of reasons, but I am also a person who has had access to design talent, and for some people, it might be a viable option. Design crowd sourcing business models might differ, but typically you write a brief for the project and a price. When writing a brief be sure to include what you are looking for, avoid jargon, include references, abuse adjectives, and list your dislikes as well. Be specific: don’t ask for a car when you have a fully loaded Porsche 911 Turbo in slate grey in mind. You can read a good article on how to get the most from crowdsourced design here.
Popular Design Crowd Sourcing Sites
99 Designs
CrowdSpring
Freelancer
Tips for Icon Design
If you want to flex your own design skills, you can pick your favorite graphics program and go to town. A few tips for icon design to help get you started:
- Start large. It is easier to start with the bigger size and then resize down for the varying resolutions.
- Be careful using text in your icons / logo – it may become very hard to read at smaller sizes.
- Resize down and tweak. This will afford you the opportunity to polish the smaller sizes as scaling down proportionally may reduce the design fidelity on certain details.
- Reduce the image size. There are many tools and approaches to do that:
If you need a quick start and don’t want to start from scratch, considering using an icon font. These will provide a solid foundation for an icon, giving you the option to modify or tweak as you see fit. A list of icon fonts have been compiled that might do the job, or perhaps provide you with some ideas and inspiration.