It appears you have not yet registered with our community. To register please click here...


Tutorial: How to Make a Web 2.0-Style Logo

This is a discussion on Tutorial: How to Make a Web 2.0-Style Logo within the Graphics Tutorials forums. Topic: This is the first of a series of Adobe Photoshop tutorials I’m going to offer on how to create ...


Reply
 
Postbit Seperator LinkBack Thread Tools Postbit Seperator Display Modes
Old 09-20-2007, 12:20 PM   #1 (permalink)
 
Status: Junior Member
Join Date: Sep 2007
Posts: 2
Trader Rating: (0)
PhotoshopTrend is on a distinguished road
TD$: 10.00
Donate
Exclamation Tutorial: How to Make a Web 2.0-Style Logo
This is the first of a series of Adobe Photoshop tutorials I’m going to offer on how to create a logo in “Web 2.0″ style.

What do I mean by Web 2.0-Style Logo? If you follow Web 2.0 closely, you’ll see similarities in the way logos are designed: Simple, glossed, gradient, bright-colored and often came with a slight reflection and a beta sign just like this:




PhotoshopTrend: Web 2.0 Photoshop tutorials
A categorized directory of hundreds of photoshop tutorials.
Web 2.0 Tutorials

Glossy web 2.0 button
Learn how to make a nice Web 2.0 style Glossy Button
using Layer Styles, also how to make a rollover

Cool Web 2.0 Badge
Make a good looking Web 2.0 style Badge, in a easy way
using the Polygon Tool and some Layer Styles



Photoshop Tutorial: How to Make a Web 2.0-Style Logo

This is the first of a series of Adobe Photoshop tutorials I’m going to offer on how to create a logo in “Web 2.0″ style.

What do I mean by Web 2.0-Style Logo? If you follow Web 2.0 closely, you’ll see similarities in the way logos are designed: Simple, glossed, gradient, bright-colored and often came with a slight reflection and a beta sign just like this:

Pretty ain’t it? Here’s a quick 6-minute video tutorial I prepared:

Some notes:
1. In Adobe Photoshop CS, I started with a new 800×600, 72 pixel/inch document with white background.

2. The font I used for the ALLEBA text is Trebuchet MS, 80 point and hexadecimal color 3399CC. You may use similar fonts such as Arial, Tahoma or Helvetica. I used the same color to replace black for the gradient effect. I set the opacity of the reflection to 50% and that of the white gloss to 30%.

3. For the starburst (where BETA is written), you need to open Character Map (Windows only) via Start > Programs > Accessories > System Tools > Character Map. Switch to the Wingdings font where you can find the starburst that I used for this tutorial. Copy the starburst then return to Photoshop. Pick the text tool, click on the workspace and paste. You will initially see the “®” character. Highlight “®” then choose the Wingdings font from the toolbar. Set the size to 60 pt and hex color FFCC00. The two colors I used for the gradient are FFCC00 and FFFF66 at a 135 degree angle. I set the drop shadow to 30% opacity.

4. I created this tutorial for those who are already familiar with the common tools and functions of Adobe Photoshop CS. This is my first attempt in creating a video tutorial that took me 2 hours to come up with a decent version! If you have any questions, I’d be glad to answer them here.
Happy logo making!

Video and other tutorials:

http://www.photoshoptrend.com/
PhotoshopTrend is offline   Reply With Quote
Old 09-21-2007, 03:25 AM   #2 (permalink)
Jay
 
Jay's Avatar
 
Status: Administrator
Join Date: Feb 2007
Location: Norwalk
Posts: 179
Trader Rating: (0)
Jay is on a distinguished road
TD$: 2147484987.00
Donate
Default Re: Tutorial: How to Make a Web 2.0-Style Logo
Great tut photoshoptrend and nice site!

thanks for sharing
Jay is offline   Reply With Quote
Table Bottom LeftTable BottomTable Bottom Right
Reply


Thread Tools
Display Modes



Similar Threads
Thread Thread Starter Forum Replies Last Post
Full Interface Template Tutorial Math Graphics Tutorials 9 12-19-2008 11:03 AM
Stationery Products Website Logo Design    Emily0415 Design Offers & Requests 0 07-23-2008 10:47 AM
Simple logo - photoshop Math Graphics Tutorials 3 12-26-2006 04:38 PM
Art Behind logos Math Expert Articles 0 09-03-2006 09:58 PM
Becoming A Web Designer / By Mat Dwyer Michael Expert Articles 2 08-30-2006 11:26 PM


Home | Site Map | Contact | Archive | Top

 

Copyright © 2007 - 2010 iTalkWebs Network

Search Engine Optimization by vBSEO 3.1.0