IconBuffet | Blog Forum | Step by step guide to create a Web 2.0 logo

Step by step guide to create a Web 2.0 logo

I wrote a step-by-step tutorial in my work's blog for creating a web 2.0 logo with the well known gel effect and reflection! I'd love to read your opinion about it and if you find it easy and discriptive!

Posted by Psy2k on May 11, 2007 in Show Off | 27 comments

kmfnj on May 11, 2007

That is a really nice blog dude! Admittedly, I skimmed the tutorial, so I don't have any feedback, but I definitely liked what I saw. :)

bcarneiro on May 11, 2007

Excellent! Thank you for the resource.

justG on May 11, 2007

There's also the Web 2.0 Logo Creator. =)

Psy2k on May 11, 2007

@JustG: Yeah it is the easy way but the output is very average...
@kmfnj, @bncarneiro: Thanx pals ;)

KatieK on May 11, 2007

Here's another method for Web 2.0 effects, with .PSDs.

marinagr on May 13, 2007

Nice tutorial! Very detailed! Great output :)

tamashii on May 13, 2007

Needs more shiny table.

dsgn on May 15, 2007

go gradients! :P

ProDevStudio on May 22, 2007

I shell try the effect on my company logo. and the avatar.

NatetheGreat on May 22, 2007

Nice tutorial/blog!

Since I don't have photoshop, I use a web2.0ish font, than bevel it with InkScape, export it, use Gimp to make it look shiney, and use a bit of javascript to add a shiney-survice reflection.

jauhari on May 22, 2007

Just say WOW ;)

maldenjen on May 24, 2007

Terrific! Might be a little hard if you're not already okay with Photoshop. For me (non-expert) it was great! Here's my output--a little header I made for my daughter, Kaya:
http://www.dartmouthdesign.com/web2kaya4.jpg

I'd love to hear yet me know your suggestions. ~Jen

justG on May 27, 2007

Came across another one today, thought I'd share it: My cool button. I haven't tried it, but I hope that possible output is better than what they've got at the top left there, 'cos that's not very cool. =]

Psy2k on May 28, 2007

@justG The button with the gel effect looks nice, but the reflection on the logo on the right is not so cool as you mentioned...

Psy2k on May 28, 2007

@maldenjen: The font is really nice, but I think you should choose another colour for the stroke (for example orange) and fade out the reflection end because it stops suddenly! Your daughter should be really happy with such a logo ;)

conny2007 on May 29, 2007

@maldenjen: like the font of this logo, too. How nice for a little girl! Wonder if mine (12 years old and introduced to the basics of Photoshop) could already manage this on her own. But about the stroke I think the same. If you want to look it glimmer (or glittering?) you have to use a lighter colour. If you want it kind of plastic I'd choose a darker colour (maybe with a gradient)... and always fade it out. Just experiment with it ;o)

khursten on May 29, 2007

Hey sweet. <3><3

conny2007 on May 29, 2007

@Psy2k: Once I stumbled over your blog I immediately tried it out and experimented a bit ;o) The result is a logo including a word written in golden letters (excelerate straight with a gradient) with a wavy image (downward). I used the stroke to give it some more depth. Looks as if it'd stand on any glassy surface. It has a shadow, too (faded gradient, lowered opacity). I missed the final "spot-like" eclipse because it didn't look realistic, anyway. Instead I simulated any lightsource behind/above the letters with a gradient (from almost white to a colour matching the gold effect, lowered opacity too) on the glassy surface. I'm no designer, too. So with this tutorial I managed to be faster than usual ;o) It was really helpfull. I'm sorry, I can't show it to you right now. I haven't managed to finish my new site yet. But my avatar is part of it.

Psy2k on May 29, 2007

@conny I would like to see your logo soon :)

Psy2k on Jun 03, 2007

Here is a second one using mainly shapes :)

marinagr on Jun 04, 2007

The second one is great too :) Love it!