Implementing a paint brush

I am trying to implement some webgl based painting. I don’t want to use fabricjs since i didnt have good results with bouncing the data between the two canvases.

I got some mileage but i’m still confused about a few things.

This paper mentions opacity and flow, but doesnt really elaborate on how to do it.

The only way i can think of applying both flow and opacity is by rendering the stroke to another buffer. The points themselves would be be blended with each other, and then the whole buffer blended with the main buffer.

Does anyone know some good references for this?

Current results:

1 Like

I don’t have a good reference but I have a BAD reference. :wink:

This is a mesh painting tool I wrote a while ago that handles painting on textures.
It’s a gnarly ball of code but maybe you can find some inspiration from it:



Heh, i’ve built photoshop :smiley:

I ended up using another buffer to construct the stroke in, allowing me to use both the flow and strength. Still find it very hard to control the “blurriness” or “hardness”, but i havent tried many other math functions:


Naaaice lookin good!