<p>Your example images do not make the desired effect very apparent, but the opposite of a barrel distortion is a pincushion distortion:
<a href="https://i.sstatic.net/cD2a8.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/cD2a8.png" alt="enter image description here"></a></p>

<p>I found a <a href="https://www.shadertoy.com/view/ll2GWV" rel="nofollow noreferrer">fisheye shader on ShaderToy</a> which produces the following image:</p>

<p><a href="https://i.sstatic.net/hTDCV.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/hTDCV.png" alt="enter image description here"></a></p>

<p>By slightly modifying the shader code:</p>

<pre><code>// This shader is based on cafe's fisheye shader:
// https://www.shadertoy.com/view/ll2GWV

vec3 checker(vec2 uv){
    return vec3(abs(floor(mod(uv.x*10.,2.))-floor(mod(uv.y*10.,2.))));   
}

void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
    vec2 uv = fragCoord.xy*2. / iResolution.xy-vec2(1.);

    //------------------------------------------------
    // To use in Godot, port this section:
    //------------------------------------------------

    // I picked these somewhat arbitrarily
    const float BARREL = -1.0;
    const float PINCUSHION = 0.1;

    float effect = PINCUSHION; // Set effect to either BARREL or PINCUSHION
    float effect_scale = 1.0;  // Play with this to slightly vary the results

    /// Fisheye Distortion ///
    float d=length(uv);
    float z = sqrt(1.0 + d * d * effect);
    float r = atan(d, z) / 3.14159;
    r *= effect_scale;
    float phi = atan(uv.y, uv.x);

    uv = vec2(r*cos(phi)+.5,r*sin(phi)+.5);

    //------------------------------------------------
    // end relevant logic
    //------------------------------------------------

    fragColor = vec4(checker(uv),1.);
}
</code></pre>

<p>We can easily obtain <a href="https://www.shadertoy.com/view/wtt3z2" rel="nofollow noreferrer">the opposite effect</a>:</p>

<p><a href="https://i.sstatic.net/cZAYV.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/cZAYV.png" alt="enter image description here"></a></p>

<p>If this is not the exact effect you're looking for, I recommend playing around with the code a bit yourself. Change some signs from + to -, add scale factors and explore the possibilities. You may even stumble across a more interesting effect than what were you looking for.</p>

CC BY-SA 4.0
2019-12-21T19:51:12.460Z
Wait, does pincushion distortion actually crush inward? I always got the idea it just pulls the edges outward :P
aggregate1166877
CC BY-SA 4.0
2019-12-21T22:04:32.610Z
Please disregard my previous deleted comments, I was being a dumbass. Your solution does 100% what I need. I'll be creating a gist tonight which you may include in your answer if you'd like.
aggregate1166877
CC BY-SA 4.0
2019-12-22T07:13:10.567Z
Here is the gist for the final solution: https://gist.github.com/aggregate1166877/a889083801d67917c26c12a98e7f57a7 . I've added a preview to my question for the sake of completion.
aggregate1166877
CC BY-SA 4.0
2019-12-23T00:36:36.477Z
@aggregate1166877 Nice work! Glad my answer was useful. Thanks for sharing your final solution.
Dan
CC BY-SA 4.0
2019-12-21T19:19:10.070Z
2019-12-23T00:33:39.583Z
2019-12-23T00:33:39.583Z
Dan
<p>I am looking for a shader (or at least the right terminology) for crushing an image. It should be something very similar to barrel distortion, but instead of the center crushing outward to the edges, I want to edges to crush inward to the center.</p>

<p>So, this image:<br>
<a href="https://i.sstatic.net/AKqdd.jpg" rel="nofollow noreferrer"><img src="https://i.sstatic.net/AKqdd.jpg" alt="enter image description here"></a></p>

<p>instead of being deformed like this:<br>
<a href="https://i.sstatic.net/5eWvg.jpg" rel="nofollow noreferrer"><img src="https://i.sstatic.net/5eWvg.jpg" alt="enter image description here"></a></p>

<p>Should rather be deformed like this:<br>
<a href="https://i.sstatic.net/Sh5og.jpg" rel="nofollow noreferrer"><img src="https://i.sstatic.net/Sh5og.jpg" alt="enter image description here"></a></p>

<p>This will be used for a Godot project, but even regular shading language would be tremendously helpful. I tried modifying <a href="https://gist.github.com/quiglemj/971f4cec1b128c58b4864c5200bfc579" rel="nofollow noreferrer">this gist</a> to no avail.</p>

