Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Aesthetic Light Options - Gradients/Fades, Blending modes #1908

Open
melek opened this issue May 21, 2020 · 11 comments
Open

Aesthetic Light Options - Gradients/Fades, Blending modes #1908

melek opened this issue May 21, 2020 · 11 comments
Assignees
Labels
feature Adding functionality that adds value

Comments

@melek
Copy link
Collaborator

melek commented May 21, 2020

Is your feature request related to a problem? Please describe.
A few options would make lights 'prettier' in MapTool. This is related to the additive color/darkvision issue #1895, but is a feature request on top of that. These changes would combine with Additive lighting to make really neat, stage-lighting like effects.

Describe the solution you'd like

  • Gradient lighting effects that support fading to black/no light, particularly so you can 'fade out' a torch light into the darkness.
  • CSS Blending modes, especially 'Screen' for normal light. Would allow for a variety of effects like desaturation, darkening, fog-like effects, etc.

I love me some glowy light effects. Perhaps this would generally separate the lights mechanics from its presentation, but I'm not sure that is needed.

Describe alternatives you've considered
Using MT lights to illuminate pre-rendered glow effects on map images. Blah!

Additional context
Samples of how lights could look:
image
image

@Phergus Phergus added the feature Adding functionality that adds value label May 21, 2020
@adyoungblood
Copy link
Contributor

I found a relatively easy solution in AWT's RadialGradientPaint, though it only does a linear interpolation between the two provided colors (including alpha), so stuff like this would take more work:

lamp: circle 20#ffffdd>#000000    linear
lamp: circle 20#ffffdd>>#000000   inverse square
lamp: circle 20#ffffdd>>>#000000  inverse cube

I'm definitely interested in this, though. It could easily give maps more ambience if done correctly!

@Phergus
Copy link
Contributor

Phergus commented Jan 17, 2022

If there is a performance concern we can always make it optional per client.

@FullBleed
Copy link

It would definitely look nicer/more modern.

Thanks for working on these lighting issues @adyoungblood !

@kwvanderlinde
Copy link
Collaborator

In addition / as an alternative to gradients, we could use assets as textures for light sources. That would allow creating subtle lighting effects. Here's a sample of what that could look like with a fairly simple tinted light:
image

@FullBleed
Copy link

FullBleed commented Aug 25, 2022

In addition / as an alternative to gradients, we could use assets as textures for light sources. That would allow creating subtle lighting effects. Here's a sample of what that could look like with a fairly simple tinted light:

That looks really interesting...

Can you provide some more examples? How would such textures blend? That doesn't look like it's using the new additive light method...

@kwvanderlinde
Copy link
Collaborator

kwvanderlinde commented Aug 25, 2022

It is actually using the new blending. Here's an example that uses the same asset as a texture, but tints it three ways (red/green/blue):
image

This is what it would look like on a plain background:
image

Do note that I did this as a hacky POC, so the colours may not be 100% as they should be. The general idea is there though.

@FullBleed
Copy link

FullBleed commented Aug 26, 2022

Oh, then, I think that's a pretty nice option. :)

Though it does kind of "washout" the map more that I'd expect. If you have photoshop, pop open that map image, put down a circular yellow fade to alpha, set the layer to "soft light", and drag the light around. See how that preserves (even "highlights") map details instead of washing them out? Could MT pull that off?

@kwvanderlinde
Copy link
Collaborator

Short answer is "yes":
image

The long answer is that we can't do it performantly. I am hoping that once we get libGDX integrated we'll be able to pull off some more interesting effects in a way that doesn't absolutely destroy performance.

@FullBleed
Copy link

What a shame... that looks pretty amazing!

The headwinds that Craig indicated libGDX has dashes my hopes for that happening any time soon though. :(

@kwvanderlinde
Copy link
Collaborator

I've been hacking away on adding a lumens overlay + environmental lighting, and I experimented with textured lights when that was still in the PoC stage. I think the idea worked out pretty well, so I intend to pursue it further.

The idea is that a light can be textured using any image asset, and we would tint the image according to the light's colour. The experimental light syntax I used for this was:

Light: circle 20#ffa500+100 40#a56600+50 texture=asset://dbd1a5eb4d3a883289813183c40636dc

So a light can have a single texture, but each range can have its own tint.

While I only focused on asset URLs (they are the most general), we could easily support certain keywords that use predefined textures, so that users wouldn't have to provide their own textures for basic effects. E.g.:

  • texture=flat would correspond to today's lights (solid colour, no fade) and would be useful for upgrading existing campaigns.
  • texture=linear would be a linear radial fade, and would make a good default for new campaigns (I've found this effect is enough to make maps "feel good"). It would also be easy to implement using @adyoungblood's suggestion of RadialGradientPaint with two keyframes.
  • Various other fades could be supported either by making our own paints for them, or by approximating the curves using RadialGradientPaint with multiple keyframes.

For anyone following this FR, let me know what you think of this approach.

@Lector
Copy link

Lector commented Apr 9, 2023

I think the most important feature to create "good looking" lights is a simple fading out RadialGradiantPaint. This would lights make look like lights. The visualization of transparent light overlays in version 1.12.0 has nothing to do with "lights", while the flat lighting in version 1.13.0-beta.1 can be considered as "lights" and indeed a significant improvement compared to how it was before. However, it is still apparent that real lights don't overbrighten the background like it currently does.

When using textures i think it would be great if the colors of the gradient stop would be optional, so that wierd magical lights would also be possible where the hue also comes from the texture.

One more thing I would like to consider for future improvements is animation. I believe that to make light sources more immersive, a flickering torch in the wind would be great, which could be achieved by scaling/rotating the light's texture according to some keyframes we could include by default (e.g. "flickering" for torches or campfires). Since this is not as important as radial gradients, I would keep this in mind while focusing on the more important improvements for now.

Furthermore, as a framework developer / gm and player, I would also like to mention that I am really looking forward to your work here. :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature Adding functionality that adds value
Projects
None yet
Development

No branches or pull requests

6 participants