Confetti effect in hype


#1

does anyone know how to create the confetti effect as in this banner in hype
http://www.agcs.works/portfolio/bing-lee-mothersday


#2

That’s an image, so I would say [Pixelmator / Affinity Photo / Illustrator / Sketch]?

But in Hype, you can do this with regular circles and opacity:

circle.zip (37.8 KB)


(Thiago Ribeiro Nogueira) #3

I think he wants the falling confetti effects, no?

https://serve.adgibbon.com/websitegallery/bing-lee-mothersday/300x600/


#4

yeah it was the falling effect not possible then?


(Thiago Ribeiro Nogueira) #5

Do a simple motion path and change the X and Y Angles in Rotation Menu on Metrics Inspector. See the file.

confetti.zip (13.6 KB)


#6

Cheer Thiago
is it possible using JS or CSS instead of making lots of symbols


(Thiago Ribeiro Nogueira) #7

I know nothing about JS :sweat:

I hope someone shows up to help you :wink:


#8

@william

Check out this thread. It relates to snowfall but confetti isn’t hugely different. I have not delved into it too deeply but You can control the effect to some degree. I did not see any color control and the filter effects does not colorize it. But it could be a starting point (or if white confetti does the job you’re set).

Here is @h_classen’s Hype demo from that thread using “snowfall.min.js” library:
snowsnow.hype.zip (140.5 KB)

EDIT: Google “three.js particle effects” - this looks promising - but no experience with it.