# 2D displacement mapping for water effect

**URL:** <https://discourse.processing.org/t/2d-displacement-mapping-for-water-effect/3191>\
**Category:** Processing.py\
**Created:** [September 2, 2018, 12:01pm UTC](https://discourse.processing.org/t/2d-displacement-mapping-for-water-effect/3191 "2018-09-02T12:01:34Z")\
**Posts on this page:** 1\
**Showing post:** 4

<div class="post-metadata">

**Author:** ![solub](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/solub/32/333_2.png) [@solub](https://discourse.processing.org/u/solub)\
**Post date:** [September 2, 2018, 5:56pm UTC](https://discourse.processing.org/t/2d-displacement-mapping-for-water-effect/3191/4 "2018-09-02T17:56:28Z")

</div>

@WakeMeAtThree – Thank you ! It does look **very** similar to the effect seen on Solaas’s sketches. I’m all the more conviced that most of Solaas’s work relies on techniques learned from Patricio Gonzalez Vivo himself (they’re both from Buenos Aires).

@TheWizardBear – Hi, glad to hear you find the topic interesting. I’ve also implemented the warping function from Inigo Quilez’s article . Here’s a proof of concept in Processing (python mode) if you’re interested (much slower than a shader implementation of course).

 ![](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/e/e20e00a263213ab25aadc65a5b9a92a2b9b20579.jpeg)

```auto

def setup():
    size(1400, 900, P2D)
    
    loadPixels()
    for y in range(height):
        for x in range(width):
            i = x + y * width
            n = warp(x, y, .01, 255)
            pixels[i] = color(-n, n, n)
    updatePixels()
            
def warp(_x, _y, factor, n_range):
    n1 = noise((_x+0.0) * factor, (_y+0.0) * factor) * n_range
    n2 = noise((_x+5.2) * factor, (_y+1.3) * factor) * n_range
    q = PVector(n1, n2)
            
    n3 = noise(((_x + q.x * 4) + 1.7) * factor, ((_y + q.y * 4) + 9.2) * factor) * n_range
    n4 = noise(((_x + q.x * 4) + 8.3) * factor, ((_y + q.y * 4) + 2.8) * factor) * n_range
    r = PVector(n3, n4)
                
    return noise((_x + r.x * 4) * factor, (_y + r.y * 4) * factor) * n_range

```

There’s still a major issue that I can’t figure out: **how to displace the pixels from a picture accordingly with the warping**. It seems the displacement rules aforementioned (substracting a noise value to the x and y coordinates) don’t work here and I start to wonder if Solaas ever operated a traditionnal/real pixel displacement on these paintings.

---

_[View the full topic](https://discourse.processing.org/t/2d-displacement-mapping-for-water-effect/3191)._