Ghislain Girardot Profile picture
Jan 14, 2023 14 tweets 6 min read Read on X
#UnrealEngine #UE4 #UE5 #UETips
Here's one WPO trick I used to create this night sky.

The challenge was to create subtle per-star lens flares that would always face the camera and remain straight, exactly like billboards. 🧵⬇️
To create star billboards, each star would need to rotate around their own pivot point to face the camera but pivots are all lost once exported to a single mesh... :(
... I could bake pivots in UVs but that'd actually be overkill here! I don't actually care about the precise XYZ position of each star... 🧐
... A direction will do just fine! And because I'm using an unlit additive material, mesh normals served no purpose. So I could actually encode that direction into normals :)
For this I created a simple Blender script that takes each star's position, normalize that position and store the resulting direction into custom normals.

Once that was done, I reset their location back to (0,0,0) and exported that pile of stars all stacked on top of each other.
I also encoded a simple 0 and 1 value in a secondary UVMap to differenciate the star main quad from the lens flare quads to differenciate those two in engine, and sort-of create two shaders in one using a simple boolean mask to drive a few lerps.
A random value was also assigned per-star and stored in the remaining UV channel to drive some shader logic (brightness, tint, size...) and bring character and randomness to the night sky.
Once in engine I could simply scale stars using a multiply because they all were centered at 0,0,0 to begin with :)

I could even scale the lens flare separately using that value encoded in UV to create a mask.
I could then use a simple transform node from view space to world space to turn stars into billboards for two reasons
1) stars were all centered at 0,0,0 so that would make them all pivot around that shared pivot point 👍
2) stars were all made to face negative Z👍
If you're feeling a bit lost with all those WPO tricks, feel free to give my previous YT video a watch:
I then used the direction encoded in their normals to push them far far far away in the desired direction *once* the WPO billboard & scale tricks were applied.
All I needed to do still was to fade those lens flare the straighter we look at those stars...
... and fade them in & out based on sun light's altitude. And voilà!
There's more tricks like that explained in my breakdown video, give it a watch if you will :)



Cheers, enjoy your weekend!

• • •

Missing some Tweet in this thread? You can try to force a refresh
 

Keep Current with Ghislain Girardot

Ghislain Girardot Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @GhislainGir

Jan 12, 2023
Heya! I'm back😇Was good to take a break from work and socials a bit, but it's time to get back to work!

I guess I'll start 2023 showcasing how to efficiently create a sharp-looking night sky using a single 512x512 16bits texture and 3 cheap materials. Vista mesh has ~5k tris.
- Sharp stars.
- No visible tiling.
- Artistic control.
- Flickering effect.
- Custom lens-flare effect on hero stars.
- Nebula. ImageImageImage
That wasn't planned but I needed a night sky and then I thought it'd make a good subject for a quick YT video while I work on more time-consuming incoming projects :D
Video shouldn't be too long to produce so I'm hoping for a release in two days?
Read 4 tweets
Dec 10, 2022
#UnrealEngine #UETips #UE5
You can use a Procedural Mesh Component or Geometry Scripting to iteratively slice a given mesh, render the generated cap and composite the result into an atlas texture to generate a distance field/volume texture ⬇️
I was lazy and used the good old procedural mesh component because it's what I know and it's easy. Do a loop and slice a mesh a little bit further each time (based on the object's bounding box and amount of slices to generate). Capture the cap using a scene capture component... Image
...and composite the captured texture into the atlas render target using an additive material that renders that texture at a specific XY tile. Image
Read 4 tweets
Oct 20, 2022
#UnrealEngine #UE4 #UE5
Cute simplistic trees are available as a Tier 2 reward on my Patreon :) Have a look at the thread below to see how they were made ⬇️
0/22 First of all, some technical stats: Each tree is ~3K tris for LOD0. 2 draw calls per tree (one material for the leaves, one for the trunk). 2*1K textures (one normal map, one mask). ~160 pixels instructions for the foliage material.
1/22 It all begins with the leaf texture creation. There's many ways to do this, I tend to model a single leaf in 3D then group a bunch of them together like so. Image
Read 24 tweets
Oct 10, 2022
#UnrealEngine #UE4 #UE5
Dunno why I love to prototype random stuff in BP so much. It's 5am, what am I doing🤪I guess this could be used to generate random positions with random radius and no overlaps. Blueprint graphs below ⬇️
Tick event to see the simulation progressing. Clear & Generate Circles are two functions callable in-editor. Image
Spawn logic Image
Read 6 tweets
Sep 7, 2022
#UnrealEngine #UE4 #UE5 #UnrealTips
1/7 Translucency see-through trick that might be useful... sort-of? This is usually done with custom stencil/depth (which has its benefits) but using a translucency material allows you to cheat a bit...⬇️
2/7 First we'll make a translucent material that has Depth Test disabled. Then we're going to sample the SceneDepth and recompute the world position of anything that was occluding our view... Image
3/7 ... then get the squared distance (cheaper) from that scene world position to the camera and compare it with the squared distance of our own position to the camera. If ours is higher, means we're behind something! We can then get a binary mask with an if statement.
Read 7 tweets

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Don't want to be a Premium member but still want to support us?

Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal

Or Donate anonymously using crypto!

Ethereum

0xfe58350B80634f60Fa6Dc149a72b4DFbc17D341E copy

Bitcoin

3ATGMxNzCUFzxpMCHL5sWSt4DVtS8UqXpi copy

Thank you for your support!

Follow Us!

:(