Webby freebies » Icons http://www.webbyfreebies.com Just another WordPress weblog Mon, 07 Mar 2011 20:40:46 +0000 en hourly 1 http://wordpress.org/?v=3.2.1 How to Create a Nice Contact Website in Photoshop http://www.webbyfreebies.com/themes/how-to-create-a-nice-contact-website-in-photoshop/ http://www.webbyfreebies.com/themes/how-to-create-a-nice-contact-website-in-photoshop/#comments Wed, 02 Mar 2011 16:48:24 +0000 admin http://www.webbyfreebies.com/?p=1457 This is actually my first tutorial on Webby freebies. Since the blog really have to link to web design freebies, I will tell about different icon sets and texture which you can download and use for free. Below is a picture of how the results will look like.

Preview

1. Start with the background

Allright… Open a new document and size it to 1200×1200 or something like that. We are going to start to create a nice background. For that I use a flat color, in this case #121212, don’t use color overlay because we are going to add noise. Go to Filter > Noise > Add Noise and do like I did on the picture here:

Step 1

2. Add lights

We want some lights on the background to make it look a little bit more dynamic. Pick the brush tool, size it up to 620px and the hardness to 0%. Create a new layer and click one time in the middle of the document. Then set the layer opacity to 25%. Add the same amount of noise to this too. It should now look like the image below.

Step 2

3. Create the box

Use the Rounded Rectangle Tool with a radius of 3px and fix the size to 320×420 px. Now create a new layer and put a rectangle in the middle of the light that we did on the second step. Open Blending Options for the new layer and do like I did on the picture below.

Step 3

Step 3

4. Add the information

Now it is time to type the text about yourself. For the titles I use Arial, 14px, bold and for the normal text i use Arial, 12px, normal text-weight. I think you can figure out how to do it yourself. Take a look at the image and do like that. I also added the animated picture of myself in the right corner.

Step 4

5. Place the social network icons

For this you have to download an icon set. I use Simple circular social media icons pack for this one but you can ofcourse use another if you want. Start to open up the facebook icon, copy it and paste it on your document. Make sure that you put this new layer below the box-layer. Open Blending Options and change the settings so that it looks like this:

Step 5

Now you got a nice shadow on your little icon. Place the icon on the right side behind the box. It should look like this:

Step 5

Do this step over and over until you have all the icons that you want on your contact page.

6. You need a logo

In this case it is your name. You can actually do this step however you want but I will show you how I did. For my name I use the font Fertigo Pro with a font-size of 56px. This layer is also important to be placed below the box layer. Again, open Blending Options for this layer and change the settings as below.

Step 6

Result

This is how it should look right now and thats all! I hope that you have enjoyed my first tutorial on Webby freebies. Take a look at these icons that can be used instead of those I used in the tutorial.

Result

Three nice free icon sets

Social Media Bubbles: Icon Pack

Social Media Bubbles: Icon Pack

Preview and Download

Free Social Media Icon Set

Free Social Media Icon Set

Preview and Download

Social media icons

Social media icons

Preview and Download

]]> http://www.webbyfreebies.com/themes/how-to-create-a-nice-contact-website-in-photoshop/feed/ 0 Icons in modern web design: Examples and Resources http://www.webbyfreebies.com/icons-and-badges/icons-in-modern-web-design-examples-and-resources/ http://www.webbyfreebies.com/icons-and-badges/icons-in-modern-web-design-examples-and-resources/#comments Mon, 28 Feb 2011 17:40:24 +0000 admin http://www.webbyfreebies.com/?p=1403 Those of you who read Webby freebies regularly knows that I have made posts like Paper textures in modern web design, and Jeans textures in modern web design. In this post I show examples of some really cool websites that uses icons. Not only that, I also show you some fresh and nice free icon sets which you can download use when you make your next website.

Examples of websites

pixel pleasure

divplayers

ngenworks

ghosttown

david jonsson

walk with you

daniel marques

foxtie

designjunction

finer home

Icon sets to Download

Human 02

Human 02

Download

Set of social icons

Set of social icons

Download

Icon Pack: 256×256 Business Icons

icon_pack

Download

Star Trek Props: TOS 2

