0 Favourites

Shadows problem

  • Hi guys

    Im making an orto game where i plan object to have shadows.

    I guess all shadows have to be in one layer and the layer to become transparent, so the different shadow sprites wont overlap, and get darker.

    But here lies my problem. If the layer is placed below the main layer, no objects will be shaded, only terrain. And if the layer is placed above, objects will be always in the shade.

    So anyone knows how to deal with this?

    Maybe there is another way to blend shadow sprites transparency, so it's always 50% transparent for example?

    Thanks

  • Hi Pakot, nice looking game you are working on.

    I actually think it looks ok with the shadows overlapping each other, but one possible way would be seperating the shadow from the units and then either setting them invis or transparent when overlapping.

    Or maybe you could achieve it with one of the webgl effects? Im not sure.

  • Plugins to shadow 2D objects.

    scirra.com/FORUM/player-position-based-dynamic-shadows_topic62613.html

    scirra.com/FORUM/effect-2d-dynamic-lighting_topic59130.html

    By the way, you can use a set of detectors, moving the desired shadow up or down on the same layer, like you did with the player, but dealing with the overlapping issue would require one of that special effects to setup it.

    Destination Out is the way to go..

    <img src="https://www.scirra.com/images/articles/blendmodes.png" border="0" />

    scirra.com/manual/146/effects

  • And if the layer is placed above, objects will be always in the shade.

    Can't see why it's a problem... Isn't it what usually happens in the real world? object in the shade... are in the shade?

    Now maybe your shadow shape covers too much of your object? you might get away with just cutting the shadow around the object?

    Maybe an illustration of the problem could help (:

    Anyway I like what you did. Especially with wall construction.

  • Yann

    How long, I missed your posts!

    Shadow overlapping each other is a common issue on the real world, he just need to send the character shadow up or down on the Z order like he did with the player to get a nice and real effect.

  • TELLES0808

    hey thanks

    Well, was busy with the C2 class and some other stuffs.

    I get that shadow overlapping each other is an issue but he seems to have the right work around: lowering the layer's opacity instead of the individual shadow's opacity.

    and as far as the character's shadow is concerned, he merely talked about "objects being always in shade" vs "no objects will be shaded, only terrain".

    So as much as I understand why only shading the terrain would be bad, I don't understand why "object being always in shade" is a problem if they are supposed to be shaded by another object...

    So I think I'm mostly misinterpreting the problem and ask for an illustration of it just to be sure.

  • Thanks for the answers guys. And for all the praises. I'll try to explain better what my dilemma is.

    I'm using z order plugin for all the sprites. The best way is to cut the shadows and let them arrange along with all the objects. Even better, if I left them with the object (most of the objects are with their shadows atm) they usually get good results.

    <img src="https://dl.dropboxusercontent.com/u/19082408/zzz3.JPG" border="0" />

    But the problem is that when you get 2 shadows on top one of another, you get double dark shadow. So my best option atm as i see it is to leave it like that(the object count drops x2).

    @TELLES0808, I hope there is something i really dont understand about blending modes, but i dont think if all stuff are at one layer, the shadows, even seperated from objects, can blend correctly, cutting only other shadows out.

    So my second option is to gather all shadows and place them in a layer, and the layer gets 50% opacity, so the overlapping of shadows look good but there are another issues. Z order plugin works only per layer, so all the shadows would be over or beneath the sprites in the main layer.

    @Yann here are some examples of the downsides of that option:

    Shadow is in upper layer:

    <img src="https://dl.dropboxusercontent.com/u/19082408/zzz2.JPG" border="0" />

    Shadow is in lower layer:

    <img src="https://dl.dropboxusercontent.com/u/19082408/zzz1.JPG" border="0" />

    And last GenkiGenga i dont think hiding shadows on overlap is good idea... it will result some popping. My best hope is that it can be achieved with some kind of blending mode or something, but i really dont see how.

  • You can make a Z order system using events, without any plugin, let me find the post and show you how.

    by the way, it\s very easy to achieve using events.

    scirra.com/FORUM/rpg-games-and-the-overlapping-issues_topic51274.html

    scirra.com/forum/plugin-isometric-z-ordering-based-on-y_topic46247.html

    Also, you can setup your buildings to have more points, and check the points on the bottom, middle, etc, by using different families.

  • here's my idea

    shadowMasking.capx

    you have all the shadow in one layer which is at 40% opacity, so they blend well

    And they shade units on layer main if they don't have masks

    I'm not at home so I don't have all my image editing tools, but you can even try to make the tower mask fade toward the bottom to get some subtle casted shadow.

    (Edit: hmmmm nah wouldn't really work, the shape of the shadow wouldn't make the cast on the tower good)

    I don't think you'll get better result than that without going 3D

    On thing that might not be obvious is that the shadow layer has "force own texture" to yes for proper masking.

  • OMG Yann thats a brilliant idea you got!

    You are right the towers dont shade each other correctly but i got a solution.

    Here

    Instead of getting all masks on top of the shadow layer i let them along with the shadows to arrange in the layer the same way as the main layer stuff.

    So now when the object is infront of another, the mask of the front object is over the shadow of the object in the back so it doesnt shades.

    That works as a charm. There is one major problem though.... That way i got all the objects in the game multiplied by 3, as object count and as sprites. Even more i got them all ordering by Y (not sure if this affects the performance).

    Btw is there a way to make the mask out of the object sprite in construct2, so i dont have to double the sprites in game?

    Anyways for my project i think i'll stick with the simpliest way. Have all sprites along with shadows and live with the overlapping glitch. Sadly but i think that technique will get too much for the performance.

  • OMG Yann thats a brilliant idea you got!

    You are right the towers dont shade each other correctly but i got a solution.

    Here

    Instead of getting all masks on top of the shadow layer i let them along with the shadows to arrange in the layer the same way as the main layer stuff.

    So now when the object is infront of another, the mask of the front object is over the shadow of the object in the back so it doesnt shades.

    That works as a charm. There is one major problem though.... That way i got all the objects in the game multiplied by 3, as object count and as sprites. Even more i got them all ordering by Y (not sure if this affects the performance).

    Btw is there a way to make the mask out of the object sprite in construct2, so i dont have to double the sprites in game?

    Anyways for my project i think i'll stick with the simpliest way. Have all sprites along with shadows and live with the overlapping glitch. Sadly but i think that technique will get too much for the performance.

    As I said, you can use and event system to sort the Z index, and throw your Z ordering plugin away. Using events you'll simple sort them, without any necessity of any other configuration than the placement of the "Imagepoint 0" on the bottom of the sprite.

    Double a sprite on the canvas is surely an issue, especially on mobile devices.

    Also, this sample have a nice workaround too, and sort Z as mentioned.

    scirra.com/arcade/addicting-example-games/3923/isometric-game-basic-based-on-pathfinding-demo

  • Construct 3

    Buy Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Buy Now Construct 3 users don't see these ads
  • TELLES0808 im not quite sure but i think this z order plugin does quite the same. The only difference by me is that it arranges sprites on X also, if Y is the same.

    But since this events runs per tick, and im planning to have alot of objects, i wonder if it will still be in no importaince to the performance.

    Anyways, if i find a way to make those masks from the sprites in construct, so i dont double the imported images,its worth a shot. But I couldnt find a way to change the blending mode of a sprite with an action, so i suppose that cant be achieved.

  • yeah for the masking to work, you need the mask to be another object since you need it to be on the same layer as the shadow, and also on top of them.

    Now if you double the amount of object, you indeed augment the amount of calculation.

    And, if you use the ZSorter plugin, I believe it does things automagically every tick.

    But if you handle sorting by yourself, you can trigger the sorting actions whenever you want.

    So you can just limit the recalculation each time you move an object in the Y axis more than a given number.

    One way to do this, is to use the function plugin and to create a "sort" function that will reorder the sprites

    Then when you drag an object, or move your character, you monitor the Y position by storing it each time you sort the sprites (so you do the storing in the "sort" function.

    Then when the difference between this value and the actual Y position of the moving sprite is greater than a given value (probably proportionnal to he size of your grid), you call the "sort" function.

    Hope it wasn't too complex :D

    Anyway, I think the best thing you can do to take your final decision is to run some stress test on the devices you target.

    Maybe you can just decide to use one technique on desktop and another on portable devices. There's probably a way to make a simple switch so you can release easily two version.

  • I've heard countless people claim doing a for each ordered loop for sorting is the best way. Most of these people don't use it in any complex or detailed settings. It is a nightmare if you ever use any objects other than just one type (ie, if you mixed tiled backgrounds with sprites--you can't mix object types in families). Like anywhere else, I'll recommend you stick with the z-sorter plugin (and use rex's updated one, too). You can choose how often you sort in a single event. Instead of every tick, use every few milliseconds or whatever and then call the "sort objects on layer" action. It really is the best way to go currently, and you can modify things easily now, too! If you need to manually move an object in front of another, you can with C2's relatively new z-ordering events. Just call that after the z-sorter plugin call and voila!

    As far as shadowing goes, perhaps a second layer could be your solution? That's my solution to the same problem in Courier. It isn't perfect, requires a little more manual placement and fixes, and can cause the player to occasionally have a shadow over (or not over) them at the wrong moment, but it sure beats doubling your objects and running anything CPU-intensive.

    In actuality, I have several layers that I use for my game, really, as a solution to most of your problems.

    Overshadow -- shadows on objects over the player permanently

    Over -- things like rooftops always over the player

    Player/objects--my z-sorted layer. Really not a ton of stuff on it in many cases

    Structure shadows--shadows on structures like buildings or cliffs

    Structures--buildings and such

    Regular shadows--shadows like you're doing now

    Ground--duh

    I make the objects never overlap between the shadow layers, and it covers the majority of instances that I would require. The only downside is not getting shadows on the player, but that's a small trade-off for the tons of fixes and flexibility I get. You could run a darken/tint shader on the player if they overlap a shadow and semi-fix that issue, but otherwise this fixes about everything in a simple, easy-on-the-CPU kind of way.

    I get a little more mileage since my game's perspective is more of a 3/4 view straight-on instead of isometric, so I can get away with simpler shadows at times. Also, making the shadows blurrier makes them not stand out too much AND you can blend/fake things. I have a non-uniform blobby shadow that I've gotten a ton of use out of with just stretching and rotating it to be "close" to the shadow that object would cast.

    Our games are set up differently, but this all should be worth looking into to see if it helps. Scroll through the few pages of my Courier thread to see a few more of my shadowing examples because my shadows don't overlap, and buildings cast shadows on themselves, too--which is more useful to me since I don't pre-draw any of them in an image editor, but rather build them out of parts and textures in C2.

    Good luck!

    Bonus pro-tip: You can import some shadows objects as a tiled background, but import it upside-down. Rotate it right-side up in the editor. Now, when you resize it, you crop instead of distorting. Now you can have multiple different partial shadows using the same object. Very useful in a some rather specific instances. Also, if you need the bottom of the shadow to be round or something instead of flat, use one of your multi-purpose shape or blob shadows to fix the bottom edge. Using a uniform opacity for the layer, no-one will ever know you combined two objects to make the shadow.

  • Thanks a lot for the interest of that thread guys.

    @Yann your approach is good for using z ordering only when i have to move buildings or character. Unfortunately my game is supposed to be more like tower defense with many units, so there will always be units going up and down.

    Would be nice if i could move up and down in a layer only a certain class objects, having in mind the position of the others object in that layer, because most of the objects i have are static, but they need to be arranged every single time along with moving (units) objects. Since all the z ordering is structured by go to top and bottom of the layer that is impossible, I'm afraid.

    @C-7 thanks for sharing this technique, its really simple, the way i like it, but unfortunately it wont work for me either :(. I need all the objects to be in one layer, ordering by z, so i can have taller units than the buildings. This works only if the characters are shorter than the building roofs. Anyways at least i can do that for the objects that surrounds the playable area like cliffs, woods etc, so they don't get arranged.

    Btw your game looks fantastic.

    When i got the game to alpha or something ill make some stress tests and decide for good what I'll do but for now i think I'll stick with the easiest way - leave shadows with the objects and let them stack :)

    Thanks a lot guys for sharing your thoughts.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)
Similar Topics Posts Views Last Post
Unread hot topic
74 8,085
eli0s's avatar
eli0s
Unread hot topic
98 7,593
norum82's avatar
norum82
Unread hot topic
87 5,374
facecjf's avatar
facecjf