Pseudo Pixel Sorting

Real-time pixel sorting is too expensive, so i made a pseudo version instead.

Inspired by: https://www.shadertoy.com/view/tltyzB

Shader code
//MADE BY : @ahopness
//LICENSE : CC0
//COMATIBLE WITH : GLES2, GLES3, WEBGL

shader_type canvas_item;

uniform float sort :hint_range(0.0, 2.6)= 0.0;

void fragment(){
	vec2 uv = FRAGCOORD.xy / (1.0 / SCREEN_PIXEL_SIZE).xy;
	
	// Pseudo Pixel Sorting
	float sortThreshold = 1.0 - clamp(sort / 2.6, 0.0, 1.0);
	vec2 sortUv = vec2(uv.x, sortThreshold);
	
	// Curved melting transition
	vec2 transitionUV = uv;
	transitionUV.y += pow(sort, 2.0 + (sort * 2.0)) * uv.x * fract(sin(dot(vec2(transitionUV.x), vec2(12.9, 78.2)))* 437.5);
	COLOR = texture(SCREEN_TEXTURE, transitionUV);
	
	// Draw pixel sorting effect behind the melting transition
	if(transitionUV.y > 1.){
		COLOR = texture(SCREEN_TEXTURE, sortUv);
	}else{
		COLOR = texture(SCREEN_TEXTURE, uv);
	}
}
Tags
glitch, Pixel Sort, Post processing
The shader code and all code snippets in this post are under CC0 license and can be used freely without the author's permission. Images and videos, and assets depicted in those, do not fall under this license. For more info, see our License terms.

More from Ahopness

Gradient overlay post-processing shader

Pseudo Pixel Sorting V2

Gaussian Blur Functions for GLES2

Related shaders

Pseudo Pixel Sorting V2

Regionable Pseudo 3D

Sub-Pixel Accurate Pixel-Sprite Filtering

Subscribe
Notify of
guest

1 Comment
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Ninjakrom
2 years ago

How can use this shader?