12 Great Web 2.0 Button Tutorials

We all know that web 2.0 is engulfing us like a big sludge and in little steps all of us web designers are making minor or major changes on our site/blog/presentation etc, with little things such as icons or fonts. You want these graphics to be eye-catching and small enough so it doesn’t dominate your layout. These hand-picked tutorials will teach you how to create a graphic that does just that.

1. Perfect Shine Button or Icon

Make your interface stand out from the rest with this tutorial. A detailed tutorial that guides you to create an awesome button or icon for your application’s GUI.

btn1

Boonage

2. Design a Media Button

This media button tutorial is produced by 'Adobe Tutorialz', a graphic community that also provide tips about video and audio techniques.

btn1

AdobeTutorialz

3. Creating Media Icons

This tutorial teaches you how to create a shiny orb button that can be used for things like logos and interface designs.

btn1

TutorialWiz

4. Create a Simple Reflective Icon

Another simple and straightforward tutorial that guides you how to create a reflective button. One not to be missed!

btn1

EyesonTutorials

5. Reflective Button with Plastic Style

Web 2.0 unique button with a plastic finishing. Great for your GUI design.

btn1

PhotoshopCrown

6. Design a Glossy Download Icon or Button

Psdtuts showcases some of the best Photoshop tutorials around. To improve or brush up your Photoshop skills, do visit them for more tutorials. Check out and learn how the masters does it!

btn1

PsdTuts

7. Classic Glassy Button in only 7 Steps

Create your most classic web 2.0 glassy button in only 7 steps!

btn1

SecondPicture

8. Fancy Sticker Tutorial

A sticker can easily generate focus on specific content for websites and graphic design projects. This tutorial will show you several basic and advanced Photoshop techniques. These are extremely applicable for a variety of designs you might create in the future.

btn1

FloatingCityDesigns

9. Handy Web 2.0 Icons or Buttons

With the Web 2.0 trend, the use of badges and subtle 3D has become very popular. This tutorial will show you how to create a really easy and very nice 3D effect to be used in either buttons and icons or elements that need some depth.

btn1

PsdTuts

10. Create a Cool Carbon Fiber Menu

Eli Burford, author of PhotoshopPoint,  provides well-written and high-quality Photoshop tutorials. This tutorial is clear and concise and is very suitable for a mobile GUI.

btn101

PhotoshopPoint

11. Create A Glossy 3D Button

To give more visual appeal to your site's interface, try integrating 3 dimensional graphics.

btn1

Magnusfx

12. Industrial-Style Buttons in a few steps

Another tutorial by PhotoshopPoint, you can create this button in just 6 steps. Very easy!

btn12

PhotoshopPoint

About this Author

Charlotte

Charlotte’s interest is in web interface and design as well as motion graphics. Her absorption with her work is mostly due to her attention to detail and passion for the world of design. Winding down after work, which consumes much of her time; she enjoys travelling, exploring new places, gastronomy, and fashion.

Share This Article

  • Stumble Upon
  • Delicious
  • Reddit
  • Facebook

5 Comments on “12 Great Web 2.0 Button Tutorials”

  1. magnusfx is park.

  2. It is a good selection for conventional buttons

Leave a Reply