Copycat Challenge #5

[SabrinaVerhage]

Alright, also picking up on @sableRaph’s idea; a new copycat challenge!

I’m going to the great Raven Kwok (check out his work if you don’t know it already)

Same rules as usual: reproduce the original as faithfully as possible without looking at the source code (if available). Post your result here, as a gif and patch.

I don’t know if this one is too much work, I’m trying with the RoundRect node…

Source: http://ravenkwok.tumblr.com/post/152219992935

Good luck :)

[dominikKoller]

Nice one!
Well let’s see…

[dominikKoller]

I guess it’s a start:

CCC5.zip (7.1 KB)

Drawbacks:

• poor performance and spreading
• animations not nicely timed
• not many small squares

[SabrinaVerhage]

COOOOL I didn’t know about Treemap!

meh this is how far I got; many drawbacks & a bug

CopyCatChallenge5.zip (8.7 KB)

[dominikKoller]

Nice!

My biggest problem were actually the white outlines, I was thinking we should have a good method to draw outlines for any shape…

[tonfilm]

the outline can be faked with a second white roundrect behind the black one, needs good anti-aliasing though:

CCC5_Mod.zip (17.5 KB)

now the subdivision and animation loop need some fine tune and it should be very close.

[vux]

Another version with (quite heavily modified):

Few bits of interest for people who want to study the patch:

• Move to dx11
• Replace the treemap by quadtree (since treemap doesn’t make much sense as it produces rectangles, whereas original is squares only)
• Make animations properly timed (so can set start end times for rotation, explode and move back)
• Explosion and move back uses tweeners and time only, to avoid time based filters.
• Use Rasterizer for Depth Bias, so no need to tweak z (also Slope Scaled depth bias is important in that case, to amplify some parts)
• Use a single roundrect, and reapply inner/outer radius in vertex shader instead, so can use instancing (and avoids rebuilding 1000 round rects every frame, which is insanely slow)

PS: Animation is not seamleass here as would have needed to record a longer gif, but the patch version is

CCC5_Mod_dx11.zip (198.9 KB)

[gregsn]

Just did a dx11 shader that intersects quad and circle, which looks a bit different as the roundrect. Didn’t bother about the rest. Use it if you like!

NotARoundRect.zip (28.6 KB)

[everyoneishappy]

That’s interesting Greg… Is it using the FunctionLinkingGraph implementation from sharpDX? have any code could have a peek at?

[gregsn]

it’s just an experiment without a proper repo. the code is here for now: https://github.com/gregsn/dx11-vvvv/tree/shaderGraphTest/ShaderGraph and yes i know that there are already texturefx and instance noodles and all these wonderful modular node sets for programming the gpu. so it’s really just a stupid experiment… edit: no it is not based on FunctionLinkingGraph. i wasn’t aware of that. it compiles to hlsl directly.