cjmcguinness Posted June 16, 2007 Author Share Posted June 16, 2007 Something like this..? Quote Link to comment Share on other sites More sharing options...
Jud@s Posted June 16, 2007 Share Posted June 16, 2007 Yepp... looks better imo 8) Nice job! When I get time to try one, I think I'll try a little rounded transparentcy gradient on the reflection in the middle as well. That might work to get rid of the clean cut reflection look. Quote 100% PDN Link to comment Share on other sites More sharing options...
adhanberry Posted June 16, 2007 Share Posted June 16, 2007 cjmcguinness, I think that your square button would look better with two drop shadows. What I mean by that is adding a lighter drop shadow on the top left. I've taken your picture and re-done it with a second drop shadow to show you what I was talking about. I did not blur the drop shadows because, in my opinion, it made it look like a more realistic shadow. Let me know what you think of this picture/idea. (One of the pictures is on a white background so the drop shadow would be more noticeable. Both pictures are the same, just one doesn't have a background.) Quote Hi. This is my signature. Link to comment Share on other sites More sharing options...
dawn Posted June 19, 2007 Share Posted June 19, 2007 cjmcguinness, that's very close to what I was looking for, thanks! The main thing I wanted was a "glossy" effect that wouldn't overly distort the layers beneath. That way I could hopefully put any kind of picture as a background layer and still get that glossy/3D look on top. I wasn't even sure in my head what that would look like, but your pics have given me some idea, thank you. Quote Link to comment Share on other sites More sharing options...
Tillerman Posted June 30, 2007 Share Posted June 30, 2007 Heres my try: Quote My Internet Explorer 8 Concept.... My Deviant Art My Forum Link to comment Share on other sites More sharing options...
Ben_R_R Posted July 1, 2007 Share Posted July 1, 2007 :shock: Wow that is awesome!! Quote I'm finally on dA! Link to comment Share on other sites More sharing options...
LizzyRock Posted July 1, 2007 Share Posted July 1, 2007 This is a really easy to follow tut. Wish I'd started to use Paint.net ages ago. Quote Link to comment Share on other sites More sharing options...
Tillerman Posted July 1, 2007 Share Posted July 1, 2007 cjmcguinness, that's very close to what I was looking for, thanks!The main thing I wanted was a "glossy" effect that wouldn't overly distort the layers beneath. That way I could hopefully put any kind of picture as a background layer and still get that glossy/3D look on top. I wasn't even sure in my head what that would look like, but your pics have given me some idea, thank you. Dawn, what is the font called that you used for your Avatar? And were did you get it? Quote My Internet Explorer 8 Concept.... My Deviant Art My Forum Link to comment Share on other sites More sharing options...
Paint_boy Posted July 2, 2007 Share Posted July 2, 2007 Adding "like the Wii ones" in the title of this topic will boost your views They are only similar, and the "Wii ones" are way simpler. These really do look more like some of the firefox theme's buttons... The do look like FX theme buttons. I made a FX theme and it is pretty popular too. great tut Quote Link to comment Share on other sites More sharing options...
Paint_boy Posted July 2, 2007 Share Posted July 2, 2007 Could some one make me a smaller version just a blank one with nothing on it? About 25 x 25 px please. Quote Link to comment Share on other sites More sharing options...
cjmcguinness Posted July 3, 2007 Author Share Posted July 3, 2007 Paint_boy, here are some I had previously created... Green - size 40 Green - size 20 Blue - size 40 Blue size 20 Quote Link to comment Share on other sites More sharing options...
Paint_boy Posted July 3, 2007 Share Posted July 3, 2007 Paint_boy, here are some I had previously created...Green - size 40 Green - size 20 Blue - size 40 Blue size 20 Thank you so much! Is it OK if I use these to attempt another Firefox theme? Quote Link to comment Share on other sites More sharing options...
cjmcguinness Posted July 3, 2007 Author Share Posted July 3, 2007 Is it OK if I use these to attempt another Firefox theme? Absolutely, you're free to do with them what you will. Please post the final result, I'd be interested to see it. All the best. CJ Quote Link to comment Share on other sites More sharing options...
NotArtsy Posted July 5, 2007 Share Posted July 5, 2007 I am not sure what is happening, maybe something left out everyone knows but me? 1. Start with an 800 x 600 (default) canvas. done 2. Use the Elipse Select tool and (holding the SHIFT key) drag a circle that has a Bounding Rectangle size of 400 x 400 pixels. done, took awhile, but done. 3. IMAGE > Crop to Selection Image>Crop to Selection is grayed out. My History is at New Image Elipse Which is step 1 and step 2 Seems there is something else after step 2 that isn't mentioned. Or another way to start a New file other than choosing New from the File menu? Quote Link to comment Share on other sites More sharing options...
cjmcguinness Posted July 5, 2007 Author Share Posted July 5, 2007 @NotArtsy Crop to selection is usually greyed out if you have nothing selected on your canvas. Make sure you are using the Ellipse Select tool and NOT the Ellipse tool . The Ellipse Select Tool highlights a section of the canvas, you will see a rotating dashed outline when an area is selected. If your Ellipse has a thick black border then you are most likely using the wrong tool (I know it can be confusing as they are both called Ellipse - but one is a Selection tool for highlighting an area of the canvas and the other is for drawing an Ellipse shape ) Once you have dragged your 400x400 ellipse selection try pressing [CTRL]+[sHIFT]+[X] keys together (this is the keyboard shortcut for crop to selection). Quote Link to comment Share on other sites More sharing options...
NotArtsy Posted July 5, 2007 Share Posted July 5, 2007 Thank you so much, that was it. I'm using what you have here to try and get a graphic built for a logo. The logo is a circle so this got the square canvas to go away. I want to use your glassing effect as a background to the circular text. Then cut out the middle of the circle to plop in a graphic. Layers but not sure how to attach it all. But a nice project to learn the program. Thank you very much for responding. Part one of my task is done Quote Link to comment Share on other sites More sharing options...
Jettyy Posted July 6, 2007 Share Posted July 6, 2007 this is such an easy to use and effective tutorial.. well done!! this is my creation.. for sum reason a part of it is missing when i put it on photobucket.. ahh well lol *edit* when it came up in the forum window it was all there.. dont worry about that Quote Link to comment Share on other sites More sharing options...
Farley Posted July 9, 2007 Share Posted July 9, 2007 Nice tutorial man. It's very easy to use! Quote Link to comment Share on other sites More sharing options...
cjmcguinness Posted July 9, 2007 Author Share Posted July 9, 2007 @ Jettyy & Farley ^^ Try saving your finished buttons as filetype .PNG, rather than .JPG and the background will stay transparent (rather than being white, as JPG doesn't support transparency) Otherwise, nice job both of you; I am glad that so many of you that are new to PDN are finding this tutorial easy to follow and producing great results. CJ Quote Link to comment Share on other sites More sharing options...
pwnzilla Posted July 10, 2007 Share Posted July 10, 2007 i dont get the delete part? Quote Link to comment Share on other sites More sharing options...
pwnzilla Posted July 10, 2007 Share Posted July 10, 2007 I made mine a little different. Quote Link to comment Share on other sites More sharing options...
max gamer Posted July 16, 2007 Share Posted July 16, 2007 ya i tried to get the canvas to 125 and when i did the outside of the circle wasn't transparent Quote Link to comment Share on other sites More sharing options...
cjmcguinness Posted July 16, 2007 Author Share Posted July 16, 2007 ya i tried to get the canvas to 125 and when i did the outside of the circle wasn't transparent See the second screenshot in the tutorial: You need to make your secondary colour transparent. When you resize any canvas PDN uses the secondary colour to fill the new empty space. So making your secondary colour transparent will result in the new enlarged space being transparent. Quote Link to comment Share on other sites More sharing options...
max gamer Posted July 16, 2007 Share Posted July 16, 2007 ok i will try that Quote Link to comment Share on other sites More sharing options...
FlipMC Posted July 17, 2007 Share Posted July 17, 2007 I really like this tutorial, it helps me whenever I think of which kind of button should I use when I code my website! Keep it up. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.