the blog of
Icon Design Made Simple
As mentioned in the beginning of our last post, we had to cut the old long article into small and separate subjects for easier discussion. So today, we are going to continue to get back and dig into other essential aspects that have hugely significant effect in our icon creation: Material, Coloration and Gradient. This topic has been revised and updated as well.
Material in Icon Design
Your icon would look more real if you could successfully deliver its weight and feel as well as its appearance. To achieve that, thereâ€™s nothing better than practice as much as possible.
Coloration in Icon Design
Use color with care to help the icon tell its story. Donâ€™t add color just to make the icon more colorful.
Use smooth gradient to give balance and harmony.
Use color in relation to the content and status that the icon shows. For example, the color of a paper icon must be white while the color of a floppy disk or binocular must be in black.
The color of an icon is sometimes dependent on the style of the other icons when they all belong to one set.
Consider using color and its intensity so that the icon must be displayed well in a variety of backgrounds.
What about the coloring tools?
The Color Fill seems to work for icons when working with Adobe Photoshop. Indeed, with this popular graphic edit software, you can easily create shapes by using the Color Fill along with brushes, and you got to have a Wacom tablet or Cintiq already to make this work at ease.
Gradient in Icon Design
As you already knew, the gradient modes in Adobe Illustrator are Linear and Radial. Each mode has its own strong and weak points. How to take them into use where it needs to be is a question of experiments. From our experience, itâ€™s sensible to use a gradient from white to a darkest color (nearly black).
How to properly use gradient and effectively apply it into icons?
The darkest area does not receive and reflect light.
The brightest area receives light most.
The medium-light area is transitional between the brightest and the darkest.
Form and Value diagram
In the diagram, light emits vertically to the surface and creates different color levels, helping us realize the form of the surface.
Use one gradient only to create the surface.
Or, use two gradients, one gradient to depict surface without reflected light and the other set in the Screen mode to depict reflected light.
How to Create a Simple Button Icon in Adobe Illustrator
Adobe Illustratorâ€™s Tools and Palettes Used Most for Icon Creation
How to Create a Simple Stroke Dashboard Icon in Adobe Illustrator
How to create a realistic globe icon
How to create a glossy Network icon
Lighting in Icon Design (revisited)
Material, Coloration and Gradient in Icon Design (revisited)
As a perfectionist, not only have we wanted our products to be as perfect as possible, we have also wanted to improve the quality of each and every article published on this blog. Any suggestions or contributions to this article are highly appreciated. We appreciate your time.
Like what you read?
Subscribe to our RSS
Back to IconEden.com
Log in to add comments
Related clip arts and images