ArtRage 5 Product PageArtRage Lite Product PageArtRage for iPad Product PageArtRage for Android Product PageArtRage  Android Oil Painter Free Product PageArtRage  Free Demos Page

Results 1 to 7 of 7

Thread: gradient fills: how to do

  1. #1
    Guest

    gradient fills: how to do

    Hi. I'm trying to implement some non-standard math, more sophisticated, than bicubic interpolation into computer graphic. I see there at least one serious hole, concerned gradient fills. This op now is based on triangular meshes and linear brushes. If you tried to play with gradient meshes from Adobe, surely you'll hardly think of them as a convenient thing. So, I can offer something better. If someone has an interest in such thing, contact me.
    Andrew Matseevsky, Kamchatka, Kluchi-1., matseevsky@rambler.ru
    Attached Images Attached Images  

  2. #2
    Join Date
    Nov 2007
    Location
    France
    Posts
    11
    Hi Andrew,

    Gradient meshes are not the only advanced techniques for generating complex gradients. Many work has been done on that topic during the last 20 years in computer graphics.

    It I look at your sample image, I see a set of "seed" points for which (I guess) the user fixes some color. To get the color of the gradient at each point (I guess again), you compute the influence of each seed point, using some isotropic distance function (which explains why the gradient has a circular shape in the neighborhood of each seed point) and then generate the blended color by performing a barycentric sum, weighted by the influence function, of the seed point colors. Does it look something like that?

    This is rather a classical technique, that was first proposed in 1981(!) in the field of 3D modeling, and later adapted to 2D blending. Several flavors of the technique exist that only differ on the way (and the efficiency) the blending is performed. If I remember well, the most efficient technique is based on discrete distance images.

    I didn't play with Adobe's implementation of mesh gradients, so I cannot claim whether it is intuitive or not. However, the clear advantage of mesh gradients is that you've got a much better control of the direction of the blending than with a pure distance-based blending. For instance, in your picture there is some magenta blending from one leave to another (see picture below) which is usually not considered as nice-looking, as the blending is expected to follow the outline of the shape and not cross the edges.
    Attached Images Attached Images  

  3. #3
    Guest
    Quote Originally Posted by scirocco
    Hi Andrew,

    Gradient meshes are not the only advanced techniques for generating complex gradients. Many work has been done on that topic during the last 20 years in computer graphics.

    It I look at your sample image, I see a set of "seed" points for which (I guess) the user fixes some color. To get the color of the gradient at each point (I guess again), you compute the influence of each seed point, using some isotropic distance function (which explains why the gradient has a circular shape in the neighborhood of each seed point) and then generate the blended color by performing a barycentric sum, weighted by the influence function, of the seed point colors. Does it look something like that?

    This is rather a classical technique, that was first proposed in 1981(!) in the field of 3D modeling, and later adapted to 2D blending. Several flavors of the technique exist that only differ on the way (and the efficiency) the blending is performed. If I remember well, the most efficient technique is based on discrete distance images.

    In fact, earlier. I realized how it could be done in 1982, but later I found one article, dated in 1975. My method is based on tinfoil analogue. Let's try to imagine a flat table and set of nails, hammered into it Each nail's head has its own elevation above table's surface. Let's take a thin flexible sheet of steel and press it to these nails. Each point of such tinfoil after it will have some elevation above the table's surface, and can be treated as one of color components.

    I didn't play with Adobe's implementation of mesh gradients, so I cannot claim whether it is intuitive or not. However, the clear advantage of mesh gradients is that you've got a much better control of the direction of the blending than with a pure distance-based blending. For instance, in your picture there is some magenta blending from one leave to another (see picture below) which is usually not considered as nice-looking, as the blending is expected to follow the outline of the shape and not cross the edges.
    I cannot agree. What you see here is the only result of small number of control points (vertices). There is no edge between neighbored leaves, so if someone wants to have differently colored leaves, this one should draw an edge between them. The main advantage of my technique compared with gradient meshes is much smaller number of control points (to say nothing about full absence of meshes). 2D case is a complete analogue with drawing curves. One may draw a circle using polylines or make the same op with Bezier curves. Polylines offer «much better control», course, but require so much control points, that result hardly could be edited manually.

  4. #4
    Join Date
    Nov 2007
    Location
    France
    Posts
    11
    In fact, earlier. I realized how it could be done in 1982, but later I found one article, dated in 1975. My method is based on tinfoil analogue. Let's try to imagine a flat table and set of nails, hammered into it Each nail's head has its own elevation above table's surface. Let's take a thin flexible sheet of steel and press it to these nails. Each point of such tinfoil after it will have some elevation above the table's surface, and can be treated as one of color components.
    Ok, this is a bit different from distance field gradient. Your technique is know as "inverse distance weighting" (originally proposed by Donald Shepard in 1968) which also exists in many different flavors, and has been intensively used in many scientific fields for scattered date interpolation (although I don't know a specific application for generation of color gradients.

    I cannot agree. What you see here is the only result of small number of control points (vertices). There is no edge between neighbored leaves, so if someone wants to have differently colored leaves, this one should draw an edge between them.
    That's not what I meant. Here is a picture to explain my concern. When computing the gradient color at point P, the influence of the source point S should be weighted according to the geodesic distance (in yellow) rather than the euclidian distance (in orange), because the outline of the leaf should not be crossed. When you use scattered data interpolation, your color blending function is not aware of the existence of this outline, and of course totally ignores it. Consequently, the color of S has too much influence at P, which generates the magenta color bleeding around P. In your example, the result is not too bad, because the difference between the yellow and the orange dstance is not too large, but in other examples (spirals, for instance) it can totally ruin the expected gradient.

    Again, I don't know the gradient mesh implementation made by Adobe, but gradient mesh should handle such a case quite easily, and should not require many much more seed points as in your example.
    Attached Images Attached Images  

  5. #5
    Join Date
    Nov 2007
    Location
    France
    Posts
    11
    The example posted by Sweedie is very interesting. Thanx a lot, Sweedie.
    Imagine a similar mesh but which better mimics the shape of the area you have to fill (I've quickly oversketched Sweedie's picture), then the color bleeding would be very intuitive, with no unexpected color bleeding.
    I don't know is Adobe's gradient mesh is similar than this, but such a gradient based on trangular/quadrangular mesh is quite easy to implement and is extremely efficient to compute, as the color of each pixel only depends on 3 or 4 surrounding source points.
    Attached Images Attached Images  

  6. #6
    Guest
    [quote="scirocco"]
    Ok, this is a bit different from distance field gradient. Your technique is know as "inverse distance weighting" (originally proposed by Donald Shepard in 1968) which also exists in many different flavors, and has been intensively used in many scientific fields for scattered date interpolation (although I don't know a specific application for generation of color gradients.

    I do not know, what in particular means "inverse distance weighting", but I do have a solid guess, that my method differs from what are you talking about. Weight of a control point isn't a monotonous function of a distance, moreover, its sign changes.

    That's not what I meant. Here is a picture to explain my concern. When computing the gradient color at point P, the influence of the source point S should be weighted according to the geodesic distance (in yellow) rather than the euclidian distance (in orange), because the outline of the leaf should not be crossed. When you use scattered data interpolation, your color blending function is not aware of the existence of this outline, and of course totally ignores it. Consequently, the color of S has too much influence at P, which generates the magenta color bleeding around P. In your example, the result is not too bad, because the difference between the yellow and the orange dstance is not too large, but in other examples (spirals, for instance) it can totally ruin the expected gradient.

    You are right, partly, but this prob could be solved in different ways. For example, it is possible to draw an additional line and put some vertices on it. These vertices will impact on two regions.

    Again, I don't know the gradient mesh implementation made by Adobe, but gradient mesh should handle such a case quite easily, and should not require many much more seed points as in your example.
    You should make some experiments with such method of painting, may be it'll change your mind. I can send you a demo variant.
    A

  7. #7
    Guest
    Quote Originally Posted by Sweedie
    This is a quick gradient mesh made in Serif Draw X2. Quick and easy and very efficient...
    But why do you think, that the same result cannot be obtained without meshes?!!! Look at one small sample (and, by the way, if you wanna, I send you my demo to play with). To paint it I neded less than one minute. Sorry I'm not a painter, I could show you something more impressive.
    Attached Images Attached Images  

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •