Author Topic: Trippy swirly pattern generator!  (Read 16023 times)

0 Members and 1 Guest are viewing this topic.

Offline Kirl

  • Senior Member
  • Pentium
  • ********
  • Posts: 1217
  • Karma: 230
    • View Profile
    • Homepage
Trippy swirly pattern generator!
« on: January 22, 2011 »
I'm working on a dynamic pattern thingy, it is based on SuperLineFollow with which I wasted hours of my life. I always wanted to recreate it to add more variation options. Love to hear any suggestions.

Try it here!
[UPDATE] updated file
[UPDATE2] final (?) version

Mouse move: create swirly patterns!
Left Mouse Button: change color
Up/Down arrows: add or remove clones
Ctrl: toggle between particles/lines (Alt: switch particle shape)
« Last Edit: February 22, 2011 by Kirl »
www.kirl.nl
Challenge Trophies Won:

Offline va!n

  • Pentium
  • *****
  • Posts: 1435
  • Karma: 109
    • View Profile
    • http://www.secretly.de
Re: Trippy swirly pattern generator!
« Reply #1 on: January 22, 2011 »
I really like it! The mode with the circles/particles (which looks like curves lines) is my favourite one! The one with boxes will produce some very nice/interesting patterns too!

Particles and lines mode runs here at 17fps - but when adding a lot of clones, the particled mode runs a lot faster (still aroung 17 fps) while the lined mode rund down to 1 fps (is this normal?)

Anyway very nice work! =) *thumbs up*
- hp EliteBook 8540p, 4 GB RAM, Windows 8.1 x64
- Asus P5Q, Intel Q8200, 6 GB DDR2, Radeon 4870, Windows 8.1 x64
http://www.secretly.de
Challenge Trophies Won:

Offline benny!

  • Senior Member
  • DBF Aficionado
  • ********
  • Posts: 4384
  • Karma: 228
  • in this place forever!
    • View Profile
    • bennyschuetz.com - mycroBlog
Re: Trippy swirly pattern generator!
« Reply #2 on: January 22, 2011 »
Yeah, looks nice. Good job!
[ mycroBLOG - POUET :: whatever keeps us longing - for another breath of air - is getting rare ]

Challenge Trophies Won:

Offline va!n

  • Pentium
  • *****
  • Posts: 1435
  • Karma: 109
    • View Profile
    • http://www.secretly.de
Re: Trippy swirly pattern generator!
« Reply #3 on: January 22, 2011 »
@Kirl:
I think you draw all particles (elements) for the whole screen, each frame - right?

Since the effect is everytime centered, you could possible optimize its speed by doing a small trick! What about splitting the screen into 4 parts (1 horizontal and 1 vertical line)?

So you just only need to calculate/draw the top/left part (and mirror this part in x and y). Maybe this could speed up your effect...
- hp EliteBook 8540p, 4 GB RAM, Windows 8.1 x64
- Asus P5Q, Intel Q8200, 6 GB DDR2, Radeon 4870, Windows 8.1 x64
http://www.secretly.de
Challenge Trophies Won:

Offline LittleWhite

  • Senior Member
  • Amiga 1200
  • ********
  • Posts: 418
  • Karma: 31
  • It's me!
    • View Profile
Re: Trippy swirly pattern generator!
« Reply #4 on: January 22, 2011 »
I have 19 FPS in the first mode ( 10 Particules ... )
Why are you displaying ten when I am changing the colour

Really nice :)
The demoscene will never die, never!

Offline va!n

  • Pentium
  • *****
  • Posts: 1435
  • Karma: 109
    • View Profile
    • http://www.secretly.de
Re: Trippy swirly pattern generator!
« Reply #5 on: January 22, 2011 »
@LittleWhite:
The "ten" just tells you the number of used clones ^^ (you can change with cursors up/down to get some really nice effects)


@Kirl:
Found just a small bug ^^ Just add something like:
Code: [Select]
numberOfClones = (numberOfClones < 1) ? 1 : numberOfClones;
« Last Edit: January 22, 2011 by va!n »
- hp EliteBook 8540p, 4 GB RAM, Windows 8.1 x64
- Asus P5Q, Intel Q8200, 6 GB DDR2, Radeon 4870, Windows 8.1 x64
http://www.secretly.de
Challenge Trophies Won:

