Tip: How to build a preloader (example)

Discuss Interactive Design & Flash® (SWF) Export inside QuarkXPress 7, 8 & 9.
Exchange ideas, share helpful tips and get started with your first interactive design.
Please note that Flash (SWF) authoring is not supported in QuarkXPress 10 anymore.
Kabir(Quark)
Posts: 5
Joined: 30 Oct 2006, 23:29

Tip: How to build a preloader (example)

Post by Kabir(Quark) » 16 Aug 2007, 02:05

Hi Kim

I dont think its a problem with the swf having already run once as the swf is freshly loaded on every page.

When you export multiple instances of a single shared content swf layout , it creates multiple instances of swf files in the "image" directory of your html page. So , in your case there should be 4 swf files for each pre loader.

If this is the case you could do either of the following things:

1) Make sure all swf files are present in the image folder
2)Edit the exisitng HTML code so that all pages refer the same swf file
3)An entirely differenr apprach - dont use the shared content instance. Instead, create a normal picture box and get the pre-loader swf in it using get picture. This does not result in multiple swfs on export.


Hope this helps.

Regards,
Kabir

jacquesd
Posts: 10
Joined: 09 Nov 2004, 06:09

Tip: How to build a preloader (example)

Post by jacquesd » 16 Aug 2007, 03:00

Hi all,
I have tried it its perfect Matthias, by the way i have made an animation in qid for the progress bar, is there a way to make a conditional expression or script that stops the animation when the second swf finish loading, i know you said it's better to play 3 or four times the animation than looping the circle bar (in my case) but ii seems possible with if , else and so on
have a nice day
jacques

Jonathan
Posts: 50
Joined: 01 Sep 2006, 03:05

Tip: How to build a preloader (example)

Post by Jonathan » 16 Aug 2007, 03:44

This is excellent! At the moment I am currently wading through loads of archive CDs to create our portfolio spreads, and it was a concern that I didn't have a more elegant solution when the visitor needs to wait for a while. I don't think it matters at all that no percentage feedback can be given.

Thanks, Matthias :)

jacquesd
Posts: 10
Joined: 09 Nov 2004, 06:09

Tip: How to build a preloader (example)

Post by jacquesd » 16 Aug 2007, 03:51

Hi all,

I use the matthias trick for the preloader, but i got a slight problem, my second swf use a mask layer (the spotlight tutorial) and of course make the swf transparent each time the spot anim is activated, so in the background i always see my preloader, i have tried to change the background of the presentation but no success is there a workaround to achieve this?
regards
jacques

Matthias Guenther (Quark)
Quarkian
Quarkian
Posts: 2490
Joined: 04 Jun 2004, 15:06
Contact:

Tip: How to build a preloader (example)

Post by Matthias Guenther (Quark) » 16 Aug 2007, 05:09

Hi, Jacques,

yes, there is actions to wait until an object is playing, e.g. you could put into your Script
Loop
Delay 1 sec
Break If SWF your.swf is playing
End Loop
Object hide

However, I am not sure (never tried it with a slow internet connection) whether Interactive thinks the SWF is already playing when still loading, that is something you would have to experiment with.

Regards
Matthias

jacquesd
Posts: 10
Joined: 09 Nov 2004, 06:09

Tip: How to build a preloader (example)

Post by jacquesd » 16 Aug 2007, 09:05

sorry to be late to answer but i got a print design to do, now done, can go back to QID
thanks again :D

jacquesd
Posts: 10
Joined: 09 Nov 2004, 06:09

Tip: How to build a preloader (example)

Post by jacquesd » 16 Aug 2007, 09:14

your're brilliant

KP
Posts: 27
Joined: 01 Mar 2006, 10:36

Tip: How to build a preloader (example)

Post by KP » 16 Aug 2007, 12:44

Hi Kabir

Thanks for your advice. I did check that there were four preloader swfs in the exported image folder, and they were all present and correct.

Anyway, I remade the preloader again and went through the process again and - hey presto - this time it works on all four pages. The pages open so quickly its hardly necessary, but I like the way you actually see it through the main swf for a few seconds - it sort of keeps everything busy and alive without distracting from the main views. I added a little 'subtlety' to the preloader by using a transparent fade on the progress bar with white lettering behind which gives the effect of gradually dissapearing. Clicking on the icons on this page should show it now.

http://www.kimporter.co.uk/KPPortfolioMainPage.htm

Thanks,
Kim

Jonathan
Posts: 50
Joined: 01 Sep 2006, 03:05

Tip: How to build a preloader (example)

Post by Jonathan » 17 Aug 2007, 03:37

Kim, I think you have a great looking website there, very nicely presented - you do some great work too! :D

I actually don't think you need the preloader, though. I found it a bit of a distraction. Can I ask, do you preload the portfolio images, or do they only get called in once the visitor rolls over the appropriate area? It seems particularly quick.

KP
Posts: 27
Joined: 01 Mar 2006, 10:36

Tip: How to build a preloader (example)

Post by KP » 17 Aug 2007, 04:30

Thanks Jonathan. I'm looking forward to seeing the site you're currently building from the bits you've shown so far it looks as if it will be good. (But enough already of the mutual admiration society!) ':wink:'

Having made Matthias' preloader (so neat, so simple) I was determined to get it in somewhere, but you're probably right that it isn't really necessary and may even be a bit distracting.

On each of the portfolio pages the seven images are stacked on top of one another, and together with the thumbnails each one is turned into an interactive object. There is a script to hide all the large images and a script to show one at a time with a fade transition when the curser rolls over the relevant thumbnail.

The best way to get an explanation of how it works is to look at this Sample Project Guide that I basically cribbed from to build my site: Using Interactive Layouts in Web Layouts

http://www.quark.com/products/interacti ... ct1_us.pdf

The sample guides are really good and I think are the best way to learn QID. It would be great to have more or even a whole collection of projects and 'walkthroughs', such as Matthias and Kabir post up here from time to time, in book form.

Locked

Return to “General authoring questions”