A Flash Developer Resource Site

Page 1 of 3 123 LastLast
Results 1 to 20 of 57

Thread: Preloader, flash intro to web page question

  1. #1
    Trying hard to get it
    Join Date
    Aug 2005
    Location
    Fort Lauderdale, FL
    Posts
    76

    Preloader, flash intro to web page question

    Yes, I am new to flash. No, I am not new to HTML but right now the Left brain is not connecting to the right.

    I am making a portfolio site. I want to have a cool flash intro (about 14 sec long) then on to the website. I am currently working on the intro and burning my eyebrows having to figure out flash by myself. (I am an art director w/ 14 yrs experience in Photoshop, illustrator and all that good stuff that is dying to get into the moving images world) The only downside is everyone around me is as non-flash as I and nobody can help me.

    OK, on to my question... I am making this intro. I have the intro done but I can't figure out how does the preloader come into the whole thing. The intro will be a swf file. When people go into my website the HTML page will tell the swf file to start loading and play automatically? Or do I have to have a preloader? how does the preloader exist? Is it a movie clip in my intro swf or how does it work?

    Once I have the swf file done I imagine I have to put a button for them to click on to go on to the web page? Or can you automatically end the swf file and drop them into the html page? The transition of these items got me confused. How big a file must be to have a preloader?

    I appreciate the explanation. I have web sites done but they are only using html, javascript and css. I want to get flash going in my sites!! Waaaah!!! Any help I can get will be appreciated!!

  2. #2
    Senior Member whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,756
    well basically a preloader is just a generic term used to check if somethign has loaded..

    based off the results (true/false) you can can do whatever.

    Now depending on how you author your .swf's if how they will react.

    You create a movie (intro)..embed it into an HTML page..upload it to the web..and try to view it....what happens is what you TOLD it to do when making it.
    will tell the swf file to start loading and play automatically?
    You asked if it will automaticaly play? well if you DID NOT put any STOP; actions on the first frame...you movie should play as SOON as it is loaded...or when enough has loaded to initiate play. If you designed yoru movie/intro to stop and wait to move forward (play) until there is user interaction... thats how it will respond.

    Or do I have to have a preloader?
    Nope..up to you..if you deem it fit..add one...but it is considered GOOD practice to add a preloader or some sort of visual representation that things are loading or moving..(not just a blank stage after they click a button)... that being said.. ther are a TON of "preloaders" probably havent even noticed half of them.. they range form things liek the normal progresss bar that scales as the KB's are loaded.. or even a percentage% shown of how much KB's are loaded... sometimes if just just be an animation that blinks over and over saying "loading"..or a circle spinning.. or sometime they play another movie as a distraction until requested content has loaded.

    You can even have yoru INTRO be your prelaoder... (not sure as to hwo you have it alset up)..but you can play yor intro...on the last frame check to see if yoru MAIN content has been loaded..if NOT..then play your intro again..if it HAS BEEN LOADED..then go on a play your content.

    Or can you automatically end the swf file and drop them into the html page?
    Yes...either way..you can prompt for user input to move along..OR just have code saying: "Is my content fully loaded?"..if so......gotoAndPlay (frame/scene)

    A preloader CAN be a movie clip..if youd like to assign certain actions or animations during the "check" or it can simply be CODE on yoru frame or attached ot another movie clip. The CODE does the work for you...everything else is extra


    I personally use ap reloader on EVERYTHING.....with a code to NOT show at all if content has been loaded once before..

    Unless your movie is for CD authoring..I would get used to using preloaders... helps if you ever change the content...

    Hope this helped

    Also..you came to the right place (FlashKit)...tons of good, smart people here willing to help..(sometimes TOO smart) Need any morehelp..just ask or PM.. the search feature will help you as well... Id go as far as to say there is not ONE question you might have that hasnt been asked and answered..(flash related that is) LOL

  3. #3
    Trying hard to get it
    Join Date
    Aug 2005
    Location
    Fort Lauderdale, FL
    Posts
    76

    You are my new GURU!! LOL!!

    You explained yourself very well, especially for a newbie like myself. Thanks!

    So, preloaders are the way to go. I have my fla file and i tried to attach it so that you could see it but it is too big (5Megs!) So I am not sure how can I have you see what I have.

    Is it possible to see how the code would be for a preloader? This would be action script...correct?

    If it is a movie clip. How would it be stored: In other words, Do I make a file with a scene 1 being the preloader "movie clip" or just a plain old illustration moving with a bar. How does the bar know what percentage of the file has been loaded? Is there action script for this?

    Then, If the scene idea is correct: I can build another scene with my intro? In the same swf file? In otherwords when I publish it there will be only one file with the preloader and the intro all in one?

    See, I know more the html side of things, this website I made for myself a while back. As you can see it is all html, java etc... this I understand I just don't understand how flash interacts with it all.
    http://home.bellsouth.net/p/s/commun...pid=163732&ck=

    Action Script is a bit overwhelming although it looks a lot like javascript in a way.

    My problem is I can make things move and stuff in flash and make a swf movie but when it comes time to get it compressed or get it to work I get stuck. I guess it is the learning curve. I am trying to deal with the idea that I won't be able to make what I have in my head happen as quickly as I need it but your help is great. I will get it someday. I KNOW IT!!

    Michelle

  4. #4
    Senior Member whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,756
    http://www.flashkit.com/board/showth...03#post3378403

    read this thread.. I'll post more once I get to work.. this should explain everything for you...in detail as well as an attached .fla (somewhere in there)

    talk to you soon..

  5. #5
    Senior Member whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,756
    ok... I read your post more.

    I think we need to take a step BACK. There are many answers and different ways to do things....depending on what YOU want to do.

    Are you trying to get a preloader for your HTML page? Or are you just trying to have it so that at the end of your "flash intro"..it automatically goes to your web site/gallery?

    If you go here:
    http://www.dmstudios.net/test_2/

    and click on the about.me link... you will a coupel things..

    1.) a "transition animation" intro (the fill tweening in)....
    2.) a preloader "visual" (the progress bar animation "barber shop pole thingy")
    3.) (once content has loaded) the "transition animation" outro (the fill tweening out)


    basically I click a button...it starts a movie clip playing (the transition animation fill) than I have a stop action. On this frame (stop; frame) I have code that checks to see if the content I am trying to load (also triggered by my button click) is loaded....if not it will stay there....if it IS IN FACT loaded..it will move forward...hence plying the transition animation "outro" .

    Thats it... to add more "zip" in that stop frame..you can add a looping movie clip (loading "blink" "blink" "blink")....and do other stuff...

    but thats it in a nutshell.

    I am not to sure about trying to "preload" an HTML page.
    Last edited by whispers; 08-31-2005 at 10:14 AM.

  6. #6
    Trying hard to get it
    Join Date
    Aug 2005
    Location
    Fort Lauderdale, FL
    Posts
    76

    saw your site (drool)

    I want to do the scroll thingie you did with the copy in my site sooo bad!! I can't figure out how! LOL!!

    Your site looks very cool and professional. I like it a lot!

    I was reading the posts you did with the other people and I realized how little I know about action script. I read the stuff and it goes in one "eye" out the other. I am not home right now so I can't download the flash stuff but I will when I get the chance.

    As per your question. No I don't want a pre loader for the html page. I just would think I need one for the intro page.

    To me the sequence would be: person goes to my website, they see the loader, then shows the little intro, then it goes into the home page after they click "enter". That's it.

    Inside the html would be the site with info about me and my portfolio stuff (given it is mostly print) 15 years in advertising and very little web. What was I waiting for! I would love to do a scroll thingie like you did for the copy and a slide show type thing for the pictures but I don't think I will have the time to incorporate it all.

    You see, I am relocating out of Florida to Rochester NY (yes very cold) and I don't want to keep doing what I am doing now. I want to get more into the web part of it. So this is my chance to get in or be stuck doing static graphic design for the rest of my life. (boy, that sounds like doomsday)

    I love making the stuff move!! LOL!! Now I just got to get this stuff into my brain! AAAaaaaggghhhhh!
    Makes me feel old.

  7. #7
    Senior Member whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,756
    stay in print...at least theres work in that field. Everybody and their little brothers pick up on HTML and basic web design...but companies only want ALL IN WONDERS now-a-days... where they can do graphics, web design & code...plus dont forget 3D an video experience...without..IMHO its hard to geta job that pays well and is stable.

    ok..back on topic.... so your "intro" is 5MB? I dont think thats going to work for an "intro"... thats HUGE..even people on broadband woldnt wait Im afraid.

    How is that huge?...do you have aTON of images or something? I woudl look into dynamic content as much as possible..

    Anyways...I dont mind helping...so if you got my questions..let 'em fly.

    p.s. I wish I lived in Florida..OR NY.. boo hoo..

  8. #8
    Trying hard to get it
    Join Date
    Aug 2005
    Location
    Fort Lauderdale, FL
    Posts
    76

    Not with the Hurricanes!

    I am sick of the hurricanes here. I am from Puerto Rico originally and I also was chased by hurricanes there. I am glad at least I don't have to worry about hurricanes in NY. They are NASTY!

    Where DO you live??

    I know everyone is getting into the web deal. I actually want to become a triple threat! Good in graphic design, good in code and good in flash! LOL! Am I getting too optimistic? If I could find some good soul in Fort Lauderdale that would teach me some tricks (for free cause of course the starving artist deal still is true) I would be in heaven!

    I was reading the visual quick start guide (I AM a newbie) for flash and I stumbled upon components. They seem to good to be true. Are they hard to use? I saw they have the scrolly thingie in there. hmmmm.

    Anyway, the size is huge. I just built the whole thing on one long and layer full scene. Now I understand a bit more about the graphic symbols and movie clips (thanks to my little VQS guide) and I see that I can actually compress a lot of the animation I did into these clips.

    Question: If I am using a background in my first scene that opens up and all this stuff is happening on top of it. I can make that into an animated symbol and by increasing the size of my frames it can be as long as my intro is or can I just make a movie clip stop to keep the visual of the background to the end of my intro?

    I have to get something out to show you what I am talking about! Let me see if I can send a pdf... Hang on!

  9. #9
    Trying hard to get it
    Join Date
    Aug 2005
    Location
    Fort Lauderdale, FL
    Posts
    76

    Visuals

    Alllrightie!
    I got some gifs to show you so you get what I am trying to do...
    The IntroLook.gif is the way the intro is going to look. You see the orange background? Ok. THat when the movie starts comes down onthe left side of the screen as a tiny box which opens up to a line that opens into the full size rectangle box.
    Then the colored boxes show up from different angles (fading in and stopping in their place)
    Then the dandelloin image fades in and as it fades in one of the little "fluffies" detaches and flies off into the top right corner of the orange bkg.
    my name appears then the creative and walla! There is my movie.

    In the background I put a wav. file with music (which is about 14 secs long) and added sound to keyframes when the things open and stuff like that. Hmmm. maybe the sounds are the culprit in the size of the file?

    The second image Mmcreativeweb.gif. Is to show you what the website is going to look. This I am doing in html but would like to add a flash animation to the dandelloin image (having the fluffy thing fly off) and if possible getting the scroll thing for copy and pictures. but this is the file they would get dropped into once the intro is done.

    OK! Now at least you know what I am talking about. (I hope)

    let me know what you think. Maybe how would you would build this file in flash? Since there are so many ways to do it I would be glad to hear how would you tackle it.
    M.
    Attached Images Attached Images

  10. #10
    Senior Member whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,756
    As far as getting to your HTML page (and having the dandelion be intercative) think of it as an HTML page....and in your TABLE you can embed any flash content (.swf) in a cell or whatever so create your HTML page leave a cell big enough for your dandelion animation... and create it later after the layout is complete...

    Im thinking yoru music is the culprit..maybe strip it out...and see where that leaves you.

    and maybe we shoudl do this over..one step at a time.. I can help..and we can deisgn not only an optimized layout..but one you can build off of later.

  11. #11
    Trying hard to get it
    Join Date
    Aug 2005
    Location
    Fort Lauderdale, FL
    Posts
    76

    I am game...

    I already tried to redo the animation but I am going in the wrong direction. If I could get your help from the start I know I can get it.

    I got the HTML bit. I was planning on doing that. I have used animated gifs in the past and was thinking of using the swf file instead.

    My problem is flash/action scripts and getting it optimized as you mentioned.

    Where would I start?
    What do you suggest?
    I am ready!

  12. #12
    Senior Member whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,756
    well I only partly understand your movie and what you want it to do...

    I dont however understand you HTML site..(where that fits in) except to jump that HTML page after intro plays through once.

    I guess step one would be to create a new movie.
    orange BG color.

    and lets work on the "tweening squares"..and the dandelion fade first.
    So..I see this as two layers so far.
    layer 1: the layer that has your dandelion clip
    layer 2: that has all your "square animations" clip

    so on layer 1:
    File >>>> Import your picture (find your dandelion)
    it should be on your stage now.
    select it >>> convet to a movie clip symbol
    now DOUBLE CLICK your dandelion movie clip and you will be INSIDE that movie clips time line (runs independent of the main timeline)
    make your tween animation of fading from see-through to solid. ensuring that you leave the frame 1 of this movie clip BLANK & add a stop action to frame 1 as well)

    layer 2:
    I would create a movie clip that has all the tween.animations you want for your "squares" (all continaed inside one clip)...
    on the last frame on your "squares" clip (not sure how many squares you want...but put each one its own layer)..in the last frame of yoru "squares clip" add some code that will trigger (start) your dandelion clip to fade in.

    That should be step one I guess...

  13. #13
    Trying hard to get it
    Join Date
    Aug 2005
    Location
    Fort Lauderdale, FL
    Posts
    76

    First few things...

    OK. I got my background looking great with all the boxes and their movements. I make a new layer for my action script but I am not sure if that layer will control all my layers (there are 4 layers in the animation total) I go to action script anyway and I put in a
    Line 1: Stop action
    Line 2: Go to play (2) (for my 2nd frame where I will be putting the dandelloin to start playing.

    Only problem, I go to test the background and it plays over and over again.
    This background is supposed to STOP (and stay visible and in its final state, meaning open) and then go to the next frame. Well, the playing over and over again is not very reassuring.

    What am I doing wrong? Is putting the action on a separate layer all together a wrong thing? Do I have to go layer by layer and put a stop action on each finished layer?

    One more question: The animation frames should stop at the last frame where the bkg orange box is open all the way... right? I do not have to put a bunch of extra frames to have the movie clip last till the end of my intro... correct?

    I am working on the dandelloin part now. Let's see what happens with that...

    Did I tell you already how much I appreciate your help????

  14. #14
    Trying hard to get it
    Join Date
    Aug 2005
    Location
    Fort Lauderdale, FL
    Posts
    76
    PS. I am going to be checking for your answers. I usually work in the computer till 10PM. taking breaks to take care of my 4 yr old girl. Learing flash and a 4 year old is a very stressful combination.
    Belive me!
    I hope you are around! :-)

  15. #15
    Trying hard to get it
    Join Date
    Aug 2005
    Location
    Fort Lauderdale, FL
    Posts
    76

    what a mess...

    More questions:
    When I make the movie clip of the dandelloin appearing. Do I do this artwork in the same file I made the background?
    Or can I do it in a new flash document?
    Does it have to be the same size as my final document? (800x600)

    I am asking because I did the dandelloin. I couldn't see the dandelloin very well because I need the orange backgroudn behind it to see it (it is mostly white) so I do it and I grab all 3 layers of it and make a movie clip out of it. I called dandelloinFade.

    I went to the file where I placed the background movie clip on the first frame. Made another layer. Made a key frame in frame 2 and placed the dandelloinFade movie clip into that key frame.

    Went to check out the movie and all I can see is the box that starts my bg movie clip (a tiny little box) in the middle of the stage (where I placed it when I dragged the movie clip into the stage).

    So another question is this: does it matter where you drag the movie clip to in the stage?

    Sorry, Very confused at the moment.

  16. #16
    Senior Member whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,756
    Can you post the .fla that we are working on now? Then I will go through this thread... and answer some questions. after this..I will move onto the next one.. Yes I know all about how busy it can be. I come home form work..and take care of my 1.5 yr old son... and help here..and learn FLASH here....and learn other things as well...

    So the .fla should be very small...correct? I think you need your stop actions INSIDE the movie clips. if Im looking at yoru movie..as soon as I open it..

    on ROOT..there should be only 2 layers right now... 1 frame each layer.
    each of these frame/layers should have a MOVIE CLIP in them.

    DO you have that so far?.

    Anyways..post the .fla and we'll get to work.. I'll be around..checking every now and again..


    Quote Originally Posted by msm2554
    OK. I got my background looking great with all the boxes and their movements. I make a new layer for my action script but I am not sure if that layer will control all my layers (there are 4 layers in the animation total) I go to action script anyway and I put in a
    Line 1: Stop action
    Line 2: Go to play (2) (for my 2nd frame where I will be putting the dandelloin to start playing.

    Only problem, I go to test the background and it plays over and over again.
    This background is supposed to STOP (and stay visible and in its final state, meaning open) and then go to the next frame. Well, the playing over and over again is not very reassuring.

    What am I doing wrong? Is putting the action on a separate layer all together a wrong thing? Do I have to go layer by layer and put a stop action on each finished layer?

    One more question: The animation frames should stop at the last frame where the bkg orange box is open all the way... right? I do not have to put a bunch of extra frames to have the movie clip last till the end of my intro... correct?

    I am working on the dandelloin part now. Let's see what happens with that...

    Did I tell you already how much I appreciate your help????

  17. #17
    Trying hard to get it
    Join Date
    Aug 2005
    Location
    Fort Lauderdale, FL
    Posts
    76

    here is the file

    didn't work.
    Attached Files Attached Files

  18. #18
    Senior Member whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,756
    what didnt work?..your .fla?...thats ok..we'll fix it...

    here is a quick mock of HOW it should have looked..

    I'll check out your .fla now

  19. #19
    Senior Member whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,756
    well first...you only have a dandelion layer..no squares layer....and I see NO way of you triggering the dandelion clip to fade in.. (nor a fade in tween either)
    Last edited by whispers; 08-31-2005 at 08:01 PM.

  20. #20
    Senior Member whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,756
    ok..so do you want the orange BG to tween in?..or to be a solid orange from the jump?

    also..I think I miss understood..about the squares part..I thouht I read you wanted them to "animate in" and be in the upper corner?

    1st mistake I saw off the top:

    your two layers. (bg & dandelion)
    your top layer was TWO frames long and your bg layer was only 1..

    so when the playhead advanced to the next frame...(frame 2) there was NO background to be shown..(hence the blink)..

    part TWO of the BLINK problem was because there was NO stop action in frame 2 to stop the playhead from resetting.

    solutions: either make the BG layer have 2 frames..(and add a stop action to frame 2) OR shorten the top layer to be one frame long only..(no stop action needed on _root)


    2nd mistake I saw. You dropped the opacity of the dandelion graphic itself...the actual drawing of it. All effects you want to apply to in a transition/tween scenerio are applied to movie clips so after you had grouped all your graphic layers together..and had your final graphic symbol done.. you should have selcted it (whole thing)..and converted it to a movie clip. INSIDE this movie clip (double click it to get to that movie clips timeline) is where you want to have your animation/tween. (in this case the animation is the fade in) a TWEEN has to have a point a & point b.. a start and stop destination. so you have a 20 frame fade animation/tween..in the LAST frame of this fade tween...you add a STOP action. (if you are going to put all actions on its own layer...make sure you add a BLANK KEYFRAME to the frame you want your code..otherwise it will fall to the last keyframe.....

    You will also want a STOP action in FRAME 1 of your fade tween...as you dont want it fading in until you tell it to.

    now your all set..your last step is to figure out a way to trigger the fade in. (your squares thing)

    her is YOUR .fla exactly to the point where I leave this post. we can work on the BG trigger or sliding in squares or however you want to do it..
    Last edited by whispers; 08-31-2005 at 08:10 PM.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center