Streaming live at 10am (PST)

Random flying objects script


#1

Here’s what I want to do. On my first section I want 4-5 images flying from right to left and left to right and it should feel like they are flying random and in different speeds. They should also slightly move in the x axis as well.

I tried using IX2 but you don’t quite that random feel of it.

I also tried to find a suitable script online but failed. Maybe someone know of some or can help me write a script. I wish a knew how to write js myself :confused:


#2

Hi

random feeling can be achieved by piling animations on top of each others. For example, add an interaction movement in one direction, with one defined speed, lenght, delays. Then wrap the element into another div, and affect a new animation with a different lenght, speed, everything. do that a third time. And for other elements, cobine differently and add noe animations.

In the end, you’ll get motion patterns that can feel random. The relative motion between object will not repeat.


#3

Hi Vincent, thanks for your comment.

I’ll try your tips out.


#4

I reckon that it’s a very general tip. That’s what i’m using in motion design in After Effect, or in web motion design in Hype 3, or in Webflow, to introduce granularity in animations. At the very minimum, when I have an object that is going to move based on a trigger, I start by defining a subtle “idle” looping animation on it. Like a very slight up and down movement. Then it will be added to the main motion.

It prevents me to use scripts in AE, or JS in Hype and Webflow.


#5

I tried something out in Hype but I didn’t manage to get the feel I wanted. I found a very small script that worked very well but the animation was more like they moved and changed directions inside a container instead disappear from the screen. For now I got something in IX2 that is good enough. Deadline is approaching as well :grinning: