Rockstar Icon Designer - Kate McInnes [16]
A good example is the game Fruit Ninja, it clearly shows what you can expect from the game: a sword slicing a piece of fruit, and does it in an art style that is highly stylized, has rich colors and just enough detail to make it visually appealing without complicating the smaller scale icon. Once familiar with the Fruit Ninja icon, users can be shown the same image without a text description and know exactly what it is. While the Fruit Ninja game has more than just watermelons to slice, the use of the watermelon for the icons is particularly good design choice. A watermelon has more than one color, it conjures up thoughts of juicy, squishy fruit, it's large enough to look good with the sword image and is recognized globally. When designing icons for mobile applications, spend some time using the app, talk with the developers to get a full understanding of the way it works and its target audience. Look at the major competition and think of ways you can make your icon stand out more than theirs, and don't be afraid to add a bit of personality to the icon. A seemingly small thing like the color choice or expression on a character can make all the difference when people are quickly browsing a marketplace.
Round Theme Icons by iKon.
Design Tips
Okay, we already know that mobile icons are complicated because of their dual purpose as branding and interface element. So let's delve further into some design tips and begin with a comparison.
Think of online marketplaces as supermarkets. Now think of the customer base. Some people know exactly what they're looking for, find it, purchase it and leave the store. A larger proportion of the customers will know the kind of product they want but not the brand. These customers will pick things up that are interesting and have a closer look. Finally there's the people who are in a hurry and rely on first impressions to make impulse buys. How would you design an icon to get their attention?
With launcher icons it's okay to market to a particular kind of customer, after all, not all applications are intended for all users. For example, if you're selling an app for the casual gaming market, you may consider using a character with lots of color and expression. If you were selling a time tracking application for busy business people, you may render a designer stop-watch that looks expensive and efficient. The subliminal associations with each icon style will speak volumes to the customer about the kind of user experience they're looking for. Remember, a launcher icon is the first thing people will see on a product listing before the star rating and screenshots – make that split second count and use your icon to say as much as you can, in a simple, eye catching and stylistic way.
The high resolution screens of modern mobile devices versus the small scale at which the icons are viewed at is an interesting juxtaposition between the detail that can be seen and the detail that can be added. This is where your good taste as a design will come into play. Icons for mobile devices are a relatively new addition to the world of icon design and conform to the same constraints of a small viewing area. Depending on the device you're designing for, it's likely that you will need to make icons in either .SVG (for some mobile phones and Linux-based netbooks) or .PNG (commonly used for touch screen devices such as iPod or iPad) format.
Contrary to popular belief, the corners and shine of iOS icons are not applied to the design, instead they are dynamically added by the operating system.
I-Kid icons by “kidaubis".
Web-based Interfaces and Sites
Web-based icons can be found in many contexts, including cloud applications, dashboards and social book-marking. While these icons still need to be clear and easy to understand, the design style is open.
In the case of social networking icons, a little bit of creativity can go a long way. The great thing about social icons is that the designs are widely recognized and can be rendered in many different styles without