Shannon Berke - LoL FX + Knowledge Share

Please make a breakdown of the nexus explosion effect. How did you guys make the windup effect, like in this video?

Thank you very much :D.

It’s a mesh with the UV’s spiraled in so that the texture looks like it’s beeing pulled in towards the center as it scrolls. There is a brighter flash in the center to cover any of the pinching look you can get with meshes.

I’d like to hear from you, or others, how you think it’s done actually :slight_smile: It’s a fun exercise and helps develop your eye to see if you can identify how someone might have made something. This is also a very complex effect with many parts. What are your thoughts?

2 Likes

Hey Shannon! Thanks for all the breakdowns and knowledge shares. Helps a tooooon!

I’ll take a stab at it.

From the looks of it, it’s a pre-made animation, see how it “snaps” to the first frame when the explosion begins?

For the Idle loop it seems it’s a basic animated/particle system rotation, with some simple ambient particles, sprite particles rotating and scaling in(?)

After the snap to frame 1, the sequence begins.

A quick flash at the center to signify the breaking/cracking of the crystal and release of some energy(?)

Ambient sprites fading in and getting stronger, textures panning on pre-made meshes for the energy spiraling in across the screen and around the crystal, some other textured elements for the spikes of energy and glow around the crystal. Energy release imminent? Getting ready for the boom :boom:

Dust/energy spiraling in with darker textures (contrast :astonished:) and to help the anticipation of the actual explosion, they start getting faster.

Also there seems to be some sort of distortion or shader effect pulling things in for more oomph to the explosion.

Then the actual explosion happens (I like the few fully dark frames, adds a lot to the impact and feeling of it) Seems pretty standard with stylized textures, particles and smoke in there.

A shockwave distortion that emanates from the explosion.

Burn marks/decal effects around the crystal, along with updated models and textures for the aftermath of the explosion.

The crystal pieces are keyed to rotate around and scale down to disappear and every other particle/sprite starts to slowly dissipate.

I’d love to crosscheck with how you guys actually did it!

1 Like

Not sure if I should weigh in on this, or sit back and read the answers :thinking:

Well the nexus effects strings in the beginning are most likely really long and dragged out planes that have been placed in various ways spiraling everywhere with a texture pannering down, around the crystal is probably just a shader pannering a texture upwards or just a mesh with transparent alpha channel. Then with circle quads with the center cut out with a texture on the outside. Smoke is probably a quad or spherical mesh with the same syndra trick just with the center cut out

@sifa and @Disturbed are pretty close! There were a few nuanced elements that were missed but Sifa captured a lot of them. Great job guys! This has four images has capture the key states of the explosion.

Nexus_explo

Tons of hard work went into it’s creation :smiley: I still love to reference it for great timing!

7 Likes

Some old Zoe work. We’re getting better with posting art blasts on Artstation :smiley: https://www.artstation.com/artwork/XB48Pn

14 Likes

We also posted Qiyana in the recent art blast. Hope these gif’s aren’t huge :octopus:

Grass stealth zone. It was hard making something that didn’t obscure a large portion of gameplay space as it only makes Qiyana stealthed.

Rocky physical damage earth element. Added geometry chunks to push the physical read.

Ice roots you if hit ~

Qiyana pulls elements from the terrain around her.

Dash. Nice and simple ability.

Her ult explodes terrain if hit. I had to make it as performant as possible because it could go around VERY large pieces of terrain. I ended up making the lifetime of a lot of elements very small to help clean things up faster.

A lot of the element on hits share similar shape language. pew pew pew

The additive on hit to first hits with that element

And a cute R on hit from her Battle Boss skin when you’re in the river, you get stunned in an icecube :slight_smile:

22 Likes

Congrats!!! Astonishing work as always, keeping that level high up there :gem: :sparkles:

Hey @ShannonBerke (i know this is an old topic sorry), what do you use the alpha of the trail for?

I use it as the alpha mask for the diffuse trail to the left of it. Wanted to show the channel itself although they are saved as one image.

1 Like

oh yeah but, don’t you color the trail in photoshop? (I read online that the diffuse is to better color the base texture) what’s the actual use for it i mean (so far i’ve only used alpha for simple “alpha erosions”, which i don’t know if you use it for that or not) sorry, trying to get a better grasp of these other types of textures.

Thank you so much always for sharing these gifs/videos and insights on the develoment! Super nice to read about, inspiring and very instructive o//

1 Like

Wow, this post feels to me as i’ve found the holy grail ^^ Big Thanks for sharing this and i’ll apply this for sure…:stuck_out_tongue:

hi, i m a newbie
could you tell me how to scrolling the uv? which softwere?

You scroll the uv in a shader in either unity/ue4/game engine you work with.

They explain most basics about shaders with panning in this post, and if you just skip the panner node you can manualy control how far you want it to pan instead of constantly panning. Instead of using a constant for the off-set as they do you just make a curve between 0-0.5 or how far you want it to scroll.