Single Layer Water | 5-Minute Materials [UE4/UE5] — Transcript

Full transcript

1. 0:00[Music]
2. 0:05[Music]
3. 0:11hello and welcome back to five minute
4. 0:13materials the show where we demystify
5. 0:14every node in the unreal engine material
6. 0:16graph today
7. 0:18we're looking at the single layer water
8. 0:20shader model so
9. 0:23the first thing that we're going to do
10. 0:25is we're actually going to disable my
11. 0:27cell shader post processing um because
12. 0:31you know not everyone is using a global
13. 0:33cell shader so we're going to do this
14. 0:35from a regular person's perspective so
15. 0:39the single layer water node let's just
16. 0:41create a plane which is going to
17. 0:43simulate our water and we're going to
18. 0:46create a new material apply that to this
19. 0:49so the first thing we do in order to
20. 0:51enable the
21. 0:52single layer water
22. 0:54stuff
23. 0:55is we're going to go to its shading
24. 0:57model and instead of default lit we're
25. 0:58going to go all the way down the bottom
26. 1:00and click single layer water
27. 1:02now you're going to be greeted with an
28. 1:04error straight away that is to be
29. 1:06expected so what we're going to do is go
30. 1:08single layer water material output now
31. 1:10this i'd probably just sit it underneath
32. 1:12your regular material output stuff now
33. 1:16let's just get some
34. 1:17stuff going if we just put zero in the
35. 1:20base color we're gonna put zero in the
36. 1:21opacity
37. 1:23um we'll put
38. 1:25one in the refraction uh if we actually
39. 1:28just put zero in the absorption or
40. 1:30something so we've created a a flat
41. 1:33plane of nothingness
42. 1:36what we're going to do now is create a
43. 1:38parameter this is going to be called our
44. 1:41water
45. 1:42absorption
46. 1:44absorption value after this we're going
47. 1:48to add a
48. 1:49multiply
49. 1:51uh we're going to call this the water
50. 1:54murkiness i guess is a good a good
51. 1:57way to think about it
52. 1:59uh and then after this we're gonna just
53. 2:00divide it by a hundred and the reason
54. 2:02we're dividing it by 100 is because this
55. 2:05has to be a really small number and it
56. 2:07can just be a real penis in the anus to
57. 2:09work with small numbers um with
58. 2:12parameters and stuff so what we're going
59. 2:14to do we're just going to chuck that
60. 2:15into the absorption coefficient and
61. 2:17we're going to select a slightly red
62. 2:20color here now because this is like
63. 2:21based on physicalness and stuff this is
64. 2:24actually saying which wavelengths of
65. 2:27light do we want to absorb in the water
66. 2:30so the color will end up being the
67. 2:32opposite of this one now you can see
68. 2:35we've already got something that looks
69. 2:37kind of half decent and if we move this
70. 2:39up you can see that the deeper something
71. 2:41is
72. 2:42the more
73. 2:43red light it's going to absorb so if
74. 2:46it's very shallow it's going to look
75. 2:47like this if it's up here it's going to
76. 2:49look like that
77. 2:50our murkiness parameter can adjust sort
78. 2:53of the
79. 2:54strength of that
80. 2:55um so if we kind of put it right here
81. 2:58where we've got this like nice rock and
82. 3:00put the murkiness all the way up then
83. 3:02you can see that you know it's doing
84. 3:04something uh go team
85. 3:06now this might be all that you need for
86. 3:09your water you might only need to use
87. 3:11absorption coefficient um there is the
88. 3:14scattering coefficient which is very
89. 3:16similar so we've now got water
90. 3:18scattering set up and that's just going
91. 3:20into the water scattering coefficients
92. 3:22thingamajig uh we can change the color
93. 3:25of this to you know blue or something
94. 3:28and then adjust the
95. 3:30intensity of it now this kind of
96. 3:33i mean you can kind of see what it's
97. 3:35doing it's uh it's scattering the light
98. 3:38um
99. 3:40underneath the surface and obviously we
100. 3:42don't want that too strong
101. 3:45but
102. 3:47you know a lot of the time you might not
103. 3:49need this it's it's kind of an extra
104. 3:52step uh you can kind of see what it's
105. 3:54doing here with the shadow a lot of this
106. 3:56is just you know experiment with it
107. 3:58yourself see what you can come up with
108. 4:00hopefully i've just given you the the
109. 4:02tools needed to start you know messing
110. 4:05around with it now there are some other
111. 4:08bits here there's the phase g which
112. 4:10takes a negative one to one value
113. 4:13um i've never touched this i'm guessing
114. 4:15that the phase g input has something to
115. 4:18do with kind of creating like chromatic
116. 4:20aberration
117. 4:21uh like you know the the direction of
118. 4:24the scattering that's going on
119. 4:26um and then the color scale behind water
120. 4:29uh basically this is used for things
121. 4:31like uh caustics and stuff caught core
122. 4:35sticks caustics
123. 4:37um so we just pump this up a little bit
124. 4:40and you'll see that yeah it's kind of
125. 4:41lightening everything
126. 4:44behind the water um you might have to
127. 4:46use some like bump offset or something
128. 4:48in order to get this looking nice and
129. 4:50obviously you'd want to you know animate
130. 4:51this and blah blah but for now we're
131. 4:53going to ignore that
132. 4:55if you do leave this blank and these two
133. 4:58blank your instruction count will be
134. 5:00lower then you can see we jump from 535
135. 5:03to 552 instructions so
136. 5:06you do save a little bit of juice by
137. 5:08keeping them at zero um
138. 5:10for stylized water this is basically all
139. 5:13that you would probably maybe need so
140. 5:16that's kind of what it does do the
141. 5:18single layer water side of things you
142. 5:20know the absorption and the blah blah
143. 5:22those nodes they basically replace the
144. 5:24depth fade that you'd be using on like a
145. 5:26translucent material but one of the
146. 5:28advantages of this is that this is
147. 5:30actually an opaque material it's doing a
148. 5:32separate pass
149. 5:34that renders
150. 5:35underneath
151. 5:36um and then i guess it kind of projects
152. 5:39it onto the top layer so now i guess
153. 5:41what we're going to do is we're going to
154. 5:43run over what the other
155. 5:45inputs can be used for for things like
156. 5:48you know water for example the color up
157. 5:51here isn't really gonna change much you
158. 5:53know if i put this to one
159. 5:55it hasn't actually changed anything and
160. 5:57that's because our opacity is at zero so
161. 6:00if we got a texture
162. 6:02uh and it was like cloud or something
163. 6:06and
164. 6:06let's run it through like a contrast
165. 6:09and we're gonna put one into that
166. 6:11maybe two into the contrast and then we
167. 6:13put that into the opacity
168. 6:15then some parts of this are gonna be
169. 6:18zero opacity and other parts are gonna
170. 6:21be one opacity let's actually put this
171. 6:23up a little bit higher so this is what
172. 6:25you'd be using for something like foam
173. 6:27foam on the water
174. 6:31the
175. 6:32refraction it actually works a little
176. 6:35bit weirdly i found that 1.033
177. 6:40is a good refraction index to kind of
178. 6:43start with even though
179. 6:451.33 would be more appropriate for
180. 6:47something like water and so the
181. 6:48refraction interacts with the normal
182. 6:52uh
183. 6:53input output as usual
184. 6:55let's just grab a
185. 6:57water
186. 6:59normal map
187. 7:00there we go let's grab another one
188. 7:03let's grab a panna
189. 7:05let's put that in there and this in
190. 7:08there
191. 7:09and we'll make this one go 0.1 and this
192. 7:12one 0.01 in the other thing we're gonna
193. 7:16grab text codes
194. 7:18pump that into one of them and just make
195. 7:19this one like 1.73 times
196. 7:22smaller uh now i just compiled that
197. 7:25without actually plugging these in so
198. 7:26we're going to go blend angle corrected
199. 7:28normals and we'll blend these two
200. 7:30together and now we're just going to
201. 7:32chuck that into the normal
202. 7:34[Music]
203. 7:35cool you can see we have some
204. 7:38you know waviness
205. 7:40um if i had put this up higher like 1.33
206. 7:45then it kind of looks a bit crazy i mean
207. 7:47maybe that is correct but
208. 7:49it's just
209. 7:51it's just not as nice looking
210. 7:53i'm going to get rid of this color and
211. 7:55stuff as well because it's really
212. 7:57annoying me we'll put zero in the
213. 7:59opacity
214. 8:00uh so one last little tip that i have is
215. 8:02if you're doing anything like world
216. 8:04position offset to make you know ripples
217. 8:07appear around here and stuff well
218. 8:09position offset isn't actually going to
219. 8:10affect the normals so what you can do is
220. 8:13a little hacky method if we were doing
221. 8:15something like distance to
222. 8:17near a surface if we wanted to do
223. 8:19something like shore ripples
224. 8:22um you can actually just add to the
225. 8:25refraction index um to kind of fake
226. 8:29these ripples having bumps obviously
227. 8:31like these don't actually have any any
228. 8:33bumpiness
229. 8:34but you know it obviously gives the
230. 8:36effect if it was a little bit slower
231. 8:39yeah damn
232. 8:40uh five to four times slower so you can
233. 8:43see now that it kind of looks like this
234. 8:45is uh
235. 8:46doing that thing
236. 8:48that everyone likes
237. 8:50so that is the single layer water node a
238. 8:54very quick rough explanation hopefully
239. 8:57that's enough to get you started
240. 8:58using it um it can seem very convoluted
241. 9:02at first but hopefully this kind of
242. 9:04gave you some ideas of you know how it
243. 9:06can be used so just as a little example
244. 9:09of what we can do with this shader model
245. 9:11um here i've got some clear
246. 9:14i guess lake water pond water it's got
247. 9:17this algae stuff on top of it and you
248. 9:19know i can skim that off
249. 9:21this is all a part of my landscape
250. 9:23interaction system and whatnot so this
251. 9:25algae is
252. 9:26full opacity the water is zero opacity
253. 9:30i've got these ripples around you know
254. 9:32distance fields and that kind of stuff
255. 9:34if you want to know how to do this thing
256. 9:35with the distance fields a bit better
257. 9:37check out this tutorial here in which i
258. 9:39explain how distance fields can be used
259. 9:43um
260. 9:44and yeah we've got this foam that you
261. 9:46know
262. 9:48appears when the when the player moves
263. 9:49and that kind of stuff if we go to this
264. 9:52level here
265. 9:54uh you can see that i've actually set up
266. 9:55some proper waves and stuff and i've got
267. 9:58these nice foam trails that are all a
268. 10:00part of my um
269. 10:01my interaction system and that kind of
270. 10:03stuff
271. 10:04um
272. 10:06and you know same thing as the character
273. 10:08moves through we get these ripples we
274. 10:10get some foam that the character creates
275. 10:12and yeah this is all made pretty easy i
276. 10:15mean i say pretty easy it took me like
277. 10:17two solid days of work you know it's
278. 10:19it's it's made a lot simpler with the
279. 10:21single layer water shader model um
280. 10:25it's a lot easier to get a nice looking
281. 10:27result basically so i hope that you
282. 10:30found this video educational and or
283. 10:32entertaining
284. 10:34and if you do want to find out more
285. 10:37about you know how any of my water
286. 10:39systems in particular work feel free to
287. 10:41join our twitch streams which happen
288. 10:44most days of the week so you can ask
289. 10:46questions live there
290. 10:48and
291. 10:49that kind of thing if you run into any
292. 10:51kind of problems with you know single
293. 10:53layer water node and whatnot and you
294. 10:55need to ask me something feel free to do
295. 10:57so in our discord which is always linked
296. 10:59below and if you do want to go one step
297. 11:01further in supporting these tutorials
298. 11:03and the rest of this channel and the
299. 11:04development of this game
300. 11:06then you can do so at our patreon which
301. 11:08is linked below for as little as one
302. 11:11dollar per month so i guess with that
303. 11:14we say goodbye
304. 11:18goodbye
305. 11:28um
306. 11:53you