마법적 구슬형태 제작



마법적 구슬형태 제작

금별 0 3,373 2019.08.30 06:32

 

I guess this is the first entry to this category, since I never had such a demand for a write-up before. So here goes!

The different between this format and regular “My take on shaders” post is that this is a more direct format, just going through a particular effect that I find too specific to write a complete tutorial about. Also, in some cases, like this one, I won’t be providing the completed code but I will be writing about the general idea and the process behind the specific effect.

In my tweet I mentioned it being a form of “raymarching” though I might be using the term loosely here. While I use a loop to move towards a certain direction, the technique doesn’t really resemble traditional raymarching. So keep that in mind.

 

The core idea

 

I’ve been constantly thinking about how to take advantage of past effects, and in this case I had an idea concerning the “layered parallax” effect that I demonstrated in an older post.

With that technique, you could sample a texture using coordinates that had been offset “inwards” of the object, by using the camera’s view direction in tangent space. The effect is super useful for adding some depth to materials like ice, or tiles or basically anything you want to make it look like “there’s something underneath the surface”. The result looked something like this:

 

 

My thoughts going from this effect were these:

  • Let’s ditch the main texture, don’t need it for now
  • What if in every “layer” of this effect, I performed a “step” function on a 2D noise texture, where the cutoff value ranges from 0 to 1 based on the “index” of the layer?

The “stepping” (that’s what I’ll call “using the “step” function” from now on) was inspired by the concept of using grayscale textures as heightmaps, with their value representing depth. Adjusting the cutoff value of a simple texture with a radial gradient looks like this:

 

As if the texture actually represents a cone and when I’m using “step” I’m cutting slices into it which decrease in size as I get to the top. Basically I’m super-over-explaining SDFs here, but that representation really helped clear things in my head.

So, if I were to assign 1 to the cutoff value of the out-most layer, 0 to the value of the deepest layer and the inbetween values to the inbetween layers, each parallax layer would have a differently sized “slice” of the texture.

If we add that “stepping” to each layer, with the same radial gradient texture, we end up with something like this (the texture is tiled 5 times so just pay attention to the middle one):

 

This uses 10 iterations on the grayscale texture

Turn up the iterations/number of layers (here it’s something 128) and you have smoothness:

 

Add a somewhat more complex texture, like a simple cloud texture and you have this:

 

 

Trying out random textures and noises is super fun with this one btw.

Add the material on a sphere and you have the ORB:

 

 

Add 2 HDR colors, and lerp between them based on the layer “index” instead of just lerping the intensity from 0 to 1 (also some Post-processing for the looks):

 

 

Add some waving displacement when sampling the texture in each layer for some extra variation and *magic*:

 

 

And that’s it! I hope that was helpful and I hope there will be many more write-ups in the future, especially as I’m easing into VFX stuff at the moment of writing. So, I’ll see you in the next one! ????



 

These posts will never go behind a paywall. But if you really really super enjoyed this post, consider buying me a coffee, or becoming my patron to get exciting benefits!

 

Comments


번호 포토 분류 제목 글쓴이 날짜 조회
1214 언리얼4 How to make Summon FX in Unreal Engine 5 Niagara ashif 09.12 16
1213 언리얼4 Create EPIC Wind Swirl VFX in Unreal Engine 5 Niagara ashif 09.11 34
1212 언리얼4 Create EPIC Stylized Toon Fire Material in UE5: Full Control Guide ????✨ ashif 09.10 43
1211 언리얼4 언리얼5 - Niagara로 번개와 표면 상호작용 VFX 만들기 금별 09.03 129
1210 언리얼4 언리얼5 - 간단한 바닥 아우라 색수차 효과를 추가 제작팁 금별 09.03 180
1209 언리얼4 언리얼5 - Rotate Around Point 활용 궤도 애니메이션 연출 간단팁 금별 09.03 94
1208 언리얼4 언리얼5 - halftone post-process 제작 예제 금별 09.03 431
1207 언리얼4 언리얼5 - 흡수 및 폭발 효과 간단 제작과정(한글자막) 금별 09.02 415
1206 언리얼4 언리얼5 - 회피 텔레포트 효과 간단제작과정(한글자막) 금별 09.02 119
1205 언리얼4 언리얼5 - Stylized 화속성 검기 간단 제작 분석(한글자막) 금별 09.02 159
1204 언리얼4 언리얼5 - 메시 조각 흡수 간단 제작과정(한글자막) 금별 09.02 365
1203 언리얼4 유니티 - 고드름 형태 프리즈 셰이더 제작과정(한글자막) 금별 09.02 178
1202 언리얼4 언리얼5 - Stylized 라이트닝 메쉬 제작과정(한글자막) 금별 08.22 218
1201 언리얼4 언리얼/C4D로 만드는 모션그래픽 스타일 VFX 제작과정(한글자막) 금별 08.22 133
1200 언리얼4 후디니/언리얼5 - 가벼운 VFX: Pivot Painter 제작과정(한글자막) 금별 08.22 169
1199 언리얼4 언리얼5 - 자연스러운 바닥 얼음생성 효과 제작과정(한글자막) 금별 08.22 162
1198 언리얼4 언리얼5 - 간단한 바닥 아우라 색수차 효과를 추가 제작팁 금별 08.22 121
1197 언리얼4 언리얼5 - 셰이더 토이로 만든 블랙홀을 언리얼에서 구현하는과정 금별 07.27 316
1196 언리얼4 언리얼5 - 나이아가라 활용한 라이트닝 감전효과 제작과정(한글자막) 금별 07.27 320
1195 언리얼4 언리얼5 - 고품질 반사 효과 만들기: Reflection Vector 활용법 금별 07.25 312
1194 언리얼4 언리얼5 - EasyMap으로 구현하는 무작위 텍스처 타일링 기법 금별 07.25 309
1193 언리얼4 How to Create EPIC Toon Smoke Trail FX in Unreal Engine 5 ashif 07.22 226

 

Banner
 
Facebook Twitter GooglePlus KakaoStory NaverBand