Preserved Topic: first try at anything like this, umm.. help? (Page 1 of 1)

I've never tried to do anything with any remote depth before, I am working on a new interface thing for my site and wanted to go for less flatness with it. I only have this much done so far from last nite with tutorials on http://www.eyeball-design.com/page09.htm and phong. If you could just plz look at it and tell me how to improve/anything on it.

threep says:
"i have a few basic steps for you:
1) scroll down this window.
2) scroll back up here to read the next instruction!
3) when you scroll back down, click on the 'hands on tutorials' button. and DO THEM.
4) when you've done that, come back, scroll down, and click on the 'gurus network' button. and do the photoshop tuts there.
5) come back, and try again with your newfound knowledge.
good luck!"

The way you deal with faux 3D in a 2D environment is your use of shadows and highlights. It creates an illusion of depth. Think of how you want your interface to look in three dimensions and take note of where the shadows and highlights appear. Then blend them in.

In your image, you have a solid along the bottom but gray shadows for the two bars on top. Either make them all black or all gray. Also, the lower right corner shadow is too thick.

Hey ACharmedOne;

It's a darned credible first try. The inset "Mists of Time" panel works okay. The inset bars are okay, 'cept they break the black outside stroke.

The main problem is that the container graphic, the outside gray bit doesn't have any shading, so it looks od to have some elements suggesting 3-D and some not.

Determine from where the imagined light source is going to come. Unless you have a reason to deviate, top left is safe. That meants that the top and left edges of things that are raised will be lighter than their background, and the opposite for things that are depressed. And as you might expect, the bottom and right of things that are raised will be darker than the surrounding area, and the opposite for edges that are depressed. If that doesn't mean a whole lot now, wait unti the sun comes up tomorrow and look at stuff outside. Cars are good reference material for this: Look at the door handles of newish cars, the ones that have the handle flush with the body. It's damned increadible how much you can pick up from *looking* at stuff. Course then the trick is to figure out how to recreate it in Photoshop. But the more you look at stuff, the better able you are to perceive when things aren't right in an image. Then it's just sweat and practice. Simple, right?


Arrgh. silence types faster than me. I swear to gosh I'm gonna sit down with Mavis Beacon one of these decades.


[This message has been edited by Steve (edited 06-15-2001).]

Actually, Steve, I was just about to mention your name for some advice on the whole lighting thing.

I changed it some from some of the tutorials i found, I don't know if this is any better but:

I added what is hopefully going to be the base for the interface... http://charmed.numbaa1.co.uk/navigation.shtml
anyways I was wondering how to (if this is possible) where i have the inset circle with the symbol, how would I go about engraving/insetting that symbol on maybe a black half oval that is set in that circle instead of an inset. Anyways comments/criticism is appreciated (oh and I know the curve is jaggy I have never been able to get a curve not like that :/)
Thanks in advance

Might be a job for: http://www.handson.nu/HTML/insetbar.shtml

Jaggy curve? Not sure how you did it, but a Gauss/Levels combe usually works pretty good.

Problems. Back later.

edit: The way things are looking, I won't be back 'til Monday. Sorry for the hit-and-run partical advice. Later.



[This message has been edited by warjournal (edited 06-16-2001).]

Umm... the inset line thing didn't quite pan out, but I used a phong tutorial on reflective orbs and instead of using the image they said i input my own, anyways it came out like this:

comments/help on that.. I kinda like it but I'm sure it could be better
and I'm trying to put that in the interface where the circular inset with the same image currently is.. any ideas on that? Also do ya'll think that would make a better bullet than a major part of the interface or what?
Thanks

maybe I'm spendin to much time on this button lol but here's sumthin else I did to it that I think looks better, but I don't know...

Way better! Got that sense of directional light working for you.

Hi,

It seems that you're trying to create the 3d effect using gradienst (at least in the last image) Maybe you should get familiar with the filter "lightning effects". It's much more powerful creating any almost any kind of 3d effects (correct me if I'm wrong, that's just the experience I made)

I cut out that shape on the button (btw not very good ) and that's what I came up with the lightning effects filter from scratch.

Click me!

if you want to have the psd file, it's here, but I was too lazy to rename the layers and channels, it's a bit a mess around there

Cheers

(argh, I hope the links work, anyone knows a good free hoster which allows external links??)


__________________
If Bill Gates had a nickel for every time windows crashed... Oh wait, HE DOES!!

all righty, I tested the links, and they don't work. Copy them into the clipboard and reinsert the into a new browser windows, that should. Sorry for the inconvenice.

_________________________
Who is General Failure, and why is he reading my disk?