Help understand a Flash site

May 3, 2006 12:12 PM

How does one make a site like this one ... ? http://www.playgroundsfestival.nl/playgrounds.asp What I mean is how does one make the huge background, and add the elements onto it? Point to a tutorial helpful. Thank you,
posted by bright77blue to Computers & Internet (9 answers total)

Flash tutorial

You will, of course, need a copy of Flash
posted by Mwongozi at 12:29 PM on May 3, 2006

Response by poster: Great ... what is the effect called with the huge background?
posted by bright77blue at 12:35 PM on May 3, 2006

Flash Kit probably has something to learn from, there are a lot of movies to download and dissect (much like using View Source for html, etc). There is no term for the effect per se, search for 'drag' and you'll probably find something to start with. Good luck!
posted by jacobjacobs at 12:40 PM on May 3, 2006

holy shit thats bad design... the whole thing slowed down my fast computer immediately.
posted by yonation at 12:43 PM on May 3, 2006

That site completely locked up IE6 on my computer. I had to Ctrl-Alt-Del close it. bright77blue, please do better when you try this.
posted by Joleta at 2:10 PM on May 3, 2006

Best answer: Well that particular page was done entirely in flash, however there is no reason you couldn't do this in pure HTML, in fact you would avoid all the compatibility problems people are suffering here (although it worked fine for me).

To do this in HTML, all you need to do is use CSS positioning. If you do something like

<style>
div.faraway{
position: absolute;
left: 1200px;
top: 1200px;
}

div.farther{
position: absolute;
left: 1600px;
top: 200px;
}

</style>

<div class="faraway" > some content some images, etc</div>

<div class="farther"><img src="http://cokere.com/tr.png"></div>

Then just add some javascript to do the scrolly thing.
posted by delmoi at 2:20 PM on May 3, 2006

You don't need Flash to make something look similar to that unless the movement of the elements is key to your design. You can achieve a huge background and added elements on it very easily with CSS. Just google CSS tutorial, there are scads of sites. The background and the elements won't move or anything, but the look could be exactly the same. You can position menus and blogs and graphics exactly where you want them to go over the background.

And I agree - that's horrible design. Froze my computer temporarily two times. Ugh.

On preview - yeah, what delmoi said.
posted by iconomy at 2:25 PM on May 3, 2006

Great ... what is the effect called with the huge background?

I don't know if that "effect" has a name - in Flash, the designer can make an object that is larger than the "viewport" of the .swf, then animate its movement or allow the user to move it. This is likely what was done here.

Here's a little tutorial that I found by searching for "actionscript draggable element." That should get you started.
posted by dammitjim at 5:00 PM on May 4, 2006

No idea what its called but philrenaud.com reviews the 35 "sexiest" sites and links to a site similar to the one youre talking about. They refer to it as a macro-trend in flash design.

Heres the blurb and the link:

"Bio-Bak (Flash). I am a BIG (forgive the pun) fan of the macro-trend in flash design, and this is a perfect example of why."
posted by skrike at 8:38 AM on May 5, 2006