<h1>Edit</h1>

<p>Here is the final result using the accepted answer's solution:
<a href="https://i.sstatic.net/HRIq8.jpg" rel="nofollow noreferrer"><img src="https://i.sstatic.net/HRIq8.jpg" alt="enter image description here"></a></p>

<shader><mathematics>
Shader or formula that distorts inward
aggregate1166877
# Shader or formula that distorts inward

(Asked by: username_0 on 2019-12-21)

I am looking for a shader (or at least the right terminology) for crushing an image. It should be something very similar to barrel distortion, but instead of the center crushing outward to the edges, I want to edges to crush inward to the center.

So, this image:  
[![enter image description here](https://i.sstatic.net/AKqdd.jpg)](https://i.sstatic.net/AKqdd.jpg)

instead of being deformed like this:  
[![enter image description here](https://i.sstatic.net/5eWvg.jpg)](https://i.sstatic.net/5eWvg.jpg)

Should rather be deformed like this:  
[![enter image description here](https://i.sstatic.net/Sh5og.jpg)](https://i.sstatic.net/Sh5og.jpg)

This will be used for a Godot project, but even regular shading language would be tremendously helpful. I tried modifying [this gist](https://gist.github.com/quiglemj/971f4cec1b128c58b4864c5200bfc579) to no avail.

# Edit

Here is the final result using the accepted answer's solution:
[![enter image description here](https://i.sstatic.net/HRIq8.jpg)](https://i.sstatic.net/HRIq8.jpg)

**Tags:** shader, mathematics


---

## 1 answers

### Answer by username_1 on 2019-12-21. Score: 4 | Accepted answer

Your example images do not make the desired effect very apparent, but the opposite of a barrel distortion is a pincushion distortion:
[![enter image description here](https://i.sstatic.net/cD2a8.png)](https://i.sstatic.net/cD2a8.png)

I found a [fisheye shader on ShaderToy](https://www.shadertoy.com/view/ll2GWV) which produces the following image:

[![enter image description here](https://i.sstatic.net/hTDCV.png)](https://i.sstatic.net/hTDCV.png)

By slightly modifying the shader code:

```
// This shader is based on cafe's fisheye shader:
// https://www.shadertoy.com/view/ll2GWV

vec3 checker(vec2 uv){
    return vec3(abs(floor(mod(uv.x*10.,2.))-floor(mod(uv.y*10.,2.))));   
}

void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
    vec2 uv = fragCoord.xy*2. / iResolution.xy-vec2(1.);

    //------------------------------------------------
    // To use in Godot, port this section:
    //------------------------------------------------

    // I picked these somewhat arbitrarily
    const float BARREL = -1.0;
    const float PINCUSHION = 0.1;

    float effect = PINCUSHION; // Set effect to either BARREL or PINCUSHION
    float effect_scale = 1.0;  // Play with this to slightly vary the results

    /// Fisheye Distortion ///
    float d=length(uv);
    float z = sqrt(1.0 + d * d * effect);
    float r = atan(d, z) / 3.14159;
    r *= effect_scale;
    float phi = atan(uv.y, uv.x);

    uv = vec2(r*cos(phi)+.5,r*sin(phi)+.5);

    //------------------------------------------------
    // end relevant logic
    //------------------------------------------------

    fragColor = vec4(checker(uv),1.);
}

```

We can easily obtain [the opposite effect](https://www.shadertoy.com/view/wtt3z2):

[![enter image description here](https://i.sstatic.net/cZAYV.png)](https://i.sstatic.net/cZAYV.png)

If this is not the exact effect you're looking for, I recommend playing around with the code a bit yourself. Change some signs from + to -, add scale factors and explore the possibilities. You may even stumble across a more interesting effect than what were you looking for.

> **Comments:**
> **username_0**: Wait, does pincushion distortion actually crush inward? I always got the idea it just pulls the edges outward :P  
> **username_0**: Please disregard my previous deleted comments, I was being a dumbass. Your solution does 100% what I need. I'll be creating a gist tonight which you may include in your answer if you'd like.  
> **username_0**: Here is the gist for the final solution: https://gist.github.com/username_0/a889083801d67917c26c12a98e7f57a7 . I've added a preview to my question for the sake of completion.  
> **username_1**: @username_0 Nice work! Glad my answer was useful. Thanks for sharing your final solution.  

---