Offline LittleWhite

  • Senior Member
  • Amiga 1200
  • ********
  • Posts: 418
  • Karma: 31
  • It's me!
    • View Profile
Re: Trippy swirly pattern generator!
« Reply #6 on: January 22, 2011 »
I didn't get that I have to click to change the parameters.
I love it
The demoscene will never die, never!

Offline zawran

  • Sponsor
  • Pentium
  • *******
  • Posts: 909
  • Karma: 67
    • View Profile
Re: Trippy swirly pattern generator!
« Reply #7 on: January 22, 2011 »
Cool effect, almost hypnotic with some of the patterns.

Offline Kirl

  • Senior Member
  • Pentium
  • ********
  • Posts: 1217
  • Karma: 230
    • View Profile
    • Homepage
Re: Trippy swirly pattern generator!
« Reply #8 on: January 23, 2011 »
@LittleWhite
You need to click to set the focus of the page to the Flash file, it's something Flash requires when te page is loaded.

@va!n
Thanks for spotting the bug! The optimisation trick won't work because the 2 axis of symmetry rotate in opposite directions with an even nr of clones.

There are still some optimisations I can do, and I spotted a serious one-line slowdown for particle mode. I'll post an update soon.
www.kirl.nl
Challenge Trophies Won:

Offline Xetick

  • Atari ST
  • ***
  • Posts: 132
  • Karma: 80
    • View Profile
    • Plane9
Re: Trippy swirly pattern generator!
« Reply #9 on: January 23, 2011 »
Really nice effect. Have you tried to apply a gradient to the ribbons?
So it becomes something like


Not sure what the speed in flash would be for that though

@LittleWhite
You need to click to set the focus of the page to the Flash file, it's something Flash requires when te page is loaded.

If you want to fix that problem you can use SWFObject. Google even has it in its javascript directory so you dont need to store the .js file on your own server.
Plane9 - Home of the Plane9 3d screensaver/music visualizer
Challenge Trophies Won:

Offline valis

  • C= 64
  • **
  • Posts: 35
  • Karma: -6
    • View Profile
Re: Trippy swirly pattern generator!
« Reply #10 on: January 24, 2011 »
This is very pretty.  I'd like to see it implemented in C.

Offline Kirl

  • Senior Member
  • Pentium
  • ********
  • Posts: 1217
  • Karma: 230
    • View Profile
    • Homepage
Re: Trippy swirly pattern generator!
« Reply #11 on: January 24, 2011 »
I uploaded an updated version which should run slightly faster.

@ Xetick
Thanks for the suggestion, transparency in Flash can become quite slow but a nice colour gradient shouldn't be a problem. Where did you get the image from?

I'll live with setting the focus manually, I usually link to the swf directly for convenience sake. Thanks for the tip though!

@valis
If you (or anybody) feel like porting it, I'll post the source when I'm done cleaning it up a bit, the actual math is pretty straightforward.
www.kirl.nl
Challenge Trophies Won:

Offline LittleWhite

  • Senior Member
  • Amiga 1200
  • ********
  • Posts: 418
  • Karma: 31
  • It's me!
    • View Profile
Re: Trippy swirly pattern generator!
« Reply #12 on: January 24, 2011 »
With 69 particules ... it freezes O_o
Controls answer ... if I am passing something on the middle I saw the number (to 1 now ... ) but nothing else.

Some for 68.
Way to do it:
- Do some move ... increase to +60
- Do some move
- FREEZE

Second note:

Yes it's faster ... but the FPS counter not working for sure now ;)

I can freeze it with 34 too ... I have attached screenshot ;)
It's often when particles go in mass to the center
« Last Edit: January 24, 2011 by LittleWhite »
The demoscene will never die, never!

Offline Xetick

  • Atari ST
  • ***
  • Posts: 132
  • Karma: 80
    • View Profile
    • Plane9
Re: Trippy swirly pattern generator!
« Reply #13 on: January 24, 2011 »
Where did you get the image from?

It's from the next unreleased version of my visualizer Plane9. When I saw your flash effect I wanted to try to make something like it and 15 minutes later I had that image.

It's just a pixel shader/shader node
Code: [Select]
float4 PS_Program(PSInput pi) : COLOR
{
float2 p = -1.0 + 2.0 * pi.tex;
float3 col = _hsv2rgb(pi.diffuse.a, 0.5, 0.5);
return float4(col*in1.x, pi.tex.y*(1.0-abs(p.x)));
}

in1.x is a evaluated from a expression and sent into the shader "in1.x = min(1,0.5+beat(1)*5);". It makes it pulse to the beat of the music

That shader is then connected to a ribbon node that draws a number of ribbons using a expression
Code: [Select]
rnr = ribbonnr/numribbons;
radius = noise1(time)*1.8;
pos.x = sin(time+PI*2*rnr)*radius;
pos.y = cos(time+PI*2*rnr)*radius;
pos.z = 0;
col.a = rnr;
width = 0.05;

noise1 generates a 1d noise value using simplex noise. Just to create some random but controlled motion since I have no support for user input like you do.

The ribbon node is connected to a clone node that creates another copy and rotates it 180 degrees to create the mirror effect.

So not as nice movement as you have but it's something. You seems to have a form of rubber/string effect attached to the moving particles that creates quite a lot of the effect.
Plane9 - Home of the Plane9 3d screensaver/music visualizer
Challenge Trophies Won:

Offline Shockwave

  • good/evil
  • Founder Member
  • DBF Aficionado
  • ********
  • Posts: 17412
  • Karma: 498
  • evil/good
    • View Profile
    • My Homepage
Re: Trippy swirly pattern generator!
« Reply #14 on: January 24, 2011 »
Ah, it's nice and reminds me of lots of happy hours playing with Jeff Minters trip a tron in a dark room!
Shockwave ^ Codigos
Challenge Trophies Won:

Offline Kirl

  • Senior Member
  • Pentium
  • ********
  • Posts: 1217
  • Karma: 230
    • View Profile
    • Homepage
Re: Trippy swirly pattern generator!
« Reply #15 on: January 25, 2011 »
@LittleWhite
Does it actually come to a complete halt, or is it a temporary freeze? It can get really slow at points.

@Xetick
Yes, I use an array of xy points of which the 1st springs to the mouse, following points spring to each previous point. These form a ribbon which I copy and rotate. With an even number of ribbons the xscale of every other ribbon is flipped.

Plane9 looks great, love the rotating glowing lines!

@Shockwave
The name is enough to know I missed something great.
« Last Edit: January 25, 2011 by Kirl »
www.kirl.nl
Challenge Trophies Won:

Offline LittleWhite

  • Senior Member
  • Amiga 1200
  • ********
  • Posts: 418
  • Karma: 31
  • It's me!
    • View Profile
Re: Trippy swirly pattern generator!
« Reply #16 on: January 25, 2011 »
It freezes completeley ... I have wait aroud ... 3 minutes ...

EDIT: Ok ... forget about the issue ... was certainly Firefox / or my PC because I didn't restart it since a long time.
Now it's not bugging (even with 90 particles :))
Nice optimisation job
« Last Edit: January 26, 2011 by LittleWhite »
The demoscene will never die, never!

Offline Kirl

  • Senior Member
  • Pentium
  • ********
  • Posts: 1217
  • Karma: 230
    • View Profile
    • Homepage
Re: Trippy swirly pattern generator!
« Reply #17 on: January 26, 2011 »
That's weird, what browser are you using?  ???
Can you crash the first version as well?
www.kirl.nl
Challenge Trophies Won:

Offline LittleWhite

  • Senior Member
  • Amiga 1200
  • ********
  • Posts: 418
  • Karma: 31
  • It's me!
    • View Profile
Re: Trippy swirly pattern generator!
« Reply #18 on: January 26, 2011 »
That's weird, what browser are you using?  ???
Can you crash the first version as well?
GNU/Linux Ubuntu 10.04 / Firefox 3.6.13
But ... It was the first time that I get your app freeze. Maybe some memory issue with Firefox. Since I can't recrash it, and since the crash environment was: Don't switch off the computer during one week ...
(Youtube video were not starting ... so ... best is to restart the whole Firefox (which I have forgot to do before reporting the issue)
The demoscene will never die, never!

Offline Kirl

  • Senior Member
  • Pentium
  • ********
  • Posts: 1217
  • Karma: 230
    • View Profile
    • Homepage
Re: Trippy swirly pattern generator!
« Reply #19 on: February 22, 2011 »
I finished up this pattern thingy and slapped an ad on it, love to hear what you think.

Try it here!
« Last Edit: February 22, 2011 by Kirl »
www.kirl.nl
Challenge Trophies Won: