








Nate commenting on tech, posting interesting websites, and pinning helpful tutorials.
How to make Web 2.0 Style Logos with Only Freeware Tools
What You Will Need:
A few Web 2.0 style fonts
Step One – The Fonts
There are many websites offering free fonts. Below are just a few:
If those sites just aren’t cutting it, a simple Google search will reveal many, many more.
Step Two – Choosing Your Font
After you've downloaded an undefined number of good web 2.0 fonts, you need a good way to figure out just which one you're going to use. Don't use Word or the Windows font folder for this! You'll be there all day. Download the small, simple utility "The Font Thing" (link above) for easy, painless font browsing.
Step Three – The Color
Once you've chosen your font(s), go fire up Inkscape, zoom into 100%, choose the "text" tool, type out your name, press the color settings button, and add a nice gradient, with dark on the bottom and a lighter shade on the top. Don't be afraid. Experiment with the color and lightness, with the text size and wording, with caps or no caps (or a combination), and with even the font.
Step Four – Export as PNG
First, select all your text by dragging a box around it. Than, go to the "File" menu, and press "Export Bitmap…." Choose your destination folder, make sure it's set to export "selection," and press "export." Only press it once, lol.
Step Five – The Nice Shiny Look
Now that you have your beveled text png'd, browse over to it and open it using the Gimp. Use the Circle Selection tool to get a nice rounded selection about one third to half way from the bottom of your logo. Once you have achieved a desired selection, press the "adjust hue and saturation" button, click on your text inside the selection, and click to the left of the lightness slider three times so that the lightness slider "jumps" to the left three times. The box with the up/down arrows beside the slider should say "-30." Press "Ok." For those of you who do not have this button set to appear in the main Gimp window, you can access it via "tools > color tools > hue saturation" in the "tools" menu of your editing window.
Step Six – The Nice Shiny Table Look
What we've got so far is ok, but we want to make it look really snazzy. Head on over and download the "reflection.js" javascript and install it on your website as detailed in it's readme file. After inserting your picture into your website, give it the class="reflect" attribute, and, tada!, you've got a pretty nice web 2.0 logo if I do say so myself, all without paying a cent. To download my finished product, please click here.
Labels: eBay, Google, Socialbookmarking, StumbleUpon, Web2.0