This is video is perhaps a bit strange, hopefully it still makes sense. I have thought about silhouetted backgrounds before but haven't really tried it too much (only once or twice), and when I read the article on how some areas like the ramparts in dead cells only relied on a gradient map for their backgrounds I was actually kind of surprised given how nice it looks, which kind of lead me down a rabbit hole of playing around with gradients on all different types of assets and situations and kind of cataloguing the downsides and benefits. I don't know if I personally have any real conclusion except am going to try using it from time to time and hopefully get better at using it :) Ohh. and obviously the idea of gradient maps aren't new in any shape or form, but I hadn't personally considered using them the way dead cells did before (maybe the same goes for you?)
This sounds like a relative of the good old Palette Swap. Especially the mapping of the greys to the sets of colours. That's really close to loading in a different palette and leaving the pixel data alone. The difference being that you're not restricted to 16 or 256 discrete colours, but can interpolate both the greys and the colour sets they get mapped to.
by the way - its easy to make your ipad asset process a bit better. you can draw every asset in one bigger file, each in separate layer group - side by side, its much easier to maintain consistency and coherence. than you export it to you pc as psd file - super quick python script (u can use chatgpt for that) to export and crop every group layer as png file and voila. its perfect - you have all the assets extracted and cropped from big psd file and ready to add to the game engine of you choice.
Ohh, that is interesting. it doesn't get weird for big files on the iPad itself? I might look into it more. It does sound like something that could be useful for sure.
@@Nonsensical2D its a life saver for me. before that it wasnt possible to create anything coherent. depending on your ipad version there is a layer limit (i see difference between my ipad pro 12.9 which is a powerhouse and ipad mini but still it works nice). i organize files per asset types - for example - trees or buildings. i use a character size on one layer as a size reference, it makes it so much easier. i just draw all assets in different groups if consistent naming convention, export as psd to my pc (files are like 30-40 mb and it works great), i run python script that extracts it all and copies to my folders with atlases (here naming convention is helpful), when extracted the script runs atlas packer, then compiles and runs the game and it all happens without manual work. its such a game changer, you can just focus on art and you have it in your game in minutes. you can even have a python script that listens in a loop and waits for a file to change when you upload it from your ipad - so you just develop a game in a bed with ipad, export to a pc via wifi and just in minutes you have your game ready with new assets :D
You could utallise the RGB values to have 3 different gradients, along the colour channels linearly. So you could have a block asset shaded using the red channel, with vines shaded using the blue channel. And you'd get to have a brown block with green vines, when re-colouring in engine. Would be a bit complex to draw, I wonder if any game does that though.
Not strange at all! I work extensively with gradient maps in illustration and its such a relief to see someone approach the concept in engine, as I was wondering if it was even possible
The moment I saw the technique Motion Twin used for Dead Cells, I had a hunch I was already too late for now. But moving forward, I'm decided to adopt both styles. Hand-drawn colored assets for a unique feel, but make use of shader coloring for things like particles, backgrounds and also for scenes meant to feel somewhat empty. Another thing I used that kind of coloring for is something like depth of field. How in some parallax backgrounds, the farther the object on a sunny day, the "blue-er" it becomes. With this style of coloring, I get to easily adjust it to match effects such as snow, sunset, volcano, etc.🙂 And instead of using a shader, in Gdevelop, I use object or layer tint effects to achieve this.😅 Awesome vid as usual!✨✨
There's another video I saw that uses an rgb value to tell the engine what part things are, instead of color. Add a normal map, and you should be able to generate the high-end styles in engine.
Color palletization is also something that can be done, either a PP screen space shader or having a shader per asset might be better and aseprite supports outputting pallets
This is so cool, in art it is often said that values aka how bright or dark something is way more important then color, this i feel shows it pretty well, but i guess there are still limitations to this it does take control away but for less experienced art this could work great
as someone with no formal art training your channel has been invaluable to me and this video like many others are a gem. really makes me think about the importance of coloring in particular. still struggling to implement your advice properly but without them i would definitely be having a much harder time making passable game art and perhaps not even understand why
I think your channel is the best 2d game art channel, because you discuss these topics from a design perspective. But here it would be good to look beyond Godot just to get a general feel how the workflow is in e.g. Unity, where your videos generally apply too, and where I assume is a big audience (I’m using Unity, too). In Unity (2d), it’s a best practice to develop in greyscale - if your art style is cartoony enough - and use the tint on the sprite renderer component to colour. There, you first create a prefab, a tree, a rock, etc. which you can place instances of into the scene. Now this can just be made up out of many sprites, of which you can tint each individually. So one object having different colours is not a problem. Further, there are powerful shader tools, where you could use gradient mapping, masks and whatnot. Further, the tinting or colouring, however made, can surely be designed to whichever specification you want. It’s just not as straightforward as picking a colour. You can surely dial in the brown tones to look identical, and of course, may require to dial in lighting etc too. Likewise, the code-shader based tinting uses some kind of blend mode, which of course affects how the colour looks like. That is, the greyscale must be dialed in, and so on, and will interplay with the scene light etc and it might be difficult to get specific colours. This is generally true, even for analogue art. Your picture on the wall won’t have a bright blue sky when you hang it into a dim corner of your house. We just don’t see it as such, but will interpret the picture as-if well lit. That is, what’s missing here is more emphasis that you need a kind of flat colour, cartoon or gradient-mapped style to begin with. The rest really depends. As It is somewhat obvious, value and hue are not necessarily linked in every art style - but it can be in many styles, or even help create an art style. Theoretically, the greyscale has 256 values, so you could in theory make a 256 colour palette etc. In my game, the tree crown is one sprite and the trunk another sprite. When I instantiate a tree, it automatically picks a green hue on the crown and a brown hue on the trunk. For this I only define two colours each, e.g. the darkest blue-green of my pine tree gamut, and the brightest yellow-green I want, and then lerp a random colour within that bracket. Just some food for thought. That said, your videos are great.
Shouldn't it be possible to do both to some degree? Like you could draw an asset with color and then convert it to grayscale in the shader before applying the color map. Then if you want the colored version of the asset just dont use the shader. Maybe it wouldn't look as good as going all in on grayscale or all in on colored but seems like an easy thing to try
Personally, I’ve veered to a more vibrant coloring for my game, which lets me let it look especially jarring for a segment near the end where there is no color
I nearly scrolled past this video because I could easily answer the question in the title and thumbnail (which are also the same question). I only clicked on it because I figured it might have something to do with gradient maps. That said, if I hadn't thought of that, there would be not enough pulling me into the video. "Should you game art be grey" generates curiosity, but something like "when to use gradient maps" (in the thumbnail, perhaps) would hint at an answer to the question that probably isn't obvious, and shows that the video will provide informative value to the viewer. What I'm trying to say is I don't think the current title/thumbnail says enough about the video and it should probably go like this instead: Title: Should your assets be grey? Thumbnail: USE GRADIENT MAPS The wild question makes you think "That's a wierd question. Too bad I already know the answer." and the forcefulness of the thumbnail makes you go "Really? Why? What even is that?"
Ye, you might be right, I generally try to avoid using technical terms in video titles because I feel it runs the risk of only pulling in an audience that already knows this stuff (and the content really isnt that technical) you are right that the title might be a bit too vague in this scenario
This would need some customizing, but I guess You could use "materials" which tell the shader how to gradient-color the grayscale. This way you also use a single shader and can batch things as usual, it just need access to the materials list and the textures, so it should render just about as efficiently as a single gradient. Also, these "materials" can be resources in themselves and shared between different assets - and maybe even arranged as pallets -, possibly offering cohesion, theming and re-usability. If you also need support for details, you could then either just break up the assets and use a single "material" for each "part" of them, or have a "material mask" texture / "channel" (adding more overhead), depending on workflow and etc. The material to be used in each asset could be exported for selection in the editor, as well as the material themselves and palettes of them - so it should be possible to edit them all on the fly both in editor and via code. I realize this is a lot of extra setup - and mostly just me think out aloud - but it feels like it might end up opening up some interesting possibilities.
Ye, i kind of think this can be solved, right now since i do considerable batching the shader shouldnt technically be on each individual asset either, but i havent really looked into it much, i dont even know how costly of a shader this is, it should technically just act as a lookup table of sorts, but I mostly wanted to look at the art aspect of it in this video. As I said I didn’t really see a difference in fps between the two scenes, particle effects tend to be significantly more costly…
@@Nonsensical2D Yeah, it shouldn't be much of a strain. For a lookup it should take 3 * 256 = 768 bytes per gradient, plus any overhead, which should be fine unless you have truckloads of different gradients. So yeah, it should probably be just a lookup - pretty lightweight so long as you don't need to break batching. I really liked the art aspect of it as well, that's kind of the reason it got me thinking about ways to make it flexible and easy to explore : )
You also can use up to 3 gradients if you'll transpose 3 layers into RGB channels. This way your sword will have steel blade, golden guard and whatever colour handle.
I thought for a moment that you were going to use a gradient based on the z-indez plus the gradient in the y axis. Which would make depth easier to handle. Anyways, great take on the greyscale approach.
Ohh, interesting, that might actually work. It'll probably look different in Godot since I don't use a z-index, but the principle of it should probably be possible to add into code.. I might look into seeing if it is possible, would probably be nice for the reason you outlined! Thanks !
@@Nonsensical2D I think you showed an example on how to do 2.5 parallax like hollow knight and you had like -3, -2, -1, 0... canvas layers. I think that layering would be a good number to sample a gradient from. But yeah, I'm sure you can figure it out much better than me haha. Thanks for all your videos, they have sparked a lot of improvements in my ongoing project.
Could you maybe make some sort of video about top down art. I think it’s pretty hard to make it look good. I would love some tips on how to make the environment look less empty and just how to make art look good in top down.
Interesting. At first I thought you meant should your game be gray. I thought about a monster taming game idea I wanted to work on which took place around 1920's and the game would have been gray with only a few spots of color to highlight important objects. lol. It seems like the grayscale could work if you want the entire object to be one color but for something like a flower, you'd have to make the flower part separate from the stem and leaves. That seems like it's more effort than it's worth. But the versatility of the objects it would work for seems worth it. But I'm working on developing my watercolor skills so I don't think this would look as good with watcolor.
Ye for sure, I wouldn't use it for my foreground assets I think, it removes too much of the nuance to each asset. but for backgrounds where you want it to be simple it could work :)
I'm not entirely sure I would do content on standard 3D art, but I have already played around a bit with 2d and 3d mixed environments, similar to cult of the lamb and I will eventually do content on that. I don't know exactly when though, since I don't have that much time to dedicate to the channel (because of work). I am currently focusing on simpler projects (like this one) and just practicing making videos quicker.
Thanks, I appreciate it! I have considered it, I have just wanted to ensure that I can release about a video a week first ( which is finally starting to happen)
I honestly haven't checked the rules for linking on RUclips but the article name is "Art Design Deep Dive: Giving back colors to cryptic worlds in Dead Cells" on the website game developer. It's an interesting article :)
"you can't do that with a gradient texture" Me: looking at my 2d gradient texture that stack many gradient on top of each other and just sliding the V to get all the missing effect 😏
Ye, I will, but I always have a couple of videos where the scripts or material is already finished this means that even if I was to begin with a video idea now, it would take a while to finish it. Especially since I do this barely part time xD There should be a couple of good videos on tile maps out there in the meantime though :)
This is video is perhaps a bit strange, hopefully it still makes sense. I have thought about silhouetted backgrounds before but haven't really tried it too much (only once or twice), and when I read the article on how some areas like the ramparts in dead cells only relied on a gradient map for their backgrounds I was actually kind of surprised given how nice it looks, which kind of lead me down a rabbit hole of playing around with gradients on all different types of assets and situations and kind of cataloguing the downsides and benefits. I don't know if I personally have any real conclusion except am going to try using it from time to time and hopefully get better at using it :)
Ohh. and obviously the idea of gradient maps aren't new in any shape or form, but I hadn't personally considered using them the way dead cells did before (maybe the same goes for you?)
It is kind boggling to me that your channel hasn't blown up yet! Such high production quality and unique content, it's just a matter of time
I personally really like moving more of the artistry into the engine and out of the asset development. There's something satisfying about it.
good work
This sounds like a relative of the good old Palette Swap. Especially the mapping of the greys to the sets of colours. That's really close to loading in a different palette and leaving the pixel data alone. The difference being that you're not restricted to 16 or 256 discrete colours, but can interpolate both the greys and the colour sets they get mapped to.
Greyscale and monochromatic themes always looks great to my eyes!
by the way - its easy to make your ipad asset process a bit better. you can draw every asset in one bigger file, each in separate layer group - side by side, its much easier to maintain consistency and coherence. than you export it to you pc as psd file - super quick python script (u can use chatgpt for that) to export and crop every group layer as png file and voila. its perfect - you have all the assets extracted and cropped from big psd file and ready to add to the game engine of you choice.
Ohh, that is interesting. it doesn't get weird for big files on the iPad itself? I might look into it more. It does sound like something that could be useful for sure.
@@Nonsensical2D its a life saver for me. before that it wasnt possible to create anything coherent. depending on your ipad version there is a layer limit (i see difference between my ipad pro 12.9 which is a powerhouse and ipad mini but still it works nice). i organize files per asset types - for example - trees or buildings. i use a character size on one layer as a size reference, it makes it so much easier. i just draw all assets in different groups if consistent naming convention, export as psd to my pc (files are like 30-40 mb and it works great), i run python script that extracts it all and copies to my folders with atlases (here naming convention is helpful), when extracted the script runs atlas packer, then compiles and runs the game and it all happens without manual work. its such a game changer, you can just focus on art and you have it in your game in minutes. you can even have a python script that listens in a loop and waits for a file to change when you upload it from your ipad - so you just develop a game in a bed with ipad, export to a pc via wifi and just in minutes you have your game ready with new assets :D
You could utallise the RGB values to have 3 different gradients, along the colour channels linearly.
So you could have a block asset shaded using the red channel, with vines shaded using the blue channel.
And you'd get to have a brown block with green vines, when re-colouring in engine.
Would be a bit complex to draw, I wonder if any game does that though.
Not strange at all! I work extensively with gradient maps in illustration and its such a relief to see someone approach the concept in engine, as I was wondering if it was even possible
The moment I saw the technique Motion Twin used for Dead Cells, I had a hunch I was already too late for now.
But moving forward, I'm decided to adopt both styles. Hand-drawn colored assets for a unique feel, but make use of shader coloring for things like particles, backgrounds and also for scenes meant to feel somewhat empty.
Another thing I used that kind of coloring for is something like depth of field. How in some parallax backgrounds, the farther the object on a sunny day, the "blue-er" it becomes. With this style of coloring, I get to easily adjust it to match effects such as snow, sunset, volcano, etc.🙂
And instead of using a shader, in Gdevelop, I use object or layer tint effects to achieve this.😅
Awesome vid as usual!✨✨
There's another video I saw that uses an rgb value to tell the engine what part things are, instead of color. Add a normal map, and you should be able to generate the high-end styles in engine.
Color palletization is also something that can be done, either a PP screen space shader or having a shader per asset might be better and aseprite supports outputting pallets
Just discovered your channel and wanted to thankyou for the excellent content you are doing.
This is so cool, in art it is often said that values aka how bright or dark something is way more important then color, this i feel shows it pretty well, but i guess there are still limitations to this it does take control away but for less experienced art this could work great
as someone with no formal art training your channel has been invaluable to me and this video like many others are a gem. really makes me think about the importance of coloring in particular.
still struggling to implement your advice properly but without them i would definitely be having a much harder time making passable game art and perhaps not even understand why
I think your channel is the best 2d game art channel, because you discuss these topics from a design perspective. But here it would be good to look beyond Godot just to get a general feel how the workflow is in e.g. Unity, where your videos generally apply too, and where I assume is a big audience (I’m using Unity, too).
In Unity (2d), it’s a best practice to develop in greyscale - if your art style is cartoony enough - and use the tint on the sprite renderer component to colour. There, you first create a prefab, a tree, a rock, etc. which you can place instances of into the scene. Now this can just be made up out of many sprites, of which you can tint each individually. So one object having different colours is not a problem. Further, there are powerful shader tools, where you could use gradient mapping, masks and whatnot.
Further, the tinting or colouring, however made, can surely be designed to whichever specification you want. It’s just not as straightforward as picking a colour. You can surely dial in the brown tones to look identical, and of course, may require to dial in lighting etc too. Likewise, the code-shader based tinting uses some kind of blend mode, which of course affects how the colour looks like. That is, the greyscale must be dialed in, and so on, and will interplay with the scene light etc and it might be difficult to get specific colours. This is generally true, even for analogue art. Your picture on the wall won’t have a bright blue sky when you hang it into a dim corner of your house. We just don’t see it as such, but will interpret the picture as-if well lit.
That is, what’s missing here is more emphasis that you need a kind of flat colour, cartoon or gradient-mapped style to begin with. The rest really depends. As It is somewhat obvious, value and hue are not necessarily linked in every art style - but it can be in many styles, or even help create an art style. Theoretically, the greyscale has 256 values, so you could in theory make a 256 colour palette etc. In my game, the tree crown is one sprite and the trunk another sprite. When I instantiate a tree, it automatically picks a green hue on the crown and a brown hue on the trunk. For this I only define two colours each, e.g. the darkest blue-green of my pine tree gamut, and the brightest yellow-green I want, and then lerp a random colour within that bracket. Just some food for thought.
That said, your videos are great.
Shouldn't it be possible to do both to some degree?
Like you could draw an asset with color and then convert it to grayscale in the shader before applying the color map.
Then if you want the colored version of the asset just dont use the shader.
Maybe it wouldn't look as good as going all in on grayscale or all in on colored but seems like an easy thing to try
Personally, I’ve veered to a more vibrant coloring for my game, which lets me let it look especially jarring for a segment near the end where there is no color
I nearly scrolled past this video because I could easily answer the question in the title and thumbnail (which are also the same question). I only clicked on it because I figured it might have something to do with gradient maps. That said, if I hadn't thought of that, there would be not enough pulling me into the video.
"Should you game art be grey" generates curiosity, but something like "when to use gradient maps" (in the thumbnail, perhaps) would hint at an answer to the question that probably isn't obvious, and shows that the video will provide informative value to the viewer.
What I'm trying to say is I don't think the current title/thumbnail says enough about the video and it should probably go like this instead:
Title: Should your assets be grey?
Thumbnail: USE GRADIENT MAPS
The wild question makes you think "That's a wierd question. Too bad I already know the answer." and the forcefulness of the thumbnail makes you go "Really? Why? What even is that?"
Ye, you might be right, I generally try to avoid using technical terms in video titles because I feel it runs the risk of only pulling in an audience that already knows this stuff (and the content really isnt that technical) you are right that the title might be a bit too vague in this scenario
This would need some customizing, but I guess You could use "materials" which tell the shader how to gradient-color the grayscale. This way you also use a single shader and can batch things as usual, it just need access to the materials list and the textures, so it should render just about as efficiently as a single gradient. Also, these "materials" can be resources in themselves and shared between different assets - and maybe even arranged as pallets -, possibly offering cohesion, theming and re-usability.
If you also need support for details, you could then either just break up the assets and use a single "material" for each "part" of them, or have a "material mask" texture / "channel" (adding more overhead), depending on workflow and etc.
The material to be used in each asset could be exported for selection in the editor, as well as the material themselves and palettes of them - so it should be possible to edit them all on the fly both in editor and via code.
I realize this is a lot of extra setup - and mostly just me think out aloud - but it feels like it might end up opening up some interesting possibilities.
Ye, i kind of think this can be solved, right now since i do considerable batching the shader shouldnt technically be on each individual asset either, but i havent really looked into it much, i dont even know how costly of a shader this is, it should technically just act as a lookup table of sorts, but I mostly wanted to look at the art aspect of it in this video. As I said I didn’t really see a difference in fps between the two scenes, particle effects tend to be significantly more costly…
@@Nonsensical2D Yeah, it shouldn't be much of a strain.
For a lookup it should take 3 * 256 = 768 bytes per gradient, plus any overhead, which should be fine unless you have truckloads of different gradients. So yeah, it should probably be just a lookup - pretty lightweight so long as you don't need to break batching.
I really liked the art aspect of it as well, that's kind of the reason it got me thinking about ways to make it flexible and easy to explore : )
You also can use up to 3 gradients if you'll transpose 3 layers into RGB channels. This way your sword will have steel blade, golden guard and whatever colour handle.
I thought for a moment that you were going to use a gradient based on the z-indez plus the gradient in the y axis. Which would make depth easier to handle. Anyways, great take on the greyscale approach.
Ohh, interesting, that might actually work. It'll probably look different in Godot since I don't use a z-index, but the principle of it should probably be possible to add into code.. I might look into seeing if it is possible, would probably be nice for the reason you outlined! Thanks !
@@Nonsensical2D I think you showed an example on how to do 2.5 parallax like hollow knight and you had like -3, -2, -1, 0... canvas layers. I think that layering would be a good number to sample a gradient from. But yeah, I'm sure you can figure it out much better than me haha. Thanks for all your videos, they have sparked a lot of improvements in my ongoing project.
It's cool how you draw grayscale gradient assets, I'd like to watch a tutorial on that
This is something I might actually cover a bit in a future, but in relation to values.
Could you maybe make some sort of video about top down art. I think it’s pretty hard to make it look good. I would love some tips on how to make the environment look less empty and just how to make art look good in top down.
Yes, I have thought about it and played around with it a bit, I don't know exactly when though.
Interesting. At first I thought you meant should your game be gray. I thought about a monster taming game idea I wanted to work on which took place around 1920's and the game would have been gray with only a few spots of color to highlight important objects. lol.
It seems like the grayscale could work if you want the entire object to be one color but for something like a flower, you'd have to make the flower part separate from the stem and leaves. That seems like it's more effort than it's worth. But the versatility of the objects it would work for seems worth it. But I'm working on developing my watercolor skills so I don't think this would look as good with watcolor.
Ye for sure, I wouldn't use it for my foreground assets I think, it removes too much of the nuance to each asset. but for backgrounds where you want it to be simple it could work :)
Thank you so much for the video. It is awsome.
Achievement unlocked: you have discovered materials! Also, single gradient bg look nicer and less intrusive.
Really enjoying the regular uploads. I feel like i already know the answer, but would you consider 3D videos or is that nonsensical?
I'm not entirely sure I would do content on standard 3D art, but I have already played around a bit with 2d and 3d mixed environments, similar to cult of the lamb and I will eventually do content on that. I don't know exactly when though, since I don't have that much time to dedicate to the channel (because of work). I am currently focusing on simpler projects (like this one) and just practicing making videos quicker.
@Nonsensical2D That's fair enough, I understand. Are there any channels you would recommend that focus on 3d art?
Love the video! Have you ever thought about starting a patreon? Would love to be able to support
Thanks, I appreciate it! I have considered it, I have just wanted to ensure that I can release about a video a week first ( which is finally starting to happen)
could you link in description the article about dead cells ?
I honestly haven't checked the rules for linking on RUclips but the article name is "Art Design Deep Dive: Giving back colors to cryptic worlds in Dead Cells" on the website game developer. It's an interesting article :)
What book were you reading?
"you can't do that with a gradient texture"
Me: looking at my 2d gradient texture that stack many gradient on top of each other and just sliding the V to get all the missing effect 😏
>not coloring in UV scale
My dear friend...you are a gem. I have been subscribed to you for a while, never got your good name?
Thanks, I appreciate it :) I haven't really decided on whether to share my name publicly, so I guess Nonsensical is fine :)
@@Nonsensical2D No worries. Nonsensical...you are a gem :D
Hey buddy please do video on 2d tilemap please
Ye, I will, but I always have a couple of videos where the scripts or material is already finished this means that even if I was to begin with a video idea now, it would take a while to finish it. Especially since I do this barely part time xD There should be a couple of good videos on tile maps out there in the meantime though :)
@@Nonsensical2D i have one doubt how many levels required for a an indie 2d game
first 🔥
hi, can i have ur discord ? i want to learn how to make art and game desing and ask u question about this thing [2D] if you can ty
I sadly don't have a discord for the channel. You could write to me on reddit, Nonsensical2D