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
Re: Creating iPhone App Style Logos - GIMP
Submitted by ingalls on Fri, 05/22/2009 - 16:55could you take a screen shot and upload it to image shack???
http://imageshack.us/
then just post a link
thanks
ingalls
----------
Re: Creating iPhone App Style Logos - GIMP
Submitted by georgedurack on Tue, 09/15/2009 - 06:08That was I was looking from a long time, How to have my own Style logos in my Iphone. I have followed guide and have used them to draw some awesome Logos.
I had a problem following the merge option initially as it wasn't coming in the arranged spectrum as it should but It got corrected by simply following the trial and error method.
Re: Creating iPhone App Style Logos - GIMP
Submitted by dioporco on Fri, 10/30/2009 - 06:28hi all,
i'm a newbie about gimp. I tried to follow your tutorial, but i can't merge layer, and this, i guess, because you forget
to say to anchor floating selection before press Ctrl+M.
...at least without that step i can't merge layer, and i found that work around to solve...i hope this could be useful.
@webmaster: registering captcha is quite difficult for humans too ;)
Re: Creating iPhone App Style Logos - GIMP
Submitted by PCbasics on Sun, 12/12/2010 - 21:12Thanks for this. Its very detailed
Re: Creating iPhone App Style Logos - GIMP
Submitted by Mafia_Penguin on Sun, 12/12/2010 - 22:25Hey, PCBasics!! What are you doing designing iPhone app style logos?!
:D
Re: Creating iPhone App Style Logos - GIMP
Submitted by PCbasics on Sat, 01/01/2011 - 13:57Why? because its just nice to know sometimes, maybe if i feel like making my own buttons for the iPhone.....I need to start learning how to do those outer glows too.... :D
Pages