Designing web icons
March 8, 2007 – 1:38 pm![]()
Here are some icons I designed for a friend’s website. He asked me to make them at three sizes: 20 pixels wide, 80 pixels wide and 300 pixels wide.
There’s a real skill to designing icons. You have to make them simple enough to be understandable at small sizes but interesting enough to be beautiful when bigger.
I used a well-known aqua or jelly technique for the background. Basically it is a gradient with a series of superimposed arcs to give an impression of translucent 3d shape. The arcs are intersections of two circles, squeeze or stretched slightly where appropriate. I blurred the arcs at the top but at the bottom they remain sharp to give an ultra-modern feel.




7 Responses to “Designing web icons”
Look great, Rob! Thanks again.
You get a nice mention in the show coming out tomorrow
By Marc Fiszman on Mar 8, 2007
Wow! Thanks for the mention in the show. Let me know if you want anything else doing!
By Rob Cubbon on Mar 8, 2007
Well… I am wondering if the Nearthwort logo needs to be jazzed up a bit. What do you think?
By Marc Fiszman on Mar 9, 2007
I could look at it over the weekend if you like. Maybe staying with the Helvetica Neue but with the aqua/jelly effect?
By Anonymous on Mar 9, 2007
Sorry, that was me. I forgot to log in!
By Rob Cubbon on Mar 9, 2007
Thanks, Rob — would be great if you’d try some stuff out
Jelly could be good.
By Marc Fiszman on Mar 9, 2007
Can’t really do jelly as it’s thin type on a white background. It’s a tricky one …
By Rob Cubbon on Mar 10, 2007