|
Welcome
Guest
| Register
| Login
|
|
|
| Index | Recent Threads | Unanswered Threads | Who's Online | User List | Help |
Killersites.com Forum
Graphic Design
Photoshop
Thread: How to make a left/right fading shadow border with Photoshop for wrapper div?
|
| No member browsing this thread |
|
Thread Status: Active Total posts in this thread: 18
|
|
| Author |
|
ewwatson
Advanced Member United States Joined: Dec 19, 2007 Post Count: 1285 Status: Offline |
How to make a left/right fading shadow border with Photoshop for wrapper div? I've googled for awhile an no luck. I can only find drop shadow tuts. The CSS is easy - but as usual it's the Photoshop that's tricky for me. Thanks for any tips! I want to learn how to make two different type of images. 1) 760px width image with left/right shadowed border for fixed width wrapper. 2) left shadow for fluid width wrapper, and a right shadow for fluid width wrapper ---------------------------------------- Eric :~) Knowledge is Power ---------------------------------------- [Edit 2 times, last edit by ewwatson at Dec 7, 2008 10:13:51 AM] |
||
|
|
falkencreative
Advanced Member USA Joined: Aug 14, 2007 Post Count: 1129 Status: Offline |
Hey Eric. I actually put together a quick screencast for you explaining how to do it... but it looks like I'll have to post it tomorrow, since I am waiting on purchasing a program before I can export what I did, and it looks like I'll receive the serial number I need tomorrow, unfortunately. Anyway, if you can hang on, I'll post a link to the screencast tomorrow. ---------------------------------------- Benjamin Falk | student : designer : developer Twitter: falkencreative |
||
|
|
ewwatson
Advanced Member United States Joined: Dec 19, 2007 Post Count: 1285 Status: Offline |
Hey Eric. I actually put together a quick screencast for you explaining how to do it... but it looks like I'll have to post it tomorrow, since I am waiting on purchasing a program before I can export what I did, and it looks like I'll receive the serial number I need tomorrow, unfortunately. Anyway, if you can hang on, I'll post a link to the screencast tomorrow. Cool!! I can wait. Look forward to it - thanks Ben! Ya, instead of lifting some image off someone else's site, I thought I'd try and learn how to give myself a fishing "pole" instead. ---------------------------------------- Eric :~) Knowledge is Power |
||
|
|
shelfimage
Advanced Member USA Joined: Mar 24, 2005 Post Count: 3000 Status: Offline |
Hey Eric. I actually put together a quick screencast for you explaining how to do it... but it looks like I'll have to post it tomorrow, since I am waiting on purchasing a program before I can export what I did, and it looks like I'll receive the serial number I need tomorrow, unfortunately. Anyway, if you can hang on, I'll post a link to the screencast tomorrow. Have you tried Wink? Free tool. ---------------------------------------- "The art of life lies in a constant readjustment to our surroundings." -Okakura Kakuzo Save the developers<!> Maine Webworks |
||
|
|
falkencreative
Advanced Member USA Joined: Aug 14, 2007 Post Count: 1129 Status: Offline |
Have you tried Wink? Free tool. I'm using a mac app called ScreenFlow (http://www.flip4mac.com/screenflow.htm). Excellent application, extremely easy to use and seems to generate professional results. Unfortunately, the trial version exports the videos with huge "trial version" watermark that doesn't allow the viewer to see part of the screen. Just waiting on receiving the serial number to remove that, and I can post the video. Hopefully I'll get that later today... ---------------------------------------- Benjamin Falk | student : designer : developer Twitter: falkencreative |
||
|
|
falkencreative
Advanced Member USA Joined: Aug 14, 2007 Post Count: 1129 Status: Offline |
OK, here's the link I promised: http://falkencreative.com/screencasts/shadowborder.html Please note: Since I was in a hurry, the video only works in Firefox, apparently IE doesn't like it. If anyone can glance at the code and let me know what's up, I'd appreciate it. Otherwise, I'll take a look later today. I will warn you, this is the first screencast I have ever done, and it was a lot more time consuming and difficult than I expected. Little things like pronunciation and enunciation of words... I don't usually pay attention to it when I'm speaking, but it's quite different when you are recording yourself! It's a lot more like public speaking than I expected it to be, something that I could work on a bit.  That said, I think I've picked up some tips for any further screencasts I do, so hopefully any screencasts I produce in the future will be better. I don't know a huge amount of working with video for the web, and I think I have some room for improvement on overall quality. I'm using my laptops microphone, which apparently doesn't capture my voice all that well (or I just have a higher voice than I remember  ). A real mic is in the mail... Any future videos will probably use a larger screen resolution, so the videos are easier to see, and I may end up exporting the video on both high and low settings, and letting the user pick which one they want to view. I'll probably take a look at the screencasts on CSS-tricks, and see what Chris Coyier has done to present his screencasts.Anyway, if you have any comments, let me know. Hopefully it'll get you started. ---------------------------------------- Benjamin Falk | student : designer : developer Twitter: falkencreative ---------------------------------------- [Edit 3 times, last edit by falkencreative at Dec 8, 2008 7:17:03 PM] |
||
|
|
ewwatson
Advanced Member United States Joined: Dec 19, 2007 Post Count: 1285 Status: Offline |
Logging in AGAIN....... Awesome Ben!! Very good Job! Like you said, maybe make it a little bigger. But other than that, it was perfect, and very well explained. I'm gong to go make a shadow now - cool! Hopefully, you keep those coming. When you have a home for them let me know so I can link to them on my tools page. I see what you mean by it was like public speaking. Even harder probably - you had to think at the same time. You did a lot better than I would have. ---------------------------------------- Eric :~) Knowledge is Power |
||
|
|
falkencreative
Advanced Member USA Joined: Aug 14, 2007 Post Count: 1129 Status: Offline |
Logging in AGAIN....... Awesome Ben!! Very good Job! Like you said, maybe make it a little bigger. But other than that, it was perfect, and very well explained. I'm gong to go make a shadow now - cool! Hopefully, you keep those coming. When you have a home for them let me know so I can link to them on my tools page. I see what you mean by it was like public speaking. Even harder probably - you had to think at the same time. You did a lot better than I would have. I'll be keeping my eye out for Photoshop or basic coding questions that I can do screencasts on. My new site should have a Resources section with the screencasts... or perhaps a complete "Screencasts" section if I end up doing quite a few of these. Yeah, the thinking and speaking at the same time is tough. Eventually, I may move to reading a script first, then shooting the video (without sound), and combining the two. ---------------------------------------- Benjamin Falk | student : designer : developer Twitter: falkencreative |
||
|
|
mest22
Newbie Joined: Nov 12, 2008 Post Count: 39 Status: Offline |
over all its a great screen cast, you were very clear and easy to follow. you cant ask much more than that, pretty sure anyone that doesn't know anything about photoshop could of watched this and followed you to product the end result you had the screen cast on. very good job!  |
||
|
|
ewwatson
Advanced Member United States Joined: Dec 19, 2007 Post Count: 1285 Status: Offline |
......Logging in AGAIN. Hi Ben, In your tut you do it assuming that you have a solid color background. I would like to do it with a transparent .png. But for some reason I can't get it to be transparent. Is there some trick to it? I thought I'd just create a new transparent file, and add the gradient as you showed, and save it as a png. But it shows white through the gradient. What ingredient am I missing? Thanks! ---------------------------------------- Eric :~) Knowledge is Power |
||
|
|
|
|
Current timezone is GMT Nov 20, 2009 8:45:01 PM |
