Nearly daily [EFFECTS] by Somebody - neat things + big GIFs

Hi, all!

Edit Jan 2017 by Kyatric :

The OP seems to not be active on our forums.

Nevertheless, the user adcornaglia has made a backup of the files that can be found : https://drive.google.com/open?id=0B5HnHqVYzkImck1uSmlkUGJ5VHM

As long as adcornaglia will be around, those effects should be accessible from here.

Decided to put all of my little freak children in a single post so it's easier to manage. I have been trying to grasp shaders, sometimes even successfully so here are some of the results:

[NEW] I listened to some advice in the thread and there's now a distro folder:

https://www.dropbox.com/sh/vmvnuiiis0fr ... _Gd7a?dl=0 - always find the latest versions all together in easy to use .c2addon files.

[NEW] Nearly all the shaders have had small fixes and improvements, i.e. Dissolve now uses a different random number system, flag now waves outwards (better for flame fx and such), etc.

The animations only show what happens when you adjust settings, the shaders themselves are not natively animating. So you get all the control.

Adjust HSB

An alternative to the often glitchy (try +75% hue) HSL shader:

Trim

Trim the image by a certain percentage:

NOTE: This simply ceases to draw the image beyond the percentage, so if you layer the effects something strange might happen.

Shift

Shifts the image inside its frame by given pixel amount:

This one is pretty cool - you can do all sorts of long thing effects, like shown in the demo image, but also do rather nice screen shake effects when used as a layer effect.

Dissolve

Basically my implementation of Photoshop's dissolve blending mode:

Dots

Show only every n-th dot on x and y axis:

Flag

Distort the image in a flag-like fashion:

How is this different from some other warpy shaders? It gets stronger towards the end of the sprite. Also fairly easy to use parameters - set the numbr of waves, set an amplitude (how far the rightmost pixels will be pushed up and down) and set a total time for a full up/down cycle (in seconds) - done.

In the example image above the first column has the same wave amount (1) and time (2 seconds) - what changes is the amplitude - as you can see that pointy end barely moves in the first one and goes all the way for the third one. The others just have different wave counts and amplitude.

Seamless

Shift with repeating - simple!

Racetrack

Shift only X pixels with repeating + pseudo motion blur = NEATNESS:

https://dl.dropboxusercontent.com/u/132 ... index.html (Hold right to speed up)

Can also be used as just pseudo motion blur without shifting anything.

Frosted

Frosty!

Scale

The vinyls are on a layer with this effect applied at 100% width and 50% height. Bad things will happen if something is over the edge (or maybe you want that sort of an effect actually). As is the way of life for Shaders it scales towards a shader origin point of bottom left corner. NOTE: Will look all sorts of wrong in the editor so either keep it at 100% or enable/change values on startup.

Skew and Skend

For when that texture just cannot stand straight. As with Flag I base the "logic" of the shader around C2's approach to angles and object bases - so if our base is left-center and then we rotate an item upwards so it stands "upright" the skew happens on the vertical axis while it is "sideways". Just check the .capx, it's simple, really.

Tabletop

It basically shifts the image in "perspective" just with 0 regard to any perspective laws. You can use it as a poor man's taper if you wish. Not bad for interfaces as seen in the example GIF.

Cinematic

Might be neat for a modern fps style GUI or just making things breathe. Accepts positive and negative values.

Scroll

Same as Seamless, but automated. Since I like to keep the math inside the shader at a minimum you have a simple value - amount of time in seconds it takes to scroll the whole width or height of the texture. It accepts negative values to change the direction of the scrolling and 0 means it stays still.

Twist

Demoscene says hi! Adjustable amount of twists, time and shading of the dark side. Quite likely to make some neat effects possible.

Drop Shadow

A simple pixel offset drop shadow effect with shadow opacity. Best used on a transparent layer. Might get an updated/improved version soon.

Enjoy and please comment with suggestions/bugs/better code.

[RESERVED]

[RESERVED] Too enthusiastic? Perhaps, but better safe than sorry

Thanks You Somebody, that's really a generous contribution. All are cool effects but the shift one interested me the most .

Beside that your StuffGEN looks great, good luck.

Somebodys been busy.

I must say trim and shift are "neat"

If you're looking for other shaders to try, how about skew?

newt - was actually just one my mind! Not that hard to do. But what could be interesting would be a shader that kind of skews things more and more the further they are from top - would be easy to make things like flames, flags, etc.

But that will have to wait a bit.

Shift and Trim look like they could be very useful! I can see people using dissolve for transitions and deaths, rather then just fading. And the color shader... well, you know I've been waiting for that one! haha

Whoa, shift is awesome!

I swear, I few minutes ago I was thinking how useful it would be to be able to 'offset' an image. I click on this thread randomly, and there it is.

Spooky.

It's like...Somebody is in my brain...

Seriously though, all these effects are great. Thanks for sharing.

It's like...Somebody is in my brain...

BOOO!

Seriously though, all these effects are great. Thanks for sharing.

Thanks, I'll try to do more... in fact just did - say hello to... DOTS!

It basically lets you set every n-th pixel to show, vertically and horizontally, so it's like a very configurable scanline effect. Set the grid to 1x2 and you get classic scanlines:

Set it to 2x1 and you get vertical scanlines:

Or do both at 2x3 and throw some glow effects on top:

Ah, fond memories of Starcraft custcenes...

Added to the full listing above.

Thanx for these awesome Addons Somebody!

Perfect for my 2015 retry game building cycle.

> It's like...Somebody is in my brain...

>

BOOO!

> Seriously though, all these effects are great. Thanks for sharing.

>

Thanks, I'll try to do more... in fact just did - say hello to... DOTS!

It basically lets you set every n-th pixel to show, vertically and horizontally, so it's like a very configurable scanline effect. Set the grid to 1x2 and you get classic scanlines:

Set it to 2x1 and you get vertical scanlines:

Or do both at 2x3 and throw some glow effects on top:

Ah, fond memories of Starcraft custcenes...

Added to the full listing above.

And of course, the game I'm working on now is an old arcade game...and I've been trying to find a good scanline solution.

This is getting seriously freaky now.

Cool effects!

Cool effects!

Thanks! I do wish a pro like you gave them a quick look and deemed them ok or not, though.

For example, if I use Trim before your outlines effect then the outlines work, but are trimmed just like the sprite, but in screen-space - i.e. if the sprite is 50% width then when it's located in the left half of the screen we gut full outlines and in the right part - nothing. Weird, but then I have little idea how these beasts work under the hood.

Best I can tell it has to do with the "extend-box" property in the effect's xml file. When it's 0 the texture space (0.0 to 1.0) is from the left of the sprite to the right. But when it's non zero 0.0 is the left of the screen and 1.0 is the right. Also the following effects will inherit the same texture space.

Here are all the variables that C2 sets for effects to use:

pixelWidth
pixelHeight
vec2 destStart
vec2 destEnd
layerScale
layerAngle
vec2 viewOrigin
vec2 scrollPos[/code:1mk58yqb]

I think destStart and destEnd are the topleft and bottomright texture coordinates or something like that. Could be of use.

Cool, thanks for the info, this seems really helpful. I have some more shaders in mind - one way to overcome that problem would be an "inline" effect, I just cannot figure out how to draw "in" a color based on alpha.

Also while searching on the web there's barely any decent beginner's material for fragment shaders, especially for "pure" ones, not linked with vertex shaders. The SDK has that little example and that's it, I guess. Somewhat tough without experience...