TeamPhotoshop
Reviews, updates and in depth guides to your favourite mobile games - AppGamer.com
Forum Home Latest Posts Search Help Subscribe

Designing Interfaces?

Page: 1 Reply
Jun 24th 2002#54857 Report
Member since: Jun 18th 2002
Posts: 5
I'm a novice designer (especially w/Flash) and I wanted to know what is the best route to go if you're trying to design interfaces? I made some shapes and stuff, and I placed them in the background. . .but it's not exactly the look I'm going for.

I want to make interactive interfaces. I think it involves animation software, but being a novice. . .I don't know. It could be simpler. Could anyone help me?

~halo
Reply with Quote Reply
Jun 24th 2002#54885 Report
Member since: Mar 24th 2002
Posts: 3114
I always like to mix usual pixelImages made in PS with the unlimited possibilities of Flash.

I´ve never made a layout/interface entirely in flash, tho that is possible, of course.

If you´re a lot into vector-graphics, then you don´t really need PS.

But I suggest you draw your idea on paper, then in photoshop (building it as a PSD keeping the flash-future of it in mind..)
, and then import the pieces into Flash.

A suggestion... works well IMO.
Reply with Quote Reply
Jun 24th 2002#54907 Report
Member since: Jun 20th 2002
Posts: 378
I agree, sketch your ideas out on paper first, don't get to detailed though these are just brainstorming drawings.

After you do a couple pick the one you like best and modify it or take try to combine them all, haha.
Reply with Quote Reply
Jul 1st 2002#56051 Report
Member since: Jul 1st 2002
Posts: 136
One thing that I like to do, in fact, I'm doing it for a project now, is to make an interface "plaque" if you will. Once I have that, you can add, remove, play around, with different items that go on this plaque. Layers in photoshop come in pretty handy here. If you don't like what you've done for a piece for the interface, just hide or delete it! Great way to work, but it gets better.

When working with Flash you have the choice of either using vectors (for instance, drawing everything IN Flash) and/or imported bitmap images. When I say bitmap, I'm referring to JPG's, GIF's, etc, not necessarily .BMP images!

I tend to use the latter a lot because you can be limited using vectors, however they have their advantages as well. With vectors, you can resize them without "pixelation" of the image or piece. Bitmaps, unfortunately, lack this ability without serious disortion to the image. But when you use bitmaps, you can use all the cool things you can do in Photoshop in your Flash movie/interface. This is a really strong point!

AN EXAMPLE
As I said before, I use imported bitmaps a lot in my Flash projects. As long as you're conscious of the file size of the imported images, you're fairly safe. Making them symbols when you import them really helps too. Here's a cool example of how Photoshop and Flash were made for each other! Say you want to make a moving mechanical arm for an interface.

In Photoshop, using layers. It's really, easy to build your parts for the arm. Let's say the arm has 2 segments. Using layers, build each segment no a different layer. When you export each separately, you can do so just by hiding the other. I LOVE this feature! Also, there is automatic transparency if you start a new project with the "transparency" checkmarked. Very easy!

So, we've made our arms and exported each as a very tightly cropped (as close as possible) transparent gif image.

Import both of them into your flash movie, each on its own layer. and then just rotate, move, slide, the "moving" part of the arm in a motion tween.

This is just a small example. I'm working on a tutorial that mixes making lightning in PS and then importing it into Flash. The lightning will glow or "radiate" and it will strike as well.

I have a very crude version of this already on a site I did a couple of years ago (please be kind over the multi colored text! lol, it was one of the first sites I ever did!). At the very top of the site, in its own frame (another bad thing, I hate frames now! lol) is a Flash movie that serves as the navigation. I will be redesigning the site soon, that nature of the business the client is in demands a better site! (alright, enough self critisizm)!

Basically, when you mouseover a button, lightning on either side of the navbar "strikes". The lightning was made in PS6 and through the use of masking in Flash, it is given the illusion of "striking". Pretty cool effect, just a visual example of how Flash and Photoshop work well together.

You can view the site here:
http://www.delinepro.com

Well, I've typed enough. I guess I have to lay off the coffee! lol. I hope this helps.
Reply with Quote Reply
Jul 1st 2002#56053 Report
Member since: Apr 20th 2002
Posts: 3000
Only if the power of photoshop was integrated in the ability of flash. I need my precious pixels, not coordinates :(
Reply with Quote Reply
Jul 1st 2002#56055 Report
Member since: Jul 1st 2002
Posts: 136
I totally agree! With a little finesse it can work. Just takes some extra ingenuity of the designer. Functionality similar to stuff in Photoshop, but in Flash, has been on the Flash "wish list" for some time!
Reply with Quote Reply
Jul 18th 2002#59533 Report
Member since: Jul 17th 2002
Posts: 215
usually when i design an interface i think of how the navigation is going to work and usually draw that out. i think of if i am going to load swfs to new pages or have them go to levels. i pretty much just started out making lame flash sites my first few times. but if you just keep going, after a while u will get used to it and learn good techniques.
Reply with Quote Reply
Jul 18th 2002#59542 Report
Member since: Jul 1st 2002
Posts: 136
That is very true. When making a standalone Flash site, I usually break it up into smaller swf files that load into levels or into "holder" movie clips. Designing Flash sites is an art within itself just concerning the navigation factor!
Reply with Quote Reply
Page: 1 Back to top
Please login or register above to post in this forum