With the rise of the smartphone app, icons have become increasingly indispensable to the way we navigate the technology around us – an iPhone homescreen without app icons is almost unimaginable. While icons have played a role in GUI interaction since, well, the earliest GUIs were developed, we tend to think of icons as belonging… Read more »
Enhancing your Website with custom Website Illustrations The use illustrations can be a powerful artistic tool in web design and can make a website truly unique. Working with a good illustrator to create a design which reflects the product or service the website offers can result in a great outcome: a timeless, distinctive website which… Read more »
As psychology teaches us, humans are fundamentally social creatures. Even the most seemingly isolated individual act is a social one. Signing up to a website might seem to involve nobody other than the person sitting at their computer, but what they are actually entering into is a complex social relationship made up of many different… Read more »
Technology is forever being used in new and exciting ways. That’s why it’s important that you consider all sorts of different target audiences in your design work. This includes children. Programs and operating systems are increasingly being designed with kids in mind. For example, with the launch of the Windows 8 operating system for Windows… Read more »
There are some simple, basic methods of good icon design which can yield great results if they are followed. Sometimes some designers stray too far from the basics by trying to be too original. Originality is important, but it’s also important to remember the basics. Here we outline some easy, memorable keys to effective icon… Read more »
Lately there’s been a lot of talk of how the ‘flat icon’ has come to dominate interface design across all different platforms. The flat icon trend can be seen as a conscious effort by developers to return to basics when it comes to design. Of course, the ideal icon is one that explains its function… Read more »
Although a good proportion of the icon design projects we work on follow an established icon style, such as those found in mobile Apps like iOS and Android or desktop software icons like Microsoft Office and Windows 7, the greatest demand is generally for custom icons in a unique style. Despite the shift in popularity… Read more »
Icon design is ever evolving. As new platforms embrace the use of icons, new terms and references are dreamt up and older terms fall out of favour. This glossary is an ongoing project to document the icon design lexicon. Contributions are very welcome. 16×16 Pixel Icons This icon size has its own entry here because… Read more »
Here is another great comic style illustration from David, one of my favourite Icon Designers at Creative Freedom. This time we have a Super-Villain with a decidedly bad temper which I am sure fans of the 2000 A.D. Comic will have no trouble recalling. Comic Style Icon DesignJudge Dredd Icons & IllustrationAs a kid I… Read more »
In this lesson I’ll tell how to draw an object that is very often used in icons. This object can easily either spoil or improve image, the thing is in details. I’ll use 256x256px icon size in the lesson, but all the rules below are valid for any size. Perhaps only for icons in size 16×16 and 24×24, there are some features that we’ll ignore today. So, let’s start!
1. In a new file create a circle with the Ellipse Tool: 2. Form a sphere from the circle using light and shade: create new layers with the Clipping Mask Mode (Layer->Create Clipping Mask), take Radial Gradient Tool and make color circles (from color to transparency) every time using lighter color as at the pictures:
highlight area (in Overlay Blend Mode)
3. To add a reflection from the surface where globe is located, do the following:
create a new layer with the Clipping Mask as above
make selection from the base circle shape
apply Edit ->Stroke operation with such parameters to the new layer:
deselect shape (Select->Deselect)
apply Filter->Blur->Gaussian Blur with such parameters:
use Erase Tool to remove reflex where needed
4. The result is a quite nice ball; it’s time to turn it into the globe. The moment of adding the continents is most important in the process of the earth drawing. You can choose a simple way, and do like most of lessons in the Internet are suggest:
Take a flat map of the continents
Put it on the sphere
Apply Spherize Filter
The result is acceptable but not ideal. I suggest a more complicated way, but it helps to:
get actual location of the continents on the ball
select the desired angle of planet rotation
Need Windows application icons?
We can tell your story and transform your software in one great new desktop icon
5. So we have the continents, regardless of how have we got them. Now we need to give a volume as we made for the sphere. Use the same techniques and shapes, as in the first item. Prior to obtaining a similar result:
6. To make the continents more accentuated:
create two copies of the continents layer and clip them with the Clipping Mask to the base circle shape
make the first copy darker than the continents color and move it right and down to 1-2 pixels relative to the parent layer
make the second copy lighter than the continents color and move it left and up to 1-2 pixels relative to the parent layer
use Image->Adjustments->Hue/Saturation for darkening and lightening, or another convenient method
7. It remains only to fit our globe in an environment, in this case, the white background.
For the convenience merge all layers (except the background)
Use Curves (Image->Adjustments->Curves) to make our object more bright and saturated. Repeat curve bending like here:
Now repeat the steps we carried out in paragraph 3 for the reflex, but with such parameters Stroke Width 2 px, Color #ffffff and Blur Radius 1 px.
And once again with Stroke Width 3 px, Color #ffffff and Blur Radius 3 px.
In this stage I’ve decided to increase highlight in new layer with Radial Gradient tool from white to transparent.
8. Add shadow, as if our globe lies on a white flat surface