![]() ![]() 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. |
Details
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |