View Full Version : new Flash layout (mock up in PS6)

11 November 2002, 06:40 PM
Hello everyone.
I made this flash layout as a new (completely different) version of my old static gallery/portfolio etc. site.
I welcome any questions or comments on the photoshop work, or if you have some experience w/ flash or designing site layouts then fill me in there too if you would like.

the little hands in the picture are to show the effects of a rollover.

(1) The left-most hand shows that when the mouse rolls over one of the 'arrow' navbar buttons it turns the icon from an arrow into a '3d' box (which may end up slowly spinning as an added animation).
(A) also, when the mouse clicks on one of the navbar buttons, the letters on head will be backlit (as shown) to spell out different things - such as 'gallery', 'about me' and 'contact' (there isnt really going to be a 'seattle' link - the letters need to be changed to make the other spelling possible).

(2) when a navbar button is clicked the text or thumbnails will load in a scrollable area on the right side of the screen. The same idea from (1) will be applied to the scroll buttons (right-most hand). I know its narrow - but i think i read somewhere that narrow columns of text are actually easier for internet users to read.

(3) (middle hand) when the mouse rolls across the 'moon' area, a hidden layer will be partially revealed underneath (of gears etc).

so let me know if you think i should add or remove anything, or if you would change the graphics or have any better ideas for the layout. -whew!

thanx for your input.

Ian Jones
11 November 2002, 07:43 AM
It would take a long time to explain how to do everything you want with Flash, but I'll give you some quick pointers anyway.

One question about the layout first though... if the menu is in the middle of the page, then will the portfolio images have enough space to load into? Just something you may want to think about. Yes narrower columns are easier to read. Imagine reading a whole document on a website that used the entire left to right space in a web browser... that would abe terrible. Now imagine a slightly slimmer left ot right area, much easier to read without thinking "omg I'll never get through this". Your column is a little too narrow actually, make it a touch wider. You gotta find the right balance between the extremes.

Now, about Flash. You have asked quite a set of questions there... I'll give you some suggestions.

You can make the buttons change from an arrow to a 3d box with a 'button' symbol. By editing the symbol you can change the up, down states. Which allow you to change the button pic depending on whether the mouse is on it or not. In the Flash help, do the tutorial about buttons.

For the head with different words appearing, I would suggest you make each one and when a user clicks on say the seattle menu button, then the Flash movie progresses and stops on a new frame where the words seattle are lit up. Do some Flash tutorials and you'll figure this out. eg..

For the moon and the 'inner workings' effect this is done with a 'mask' layer and some actionscript (yes you have to do a little programming, but it is easy to learn so dont worry). A layer that is a circle in your case, it follows the mouse and wherever it goes it punches a hole through the moon and reveals a picture placed in a lower layer. Much like erasing a hole in photoshop to reveal a layer underneath. Unfortunately you may not be able to get the 'feathered' mask. I think Flash only supports a hole, or no hole... so to speak. It will not allow multiple levels of transparency in masks (As far as I know. I could be wrong because I haven't checked yet with Flash MX). To find out more about 'masks' consult the built in Flash help, or search for tutorials on the net.

Like I said, I would have to spend days typing to teach you how to solve a moderately complex set of problems. I hope this helps anyway, at least giving you something to start researching into. :)

hehe, btw the layout is ok, I like the moon. did you make it?

CGTalk Moderation
01 January 2006, 10:00 PM
This thread has been automatically closed as it remained inactive for 12 months. If you wish to continue the discussion, please create a new thread in the appropriate forum.