Star trek

Download

Office Icons

office icons

Download

15 Fantastic Collections of Free Icons

fantastic icon sets

]]> http://www.webbyfreebies.com/icons-and-badges/icons-in-modern-web-design-examples-and-resources/feed/ 0 The Recipe for the Best Web Design in the World http://www.webbyfreebies.com/fonts/recipe-for-the-best-web-design/ http://www.webbyfreebies.com/fonts/recipe-for-the-best-web-design/#comments Thu, 24 Feb 2011 13:07:33 +0000 admin http://www.webbyfreebies.com/?p=1324 What’s he talking about? Yes, one can ask, but there is actually a recipe for how to make a really nice web design! All you need to cook this recipe, I have listed in this post. The post is simply about a few steps to make your new website from scratch in Photoshop.

1. A nice background texture

This is not necessary if you prefer plain backgrounds, but I think that it’s more fun with a bit pattern. Take a look at some examples that you can download and use for free. If you would like to see more textures then you can browse the Graphics category.

Brick & Stone: Texture Pack

stone

Download

10 Free High-Quality Jeans Textures

jeans

Download

9 Free Hi-Res Wood Panels Textures

wood

Download

2. Brushes

If you want to get some life into your website, it might be an idea to use different brushes to spice it up.

115 really cool splatter brushes for Photoshop

brushes

35+ Must Have And Fresh Free Nature Themed Photoshop Brushes

flower brushes

3. Icons

A few nice small icons can never be wrong right? You can find more icons in the Icons category.

Woven Fabric Social Media Icon Set

woven icon set

Download

Panda social network icons for free

Download

Archigraphs Collection Icons

Download

4. Fonts

Stylish Typography is very important for websites today. Here are some examples below.

GOTA

gota

Download

Fertigo

fertigo

Download

League Gothic

league gothic

Download

5. A little bit of love and fantasy

Now I can not help you anymore. Grab a cup of coffee, an LSD pill and drift away in your imagination. Just watch out for those pink elephants.

]]> http://www.webbyfreebies.com/fonts/recipe-for-the-best-web-design/feed/ 0 Fresh Icon Sets You Probably Haven’t Seen Before http://www.webbyfreebies.com/icons-and-badges/fresh-icon-sets-you-probably-havent-seen/ http://www.webbyfreebies.com/icons-and-badges/fresh-icon-sets-you-probably-havent-seen/#comments Sat, 20 Feb 2010 22:29:34 +0000 admin http://www.webbyfreebies.com/?p=1106 As you know, new icon sets are published every day on various web design blogs. I have monitored many of these blogs a long time and I thought, therefore, show some of the best-looking icon sets I’ve seen recently. I hope you will like them.

Application Icon Set

Free Mobile Berries Icon Set

Mobile Icon Set

Birdies

Woven Fabric Social Media Icon Set

Vintage Stamp Social Media Icon Pack

Political Characters Volume 2 – Free Icon Set

Vector Social Media Icons

Free Saint Valentine’s Day Icon Set

Media Icons from IconShock

]]> http://www.webbyfreebies.com/icons-and-badges/fresh-icon-sets-you-probably-havent-seen/feed/ 0 15 Fantastic Collections of Free Icons http://www.webbyfreebies.com/icons-and-badges/15-fantastic-collections-of-free-icons/ http://www.webbyfreebies.com/icons-and-badges/15-fantastic-collections-of-free-icons/#comments Thu, 04 Feb 2010 14:11:56 +0000 admin http://www.webbyfreebies.com/?p=1041 Well, this will be my third post of these posts I have did recently that lists collections of famous web design blogs, and it seems that you appreciate them since the two other posts are some of the most popular posts on Webby freebies. So I guess you don’t mind if I continue with doing this post about these 15 really gorgeous collections of free icons that you can check out.

200+ Big and Beautiful Highly Detailed Icons

200+ Big and Beautiful Highly Detailed Icons

60 Best Icon Sets From 2009

60 Best Icon Sets From 2009

40+ Extremely Beautiful Icon Sets Hand-picked from deviantART

40+ Extremely Beautiful Icon Sets Hand-picked from deviantART

50 Beautiful Free Icon Sets For Your Next Design

50 Beautiful Free Icon Sets For Your Next Design

50 Free High-Quality Icon Sets

50 Free High-Quality Icon Sets

The Top 50 Web Development Icon Sets from 2009

The Top 50 Web Development Icon Sets from 2009

The Best Free Icon Sets of 2009

The Best Free Icon Sets of 2009

50 Free High Quality Professional Icon sets for Download

50 Free High Quality Professional Icon sets for Download

35 of the Best Icon Sets for Web Designers

35 of the Best Icon Sets for Web Designers

44 Excellent Free Icon Sets Everyone Must Have

44 Excellent Free Icon Sets Everyone Must Have

Freebies: Social Media Icons for Your Blog

Freebies: Social Media Icons for Your Blog

Ultimate collection of social networking icons

Ultimate collection of social networking icons

]]> http://www.webbyfreebies.com/icons-and-badges/15-fantastic-collections-of-free-icons/feed/ 0 StumbleUpon and its incredible power http://www.webbyfreebies.com/graphics/stumbleupon-and-its-incredible-power/ http://www.webbyfreebies.com/graphics/stumbleupon-and-its-incredible-power/#comments Thu, 28 Jan 2010 16:58:54 +0000 admin http://www.webbyfreebies.com/?p=845 There are a lot of different social networks out there, and some of them have a huge impact on blogs and their traffic. Some of these are Delicious, Twitter, Digg and StumbleUpon. But this article will only be about StumbleUpon and its great power. These listed items describes what will be discussed in the article.

  • How StumbleUpon works
  • How to get huge traffic
  • Graphics and icons
  • Further reading

Let us begin to describe how StumbleUpon works and why you should use this social network if you blog. But do not forget to subscribe to me and I will subscribe to you too.

How StumbleUpon works

StumbleUpon is like many other similar social networking, a place to meet other like-minded people, people with same interests as you. What is special about StumbleUpon, and why I named the title as I did, is that this social networking lets you meet people who have the exact interest as you, and it’s pretty easy to get people to visit your blog / website.

StumbleUpon allows each member to choose one or more categories that he / she is interested in. In my case, I only chose Graphic Design. That way I can use my “Stumble!”-Button to see blogs, blog articles, images, movies and so on which I am interested in.

Once you become a member of StumbleUpon, you can download a toolbar, which you use when you surf the Internet. It looks like this:

stumbleupon toolbar

If I press the “Stumble!” button I will be redirected to a website that someone else has thumbed up and which is in my category, Graphic Design. In this way, I will come to a web site that someone else surely want me to visit. This gives the publisher more traffic to their website / blog, and I get something interesting to read.

The more people that thumbs up your item, the more Stumblers will see your article. If you press the “I like it!” button, you will save the page you thumbed up on your StumbleUpon profile. If you press the “I like it!” button on your own article and have no friends in your network, no one will probably stumble your article, because no one will notice that you have made a discovery.

My profile

When I started Webby freebies I made a new profile on StumbleUpon, just to have friends who have exactly the same interests as me. So I show you, therefore, how a relatively new profile looks like. Please subscribe to me and I’ll subscribe to you too, and we can share our favorites to each other. In this way, both you and I will grow our social networks on StumbleUpon.

stumbleupon profile

How to get huge traffic

As promised I will now give you my top 10 list on how to do to get extremely high traffic to your blog. Here I list my own experiences from my blog that I run alongside, and other bloggers tips.

  1. Start by using StumbleUpon’s service to search through your IM buddies to see if any of them are using StumbleUpon. That way you get easy a lot friends who are probably happy to help you thumb up your articles.
  2. Try to find people who like your articles, or perhaps have discovered them. Try then to find profiles that have the same interests as you. Subscribe to them and send a private message to them which tells them that you like their favorites and that you would like to be friends with them. By the way, you are now “friend” with a person on StumbleUpon that you subscribe to and which also subscribes to you.
  3. Make sure that the articles you publish has an interesting title. As “The Secret of How to get huge traffic.”
  4. Also, make sure you have a button on your blog that remind people that press the “I like it!” button.
  5. Thumb up your friends’ items so they do not believe you just use them. Finally, they will only thumb down your articles.
  6. Reduce the time it takes to load your blog. Otherwise, users will simply press the “Stumble!” button again.
  7. Tag your articles right. Make sure that your articles do not fall under the category of books, if it belongs in Graphic Design.
  8. Be an active stumbler. Make sure that no man ever miss you. Stumble as much as possible and as soon as you have time.
  9. Use the share function, and the most active stumblers will see that you want your articles stumbled.
  10. Use services such as StumbleXchange to get your articles thumbed up.

