# Square Particles

**URL:** https://forum.kirupa.com/t/square-particles/15595
**Category:** flash
**Created:** [March 16, 2003, 2:43am UTC](https://forum.kirupa.com/t/square-particles/15595 "2003-03-16T02:43:22Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![soccerstar](https://avatars.discourse-cdn.com/v4/letter/s/d2c977/32.png) [@soccerstar](https://forum.kirupa.com/u/soccerstar)
#### Post date: [March 16, 2003, 2:43am UTC](https://forum.kirupa.com/t/square-particles/15595/1 "2003-03-16T02:43:22Z")

</div>

Hey im tryin to make a web site with dreamweaver and some flash integraton, but there is a problem i have not used flash very much. Anyway i was wondering if anyone could help me with my site.

I want to know how to make a flash effect that has square particles appearing around an object, text in my case, aligned in a grid. It is something similar to the flash effect on this site, the background grids;  
[http://www.templatemonster.com/show.php?templ=2099&cat\_type=cat&type=1&arg1=53&arg2=&order=date](http://www.templatemonster.com/show.php?templ=2099&cat_type=cat&type=1&arg1=53&arg2=&order=date)  
Please help.  
Is there a place where i can learn layers and what action script to use?  
P.S. If anyone else has any neat ideas for my site feel free to shout em out. Its a Computer business called Lucent.

PEACE

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 2:45am UTC](https://forum.kirupa.com/t/square-particles/15595/2 "2003-03-16T02:45:41Z")

</div>

please post correct address. It’s somehow broken.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 2:54am UTC](https://forum.kirupa.com/t/square-particles/15595/3 "2003-03-16T02:54:26Z")

</div>

What she said :block:

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 2:58am UTC](https://forum.kirupa.com/t/square-particles/15595/4 "2003-03-16T02:58:24Z")

</div>

Okay i fixed it, sorry for the mistake.

PEACE

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:01am UTC](https://forum.kirupa.com/t/square-particles/15595/5 "2003-03-16T03:01:37Z")

</div>

Grrr, I think the forum is screwing up your link.

Post the link in a new reply but this time uncheck the checkbox below the reply text area that says…

“Automatically parse URLs:”

That way it won’t condense the link like that.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:02am UTC](https://forum.kirupa.com/t/square-particles/15595/6 "2003-03-16T03:02:53Z")

</div>

Its Fixed now i tested it on a coouple of my comps.

Thanks, yea something they did was messin in up

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:05am UTC](https://forum.kirupa.com/t/square-particles/15595/7 "2003-03-16T03:05:00Z")

</div>

Ok, well if you are going for what they have…

The background w/ grid is actually an image that was imported. Probably done in Photoshop or something.

Then the squares are just tweens in a movie clip that are placed around the stage.

Here is how to create a fading effect…

[http://www.kirupa.com/developer/mx/fadingtext.htm](http://www.kirupa.com/developer/mx/fadingtext.htm)

This is also doable with Actionscript, but pretty much easier with tweens.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:12am UTC](https://forum.kirupa.com/t/square-particles/15595/8 "2003-03-16T03:12:59Z")

</div>

Thanks, but what kind of tween do u think, like i said im new at this so bear with me.  
Peace

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:13am UTC](https://forum.kirupa.com/t/square-particles/15595/9 "2003-03-16T03:13:44Z")

</div>

Check the fading text link I posted above.

It is the same process, just on a shape instead of text.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:25am UTC](https://forum.kirupa.com/t/square-particles/15595/10 "2003-03-16T03:25:06Z")

</div>

okay but how doi get them to alternate like that? or do i have to do em separately in different key frames?

Peace

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:26am UTC](https://forum.kirupa.com/t/square-particles/15595/11 "2003-03-16T03:26:00Z")

</div>

It seems to me that they did it seperately on different keyframes so the fade would go off at later or earlier times.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:26am UTC](https://forum.kirupa.com/t/square-particles/15595/12 "2003-03-16T03:26:28Z")

</div>

You could create 1 movie clip with the tweening block.

Then in your timeline randomly place that clip in different keyframes.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:29am UTC](https://forum.kirupa.com/t/square-particles/15595/13 "2003-03-16T03:29:00Z")

</div>

Tweening block? Man i gotta learn flash. Thanks

Peace

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:30am UTC](https://forum.kirupa.com/t/square-particles/15595/14 "2003-03-16T03:30:53Z")

</div>

Tweening block = the square you created with the fading tween

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:34am UTC](https://forum.kirupa.com/t/square-particles/15595/15 "2003-03-16T03:34:16Z")

</div>

_Bangs head on the table_ Thanks and where in the time line, like inside of eachother? \_\_\_\_\_\_\_I\_\_\_\_\_\_\_I \<----- that being the timeline.

PEACE

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:39am UTC](https://forum.kirupa.com/t/square-particles/15595/16 "2003-03-16T03:39:19Z")

</div>

Check my attachment. I set up a real quick example.

But keep in mind: My tweening and animation skills in Flash are incredibly limited, I don’t know if my method is the best method or not honestly, but it works.

I have…

Main timeline which is the grid and a movie clip on the layer above.

Inside that movie clip I have 3 layers.

Each of those 3 layers contains the movie clip of the fading square.

I placed them on the timline at different points in each layer.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:55am UTC](https://forum.kirupa.com/t/square-particles/15595/17 "2003-03-16T03:55:39Z")

</div>

WOOOOOO HOOOO. DUDE THATS EXACTLY IT. NOW I WILL TRY TO DO THAT.

THANK YOU

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 3:56am UTC](https://forum.kirupa.com/t/square-particles/15595/18 "2003-03-16T03:56:36Z")

</div>

No problem 🙂 Hopefully it helps you out.

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 4:10am UTC](https://forum.kirupa.com/t/square-particles/15595/19 "2003-03-16T04:10:29Z")

</div>

one more question. How did u go about; in what order, putting the layers together. like scene1\>block\>blocks\>block1\>block2\>block3\>randomly placed blocks? What was the order?

---

<div class="post-metadata">

### Author: ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)
#### Post date: [March 16, 2003, 6:44am UTC](https://forum.kirupa.com/t/square-particles/15595/20 "2003-03-16T06:44:22Z")

</div>

First I created the square shape.

Then I converted that into a movie clip symbol. (named block)

I then converted that into ANOTHER movie clip symbol. (named fadeBlock I believe)

I then double clicked on the fadeBlock clip to open it for editing. I right clicked on Frame 10 and chose “Insert Keyframe”. I did the same thing for Frame 20. I then right clicked inside the grey area between keyframes 1-10 and 10-20 and chose “Insert Tween”. Then I went back and clicked on frame one, clicked on the square movie clip in frame 1 and opened the properties panel (CTRL+F3) and in the drop down box I set it to Alpha and change the value to 0%. I repeated the process on the clip in Frame 20 as well.

After that you can BACK to the main timeline and click on the fadeBlock clip. Now here we go again, I converted THIS clip into a movie clip symbol again. I believe I named it “randomlyPlacedBlocks” or something.

Lastly I double clicked on the randomlyPlacedBlocks clip and then set up the layers in there. I just dragged an instance of the fadeBlock clip out of the library and onto the stage on the new layer, and positioned it where I wanted it to go, on the keyframe I wanted it to go on.

[Next page](https://forum.kirupa.com/t/square-particles/15595.md?page=2)
