What is the element of bridge light?

Animation
1

Hello,

In the following online example, there is a moving light, I checked the Hype document, but still can not understand how that light line work,

https://tumult.com/hype/documentation/2.0/flexible-layout/example/FlexibleLayoutExample.html#skyline

It would be great if someone would like to let me know, thanks.

Alex

2

Hi Alex!

Here’s what I found: “skyline” scene > “City Lights” timeline > “City Lights” folder

1 Like
3

To add to @JimScott’s post,

They are just ellipses with some blur and moving on the time line.

4

Bingo. This skyline was made by @michael -- here's the document if others would like to dig in: FlexibleLayoutExample.hype.zip (2.3 MB)

5

Oh…I do not know why I missed those Ellipeses when I check that document, Thanks.
@JimScott @MarkHunte @Daniel

I know there is moving path of any elements in Hype animation, and any moving path can be edited, but how to make a absolute ring circle move path?

Alex

6

I do not understand what You mean. Are you referring to the lights (car headlights I suppose) on the bridge that keep moving continuously in a linear fashion and You want to loop the animation?

7

22d2fe1c9202de8406ed24ff4b6bac3f.jpg1400×719 33.3 KB

@JimScott @Daniel @MarkHunte @michael
Yes, make those Elipeses moving along a absolute circle and loop the animation.

I found a sample FYR.

Thanks.

Alex

1 Like
8

Like this? CircleDots.hype.zip (17.8 KB)

If so You can add more ellipse shaped dots - I just did one… add the new dots to the same group the first dot is placed in (“Circle Thin + Dot”).

General Idea:
Place a dot on a circle’s perimeter. Group the dot & circle together (done in Demo). Rotate this circle & dot group (Z-axis property) on the timeline. As you add the ellipse dots you will need to rotate each dot slightly - with the long axis staying tangent to the circle perimeter. Otherwise just use circular dots instead of ellipses.

Note: I will probably be gone for the rest of the night. If You have questions in the near future others may help.

9

My God:grin:

Great idea, thanks so much....:grinning:

Alex

1 Like
10

In order to keep everything centered, remember to group the circle before adding the small ellipse to the group.

11

thanks，this example let me understand it is possible to create some 3D animation by HYPE.

Alex

12

The trick to a convincing simulation in a movie or any other medium involving movement involves being an excellent liar. You trick the viewer into thinking they’re seeing something they are not. Placing an oval with a gradient over a larger oval with a gradient gives the impression of a jewel. Move a blurred white dot along a curved path in front of it and create a slight shift in the gradients, and it can make it look like its reflecting light over a convex surface. As long as the viewer is not given enough time to study what you’ve done, you can get away with almost anything.

The moving traffic in the reference project is a great example of the brilliance of simplicity.

13

thanks.

I am just think about whether it is possible to present a product with 3D transition animation, which will provide a more attractive and impressive experience.

but I am still studying on it.

Alex

14

I look forward to seeing it.