Graphics and icons

It is important that you also optimize your blog using nice buttons or other graphics so that people can more easily share your articles. And since this is a blog for freebies, this part is one of the most important parts of this article.

I do not know if you have seen it but I did an article a while ago that is totally focused on icons for social networking. That post includes those really cool icon sets and many other:

Socialize Icons

You can download this icon set over here.

Icons Cloud

You can download this icon set over here.

Set of social icons

You can download this icon set over here.

Set of social icons

Ultimate collection of social networking icons

These three icon sets are just a few of the many listed in this article I did a while ago. Check out the article so that you have a lot of icon sets to choose from.

Ultimate collection of social networking icons

When I wrote this “utlimate” article, I was quite happy with it, but now so here a little later I noticed that I’ve missed a lot of social network icon sets. So I thought, why not add some new icon sets from 2010 and a lot I missed before.

Social media icons

You can download this icon set over here.

Blue Jelly Social Media Icons

You can download this icon set over here.

Blue Jelly Social Media Icons

Function App free social media icons

You can download this icon set over here.

Function App free social media icons

Glossy Waxed Wood Social Networking Icons

You can download this icon set over here.

Glossy Waxed Wood Social Networking Icons

webtoolkit4.me’s first icon set

You can download this icon set over here.

Icon set

Further reading

Here are some helpful articles that I think you should read to know absolutely everything about how StumbleUpon works. This way you also learn to start with your networking and then get a lot of traffic to your blog.

StumbleUpon FAQ, Guides, Tools, Addons And Scripts

I read 1stwebdesigner daily and for a while ago I met this incredibly useful article written by Dainix. I myself have had very great use of this and recommend you to read it.

StumbleUpon FAQ, Guides, Tools, Addons And Scripts

A Comprehensive Guide to StumbleUpon: How to Build Massive Traffic to Your Website

This is a similar article written by DoshDosh, but is still very worth reading. There are a lot of tips and tricks not mentioned in the article by 1stwebdesigner.

A Comprehensive Guide to StumbleUpon

Why StumbleUpon Sends More Traffic Than Digg

This article is perhaps a bit too old but still contains a lot of useful tips and hints. The article will also, as you can read in the title, a comparison between StumbleUpon and Digg.

Why StumbleUpon Sends More Traffic Than Digg

]]> http://www.webbyfreebies.com/graphics/stumbleupon-and-its-incredible-power/feed/ 0 Absolute best freebies of 2009 http://www.webbyfreebies.com/fonts/absolute-best-freebies-of-2009/ http://www.webbyfreebies.com/fonts/absolute-best-freebies-of-2009/#comments Sat, 02 Jan 2010 14:31:47 +0000 admin http://www.webbyfreebies.com/?p=510 I’ve just blogged here on Webby freebies in about a month, but already know that I’m in the game. During this time, I have learned a lot about where to find the best freebies available and also talked to some really talented web designers. That is why I now can do this post with freebies that I think are worthy to be appointed to this year’s freebies 2009th. I have chosen to pick 3 freebies for this categories: Fonts, Icons and Themes. See and enjoy!

WordPress themes

Irresistible

This wonderful wordpress theme is made by Woothemes is one of my favorite themes this past year. Clean and simple, exactly how a website should look in my opinion.

Demo | Download

Magazeen

Magazeen wordpress theme, created by WeFunction and exclusively released on Smashing Magazine is a theme, built for bloggers who want to run their own magazine, like Webby freebies. If you don’t to buy a premium magazine theme, then this is a really good choice.

Demo | Download

Imprezz

