Creating iPhone App Style Logos - GIMP
ingalls —Fri, 03/20/2009 - 15:01
I’ve noticed that there isn’t a tutorial for iphone logos for ‘gimp’ so I decided to make my own. I used http://userlogos.org/node/5487 as a base to create one for gimp. Well let’s begin…
Step #1
Open up gimp and make a new image with a size of 125 pixels by 125 pixels.
Step #2
I always find it easier to make the logo if I am zoomed in. This is optional but I suggest you zoom in to 400%.
Step #3
Next right click on the image and click add alpha channel. This will allow you to make your iphone logo transparent.
Step #4
Next hit the delete key on your keyboard. Your image should now look like this…
Step #5
Click on the ‘rectangle select tool’
Step #6
Use the rectangle selection too to make a rectangle around your entire image. It should look something like this.
Step #7
Click ONCE in the center of the image
Step #8
Now go to Select>shrink and click on shrink.
Step #9
A box should appear that asks you how many pixels you want to shrink it by. Put 15 in the box and hit enter.
Step #10
If everything went well you should now have this:
If you don’t have this go back to step #6
Step #11
Now we are going to make the rounded corners. Click select, and then click on rounded rectangle.
Step #12
When you click on rounded rectangle a small box that ‘script-fu rounded rectangle’ should appear. Set the radius to 20% and then click ‘ok’
Step #13
You should now have a rectangle with rounded corners in the center of your page.
Step #14
Double click on one of the two colors. This will bring up a color selection screen.
Pick or make the color that you want and then click ok.
Double click on eh second color. Make this so it is slightly lighter than the last color.
Once you have both colors click ‘ok’ and move to step #15
For this demonstration I used the colors ‘0027d4’ and ‘0283d4’
Step #15
Click on the gradient tool.
Step #16
Click above the Image and draw a line from the top of the Image to the bottom. Tip: You have to keep holding the mouse button in order for this to work.
It should look like what I did below.
Step #17
Now release the mouse button and your image should be filled with the two colors you chose.
Step #18
Now let’s give the image a shadow.
Go to Filters>lights and shadows and then click on drop down shadow.
Step #19
A box should appear.
Set the offset X to 0, the offset Y to 4, and the blur radius to 5.
Now change the opacity to 40%, and click ok.
Step #20
Once this is done you should have a light shadow. It will get darker later on.
Step #21
Press ‘CTRL’ and ‘L’ on your keyboard.
A small window will appear.
Right now you should have two layers. A drop shadow and the background.
Step #22
Right click on the background later and duplicate it.
Step #23
You should now have three layers.
Step #24
On your keyboard type
‘CTRL’ + ‘A’
Then ‘CTRL’ + ‘X’
Then ‘CTRL’+’V’
After this has been done it should look like this:
Step #25
Click on the ellipse tool.
Step #26
Try to center the ellipse with the center of the image.
Once you have drawn an ellipse click into the center of it.
Step #27
Click on the paint bucket.
Then change the color that is on top to white.
And change the threshold to 255.
Step #28
Now paint the inside of the ellipse white.
Step #29
Now go to the layers box and change the opacity to 20.
Step #30
On your keyboard type ‘CTRL’ + ‘M’
Then click merge.
This will make it so there will be only one layer.
Step #31
Change the view back to 100% and you should have an iphone button just waiting for a logo.
- Printer-friendly version
- Log in or register to post comments or vote.
- +3
- 3 votes
Search logos
Search site
Navigation
User login
Online users
Active - 15 mins:
Recent comments
-
by: hammadamir907 min 10 sec ago
-
by: wakawaka59 min 23 sec ago
-
by: wakawaka1 hour 1 min ago
-
by: wakawaka1 hour 33 min ago
-
by: wakawaka2 hours 13 min ago
-
by: wakawaka2 hours 19 min ago
-
by: wakawaka2 hours 48 min ago
-
by: sijiv317592 hours 55 min ago
Re: Creating iPhone App Style Logos - GIMP
Submitted by zigzag on Sat, 03/28/2009 - 11:08Wow great tutorial, keep up the good work!
Re: Creating iPhone App Style Logos - GIMP
Submitted by DeoTutorials on Sat, 03/28/2009 - 23:35everything worked until the whole merging part then you lost me.
The last step the merge menu doesnt appear.Also what format to save icon?
Re: Creating iPhone App Style Logos - GIMP
Submitted by Mafia_Penguin on Sat, 03/28/2009 - 23:51@DeoTutorials:
You can also click Layer>Merge Down.
Save the resulting image as a .Png.
@ingalls: Remember not everyone uses a PC*, some use Macs or Linux, and Macs use the Apple button (Cmd?).
*FTW
Trouble
using
transparent
Logos?
Click
here
for
help!
Re: Creating iPhone App Style Logos - GIMP
Submitted by DeoTutorials on Sun, 03/29/2009 - 00:05i use windows i h8 mac.
Can someone help me edit this image now make it be like a reflection
Re: Creating iPhone App Style Logos - GIMP
Submitted by Mafia_Penguin on Sun, 03/29/2009 - 00:43here:
http://userlogos.org/node/7119
Trouble
using
transparent
Logos?
Click
here
for
help!
Re: Creating iPhone App Style Logos - GIMP
Submitted by Caboose (not verified) on Sat, 05/16/2009 - 18:01I'm guessing you had the same problem as me. If you have a layer that is a floating layer (Pasted Layer) , right-click. and go to "New From Visible". Then Delete every other layer besides the "Visible Layer".
Re: Creating iPhone App Style Logos - GIMP
Submitted by ingalls on Sun, 05/17/2009 - 09:45I'll take a look at it when I get back to my home computer.
thanks
ingalls
----------
Re: Creating iPhone App Style Logos - GIMP
Submitted by Thomas Lorenz (not verified) on Wed, 05/20/2009 - 07:42Hello,
my problem is, that it looks like that;
the icon looks perfect, but around this icon
there is a underlaying retangle which color is
the same as the lightest color of both in the icon.
I guess, that the size of this retangle ist exactly the same, as the beginning size.
Where did i wrong?
Thomas
Re: Creating iPhone App Style Logos - GIMP
Submitted by ingalls on Wed, 05/20/2009 - 17:06When you made the drop shadow was the color set to black?
Could you post a photo?
that would make it easier for me to help you.
----------
Re: Creating iPhone App Style Logos - GIMP
Submitted by Thomas Lorenz on Fri, 05/22/2009 - 13:27Hallo,
yes, i would like to send an image, but i have von homepage, and i think that you have no email.
So, what shall we do?
The image look normal til a merge this image.
Gimp 2.4.5
MacOSX 10.5
Thomas
Pages