Gio Chequi: Sketchbook

Heey yall :v:

I’m back to studying VFX for real this time! Over the past few months, things were pretty chaotic. I moved to Canada to work as a UI Designer @DeadByDaylight, but now that I’m settled, I can dive back into studying.

Recently, I revisited making that card burst and projectile, and I’m quite pleased with the results, thanks to the Ablaze course. There are still some tweaks to make, especially with the trail and particles, but it’s definitely a big improvement from before.

ProjectileCards

1 Like

Card Burst Projectile

ProjectileCards

Card Hit

Materials:

Card:
All particles are just an AlphaBlend material except for the Card and Trail

image

- Distortion

- Dissolve
At first I did add some glowing edges for this dissolve mask but it ended up too noise for something thats going too small on the screen

- Color
Maybe not the most efficient setup, but I ended up using separate textures instead of packing everything into one (I’m lazy :laughing:), also wanted to apply a gradient map to easily change the card’s color whenever I felt like it.

NS

Emitters:
At first, I thought it was really complicated doing the card burst, but then I discovered I could just use the Confetti Burst template from Unreal. All I had to do was swap the texture and adjust a few settings in a couple of modules.

1 Like

Plexus/Constellation Trail (Paimon’s Trail)

Sooo I just started playing Genshin recently, and oh my goodness, this game is absolutely stunning in every way! One of the first things that caught my eye was Paimon’s Trail effect. As soon as I saw it, I knew I had to try replicating it.

PaimonTrail02

This was my result:
PaimonTrail

PaimonParticles

The effect is pretty straightforward. The only part that gave me some trouble was creating the “constellation/plexus.” At first, I thought about using a flipbook with different drawings of constellations, but then I stumbled upon Niels’ mini tutorial for plexus. It seemed really cool, but I struggled to follow along because, well, I’m not that experienced with scratch modules. Niels’ approach is intriguing, though I couldn’t quite replicate it. But I was determined to find a solution. After a few hours of trial and error, I figured out a much simpler way to achieve the effect.

Emitter
Just with one emitter rendering a sprite and a ribbon you achieve this.

Plexus

One important thing to note is that you have to change the Tessellation mode to custom and then set the Max Factor to 1.

This creates a ribbon that connects the dots with just one segment. It’s also pretty cool to play around with other values.

Tessallation

Trail

The trail is quite simple. It’s just the same texture panned at different speeds and multiplied together, along with a dissolve mask on one side.

Texture

3 Likes

One cool trick that I found out with the same emitter is adding a Location Event to it, you basically makes a plexus trail:
Plexus Trail

With some fine tuning this will look :fire:

How I did it:

1 - Check in the first emitter the option Requires Persistent IDs in the Properties

image

2 - Add Generate Location Event in the first emitter

image

3 - In the second emitter and create an even handler
image

4 - After that just add those 2 modules with this setup

Event Handler Properties

Recieve Location Event

Ta-daaah :sparkles:

Demon’s Souls - Soul Texture

My take:
Soul

How it looks in the Game:
Recording

(sry for the trash recording from my phone :laughing:, just got my hands on a PS5 recently, not sure how to capture that with it)

Aiming to improve upon my previous sketchbook thread, I’m back with a more complete overview of this mini tutorial on replicating the texture from Demon’s Souls Soul Icon. I’ll also post my UI Distortion Material I did for this UMG Widget.

So, a while ago, I stumbled upon Adam Rehmann’s Soul Icon post on ArtStation and I was eager to replicate it, so I brainstormed some ideas on achieving this effect.

Ideia 01: Procedural Smoke Trail Generator that Gavin Finley in Susbtance Design

Ideia 02: Flame Painter (Paid) This tool is awesome! The results it gives are super accurate compared to the reference

Ideia 03: Path Blur in Photoshop - Here are the steps I follow to achieve it.

Step 01: Create a base shape with a Hard Brush or a Texture Brush

01

Both option are great, but each one gives a slightly different textures when the Path Blur is applied, so have fun with that! :fire:

Step 02: Make it a smart object, so in case you need you can edit it later. Go to Filter > Blur Gallery > Path Blur

image

Step 03: A pop-up will appear. This is where the magic happens. The path blur tool consists of an arrow with points that you can add or remove. It shows the direction of the blur that will be applied to your drawing.

The 4 attributes you will work with:

  • A: Speed
  • B: Taper
  • C: End Point Speed/Edit Blur Shapes
  • D: Blur Arrow

First things first, make sure to check the “Edit Blur Shapes” option so that the red arrows appear on your screen. Then, you can have fun playing around with the arrow shape, adding multiple points to it. Experiment by adjusting the values for A, B, and C. Once you’re satisfied with the changes, simply hit “OK”.

02

Step 04: Try using multiple shapes of different sizes. Adding small lines with a slight blur can add variation to the texture, enhancing its overall look. Additionally, using the smudge tool can help correct any unwanted artifacts created by the path blur or further customize your shapes. Spend a few minutes experimenting with these techniques, and you can achieve something like this

Step 05: Once you’re done with the composition, you have a couple of options to enhance it. You can duplicate it and apply a Gaussian blur, then send it behind your shapes for a soft glow effect. Alternatively, you can create a new layer and use a soft brush to paint the glow around your shapes. Don’t forget to add some small particles around for an extra touch.

Step 06: Make a Gradient Map, and ta-daaah, it’s done! :sparkles:

EXTRA TIP: I really love this trick in Photoshop, Here’s how it goes down: I slap a black layer on top of everything, switch the blend mode to Color Dodge, and grab a soft brush with super low opacity, like 5%-8% tops. Then, I just paint over the spots where I want to make things pop a bit more. It’s low-key, but it adds a nice touch to bring out those details.

image

Before and After:

glow

UI Material:

This one is pretty simple, is just a material UI Material with a texture with a distortion.

Distortion:

Color:

Widget:

Soul

3 Likes

thanks for the indepth look ! i didn’t know about the blur path tool in PS! super cool!

1 Like

Aaaa :fire: that means a lot coming from you, Simon!!! Thanks :v:

1 Like