Imprezz is also a beautiful theme exclusively released on Smashing Magazine but made by ProductiveDreams. It can be used as a magazine or a personal blog.

Preview | Download

Fonts

SketchBlock Font

SketchBlock is a font that makes your web design look beautiful and personal, because of its handwritten appearance. Feel the colours at DeviantArt is the creator and has done a lot of more nice stuff, check out his gallery.

Download

Calluna

This is one of my favorites actually. It has been created during 1 and a half year of hard work and is a fully complete OpenType typeface.

Download

Mentone

Mentone is a sans-serif font that can be used for almost everything because of its regular look.

Download

Icons

New & Free Social Media Icon Set For Your Blog

The sweet icon set made by IconShock, exclusively for Noupe, is a free social media icon set that you can download for free and use on your blog.

Preview and Download

Lovely website icons pack 2

I would like to say wow! This icon package is one of the coolest I have ever seen on the net. Cheers LazyCrazy!

Preview and Download

Exclusive Free LBOI Icon Set For Designers By Iconshock

This icon set is also made by IconShock. It contains these 6 really stunning icons and is made exclusively for Little Box Of Ideas.

Download

]]> http://www.webbyfreebies.com/fonts/absolute-best-freebies-of-2009/feed/ 0 Panda social network icons for free http://www.webbyfreebies.com/icons-and-badges/panda-social-network-icons-for-free/ http://www.webbyfreebies.com/icons-and-badges/panda-social-network-icons-for-free/#comments Fri, 25 Dec 2009 18:44:35 +0000 admin http://www.webbyfreebies.com/?p=464 As I said in an earlier post, I was planning to create an icon set for social networking. And now I am finished. A simply call it Panda social network icons and that is exactly what it is. Check it out and feel free to download it from Six Revisions where I exclusively published it. Use them as the license on Six Revisions says.

Download

Preview

]]> http://www.webbyfreebies.com/icons-and-badges/panda-social-network-icons-for-free/feed/ 0 15 awesome free Christmas icon sets http://www.webbyfreebies.com/icons-and-badges/15-awesome-free-christmas-icon-sets/ http://www.webbyfreebies.com/icons-and-badges/15-awesome-free-christmas-icon-sets/#comments Mon, 21 Dec 2009 19:33:32 +0000 admin http://www.webbyfreebies.com/?p=405 Maybe you have seen my post about these really nice free Christmas WordPress themes and thought that totally changing theme is a big step and not that amusing all the time. Then you can scroll down and check out my list of these good looking Christmas icons that I have collected from a lot of great web design blogs, and of course DeviantArt.

Christmas holiday icons

Christmas dock icons

Xmas Pack

The real Christmas reloaded

Santa’s set

Christmas dock icons

Christmas XP

Winter holiday icons

Christmas mini pack

The day before Christmas

The polar express

Archigraphs xmas dock icons

Christmas feed icons

Smashing Christmas icons set

Dellixmas Christmas icon set

]]> http://www.webbyfreebies.com/icons-and-badges/15-awesome-free-christmas-icon-sets/feed/ 0 A bunch of sweet animal icon sets http://www.webbyfreebies.com/icons-and-badges/a-bunch-of-sweet-animal-icon-sets/ http://www.webbyfreebies.com/icons-and-badges/a-bunch-of-sweet-animal-icon-sets/#comments Thu, 17 Dec 2009 23:28:30 +0000 admin http://www.webbyfreebies.com/?p=377 There are many icon sets out there and I have already shown you some sweet twitter icons and badges, and also these social network icons. But this time I am going to show you my collection of cute animal icon sets. I will in a short while also present my own-made Panda social network icon set, that is surely as good looking as these. Wait and see. Enjoy these until further notice!

Feed Me Animals

rss_animal

Aries Icons

aries-icons

Cute critters free icon pack

cute_critters

Pool

pool

Ninja Bear Icons

ninja_bear_pw

Dino Icons

Dino_Icons

Mammoth Icons

mammoth_icons

Turbomilk’s Animals

animals

Zoom-eyed creatures

zoom_eyes

]]> http://www.webbyfreebies.com/icons-and-badges/a-bunch-of-sweet-animal-icon-sets/feed/ 0