The system dynamically creates bubble particles and destroys them when they reach the edge of the water. To bring those bubbles back, I created an entirely different system which leverages Unity’s job system for particles. I erased these when we created the heightmap. If you have a keen eye, you may have noticed that the original concept art has some bubbles in it: We map heightmap bands to green colors, and make it scroll much more slowly. We can also use this technique for poison water. For deep water, we simply create a new material which samples from the same heightmap values, but maps them to darker blue values. The shader exposes the colors which each band is mapped to. Deep WaterĬhanging from normal water to deep water is very simple. This heightmap would have to be manually painted, and I’m not sure of the technique we’d use to do so. For instance, I applied a uniform blur to the heightmap, which causes us to lose the high-frequency details, like the small spots, which would contribute more detail. There’s still some work that could be done to make this better. Honestly, it’s a matter of taste which you prefer - the more regular noise or the less-regular one. I think it does a better job of replicating the style present in the concept, though the texture filtering can make it kind of blurry when closer-up. Using some techniques from a GDC talk from blizzard, I blend together two samples from that, scrolling in different directions/speeds. I ended up ditching the perlin noise, and instead chose to use the blurred heightmap shown in that 4-step image above - this one: Perlin noise wasn’t generating the long, flowing shapes in the original concept art. It doesn’t look bad, but I had a lot of trouble with this approach appearing too regular across large bodies of water. If we grab a perlin noise sample at each point on the surface of the water and scroll this over time, we can get something that’s close to what we want: My first go-to for this was perlin noise. Now that we have a method to translate a heightmap into a bunch of bands of color, we can go about procedurally generating a heightmap that bubbles and froths a bit like real water. To draw isolines in our water shader, I use a method inspired by this shadertoy. Note that these “contours” of height are commonly known as isolines. Divide the range of values (0 to 1) by the number of bands: 0 -> 0.2, 0.2 -> 0.4, etc.In our case, if you inspect the original image, you’ll see that there’s only three shades of blue which alternate across the bands. This affects the thickness of lines in the final image. We can work backwards from the final image to the first one by applying the following algorithm: You can think of the final texture as a heightmap where 0 (full black) is a valley, and 1 (full white) is a peak. The previous texture, blurred, and with some color adjustments for tiling.Each band of color assigned a grayscale value from 0 to 1.The original texture with each band of color clearly separated using black/white.Once we start thinking of these as bands of heights, then we can think of the water texture itself as a heightmap: By contour lines, I mean the lines laid on top of a map to denote height: Instead of imagining the water as bands of color, start imagining it as a bunch of contour lines. The immediate feature that sticks out is the even bands of alternating blue colors. How can we achieve those effects while retaining the spirit of the concept? But it’d also look very uninspired if we simply scrolled the texture across the surface of the water. Obviously, we don’t want this texture to be a static, unmoving image - water moves. Here’s the main texture that is projected onto the water surface in the above image: There are quite a few effects forming the water in this concept art. I was tasked with implementing the style in this piece of concept art: This article is about the water shaders that I created for this project. Read the first one, about ground tiles, here. This is the second in a series of articles about the tech art. Wizard with a Gun isn’t out yet, but there’s already tons of work I’ve done that I’m really proud to show off. Since January 2020, I’ve been working on Wizard with a Gun, doing tons of core engineering work, gameplay implementation, and tech art. I’m Ed Lu, senior engineer at Galvanic Games. (), but your browser doesn't support mp4s! Tech Art of Wizard with a Gun - Water Jun 11, 2022
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |