[Tut] [Texture Set]Wall Shadows/Bevels 100px grid-20px walls

For everything about graphics/tokens developed by users and offered for others to use in their games.

Moderators: dorpond, trevor, Azhrei, giliath, Gamerdude, jay, Mr.Ice

Post Reply
User avatar
aliasmask
RPTools Team
Posts: 9024
Joined: Tue Nov 10, 2009 6:11 pm
Location: Bay Area

[Tut] [Texture Set]Wall Shadows/Bevels 100px grid-20px walls

Post by aliasmask »

I always liked seeing the drop shadow on walls because it gives that map an extra dimension. But if you're like me and like drawing your walls, then it's a big pain to organize just your walls, export the image, put a drop shadow on it, then drop in the large image.

Well, I made a basic set of wall shadows for 100px grid and 8 angles. As long as your walls are 20px wide and stay on the grid, these shadows should handle all situations. When drawing the shadows, I change my grid to 50px so I can shadow half squares and I switch from the square tool to the polygon (usually for angled walls). I'll let you play around with it, but there are some drawing techniques that help things go smoother. One tip is to draw the shadows on the object layer and have your floor and walls on the background layer. So, if you make a mistake it's easy to fix. Plus the shadow on top of the wall gives the wall a little dimension. You see the difference if you draw the wall, then shadow, then wall over the top all on the same layer.
||| Example |||
Wall Shadows.jpg
Wall Shadows.jpg (168.12 KiB) Viewed 10711 times
Depending on how complicated your map is, it can be a little tedious putting is all the different angles and transitions, but once you get used to it, it goes pretty fast. I tried to name the shadows where it would be easy to identify. I also set the basic shadows in my palette for easy access (see below). The third row has my square shapes (vertical, horizontal, inside corner, outside corner). The second line has my angled shapes (right diag, left diag, endcap up, endcap down). The fourth row I put my wall and floor textures.
||| Palette |||
palette.jpg
palette.jpg (11.17 KiB) Viewed 10711 times
I wasn't sure if I should have put this in the tile sets, because it kind of is... but is specifically for your textures. So, it's a textures-set. You can't use most of these as a token. I also included in the zip the original pspimage file that I used to create these wall shadows.

edit: Also, putting the shadows on a different layer allows for a quick change of walls and floors. Also, it's really easy to draw VBL if you stick to the lines.
||| Example |||
Wall Shadows2.jpg
Wall Shadows2.jpg (83.03 KiB) Viewed 10699 times
edit: I've added a new zip with the original shadows (redone, but the same) as well as a couple of bevel options for the walls.

Included in the zip are the following folders:
  • Wall Shadows - Shadows only (same as first file)
  • Shadows - Same as above with without the wall part cut out.. so from the grid line.
  • Smooth Bevel - Adds a smooth bevel to the wall.
  • Rocky Bevel - Adds a rocky bevel to the wall.
  • Brick Bevel - Adds a brick bevel to the wall. (this is a very subtle change from smooth)
  • With Shadows - The three bevel folders each have this folder with the shadow already included with bevel.
  • PSP - original Paint Shop Pro files used to create shadows and bevels. I also used the Satin Gloss filter for the bevel layer as a base image to work with to create the bevels.
  • More wall shadows - I included a set of shadows 70% lighter:
    /// View Difference \\\
    Lighter and Darker difference example
    Lighter and Darker difference example
    imgExport.png (728.29 KiB) Viewed 10567 times
||| Bevel Example |||
Image
    • Wall Shadows and Bevels
    Image

User avatar
Azhrei
Site Admin
Posts: 12086
Joined: Mon Jun 12, 2006 1:20 pm
Location: Tampa, FL

Re: Wall Shadow Textures [Texture Set - 100px w/20px wall]

Post by Azhrei »

Cool.

At some point, MT will get the ability to modify how the textures are applied to the map: gradients, rotation, scale, and so on. So a gradient that can be rotated to automatically match the angle of the drawable line and uses a miter corner would take care of all shadow drawing, I think. The only problem then becomes corners where two textures overlap...

But this will be awhile, most likely.

User avatar
aliasmask
RPTools Team
Posts: 9024
Joined: Tue Nov 10, 2009 6:11 pm
Location: Bay Area

Re: [Texture Set] Wall Shadow Textures 100px grid for 20px w

Post by aliasmask »

I just added another texture set here: http://forums.rptools.net/viewtopic.php?f=8&t=20763

I'm finding the need to make a shadow set for walls that are flush to the grid as well. Should be easy to duplicate this set with that minor change. These are roughly 10px away from the edge. Since I'll likely be combining the 2 shadow sets on a map, I'll make sure to create some transitions as well from one set to the next.

User avatar
aliasmask
RPTools Team
Posts: 9024
Joined: Tue Nov 10, 2009 6:11 pm
Location: Bay Area

Re: [Texture Set] Wall Shadow Textures 100px grid for 20px w

Post by aliasmask »

Okay, nearly done with wall bevel set. I'm going to create them with and without the wall shadow since they'll be applied the same way to the map... no sense in doing it twice if you want both. Here's what I have so far. From top left going clockwise there is the texture with no bevel, smooth bevel, brick bevel and rocky bevel. I'm also going to add the shadows with no wall cut out for walls that appear flush with the grid line. I have a lot of work to do, but it's just busy work. I have 14 tile types and 8 sets to do.
Attachments
Image6.jpg
Image6.jpg (20.34 KiB) Viewed 10652 times

User avatar
aliasmask
RPTools Team
Posts: 9024
Joined: Tue Nov 10, 2009 6:11 pm
Location: Bay Area

Re: [Texture Set] Wall Shadows & Bevels 100px grid w/20px wa

Post by aliasmask »

Okay, done. I've created a set of bevels for the walls, with and without the shadows. See first post.

User avatar
Jshock
Dragon
Posts: 311
Joined: Sat Jan 26, 2008 8:55 pm
Location: West Warwick, RI
Contact:

Re: [Texture Set] Wall Shadows & Bevels 100px grid w/20px wa

Post by Jshock »

I'm fiddling with this at the moment; I like the concept. Let me know if I have the workflow correct here:

1. Lay down floors & walls @ 100px grid, wall width 20px (BG layer).

2. Switch grid to 50px (Map/Adjust Grid).

3. Use rectangle or poly tool. Set shadow/bevel to fill (not line). Fill squares alongside drawn wall on Object layer (presumably start with corners, end with walls); eraser away excess.* Repeat until done.

4. Switch grid back to 100px. Add furniture.

*if you're snapped to 50px, you don't need to do this!

User avatar
aliasmask
RPTools Team
Posts: 9024
Joined: Tue Nov 10, 2009 6:11 pm
Location: Bay Area

Re: [Texture Set] Wall Shadows & Bevels 100px grid w/20px wa

Post by aliasmask »

Jshock wrote:I'm fiddling with this at the moment; I like the concept. Let me know if I have the workflow correct here:

1. Lay down floors & walls @ 100px grid, wall width 20px (BG layer).

2. Switch grid to 50px (Map/Adjust Grid).

3. Use rectangle or poly tool. Set shadow/bevel to fill (not line). Fill squares alongside drawn wall on Object layer (presumably start with corners, end with walls); eraser away excess.* Repeat until done.

4. Switch grid back to 100px. Add furniture.

*if you're snapped to 50px, you don't need to do this!
More or less. Since I do the shadows on the object layer, so I don't accidentally mess up the background, it can be done as a finishing touch. I takes some getting use to for some of the shadows like the diag up/down. Order doesn't matter all that much.. just whatever works best for you.

The great thing about putting the shadows on the object layer is when I'm looking at an area I may change up the floor and/or walls for that room and it won't mess up the shadowing.

I would be interested in any maps you might use with the shadowing if you care to post it when you're done with it. I'll do the same after this next Sunday.

User avatar
jfrazierjr
Deity
Posts: 5176
Joined: Tue Sep 11, 2007 7:31 pm

Re: [Texture Set] Wall Shadows & Bevels 100px grid w/20px wa

Post by jfrazierjr »

Good stuff. IMO though, the shadows are a bit too sharp, but that's a personal preference thing and could look different in Maptool vs the few screenshots I see above. Even still, thanks a ton for the contribution!!
I save all my Campaign Files to DropBox. Not only can I access a campaign file from pretty much any OS that will run Maptool(Win,OSX, linux), but each file is versioned, so if something goes crazy wild, I can always roll back to a previous version of the same file.

Get your Dropbox 2GB via my referral link, and as a bonus, I get an extra 250 MB of space. Even if you don't don't use my link, I still enthusiastically recommend Dropbox..

User avatar
aliasmask
RPTools Team
Posts: 9024
Joined: Tue Nov 10, 2009 6:11 pm
Location: Bay Area

Re: [Texture Set] Wall Shadows & Bevels 100px grid w/20px wa

Post by aliasmask »

jfrazierjr wrote:Good stuff. IMO though, the shadows are a bit too sharp, but that's a personal preference thing and could look different in Maptool vs the few screenshots I see above. Even still, thanks a ton for the contribution!!
When you say sharp, do you mean the gradient is too dark, too fast? I kind of agree, but it does look better on the map at 100% and I wanted to keep the texture with in the 50px, but have it darker at the wall. The only shadow that's not in the 50px square is the acute angle. That's why I have 4 of those, rather than 1 or 2 textures.

I also made some circular shadows, but I'm considering how I want to implement them. I'm considering just doing them as stamps where they're broken up in to arcs and transitions. If I were to do as a texture, then I would need multiples for grid offsets. For example, I would need 36 for a 15' radius. Problem with stamps is I either make one big one and then you can use a layer above it to conceal the parts you don't want shown or make an arc so multiple stamps would make the circle or partial circle. The problem with that is those segments become cumbersome when trying to place them.

I'm open to any suggestions though. Here's an example arc:
/// Arc \\\
test circle.png
test circle.png (5.53 KiB) Viewed 10586 times

User avatar
Jshock
Dragon
Posts: 311
Joined: Sat Jan 26, 2008 8:55 pm
Location: West Warwick, RI
Contact:

Re: [Texture Set] Wall Shadows & Bevels 100px grid w/20px wa

Post by Jshock »

aliasmask wrote:I would be interested in any maps you might use with the shadowing if you care to post it when you're done with it. I'll do the same after this next Sunday.
Needs some groceries on the shelves & other stuff, but here's my test:

Image

This method does lay down really fast; I had a plan to work from, but after I got my palette set up, the above only took me @ 20 minutes.

I do think it might be a little dark - I'm not familiar with PSP, but if that was photoshop / gimp I'd say the dark end of the gradient is like 90-95% opacity; I'd drop it down to like 70-75%.

User avatar
jfrazierjr
Deity
Posts: 5176
Joined: Tue Sep 11, 2007 7:31 pm

Re: [Texture Set] Wall Shadows & Bevels 100px grid w/20px wa

Post by jfrazierjr »

aliasmask wrote:
jfrazierjr wrote:Good stuff. IMO though, the shadows are a bit too sharp, but that's a personal preference thing and could look different in Maptool vs the few screenshots I see above. Even still, thanks a ton for the contribution!!
When you say sharp, do you mean the gradient is too dark, too fast? I kind of agree, but it does look better on the map at 100% and I wanted to keep the texture with in the 50px, but have it darker at the wall.
Yep, thats what I mean. I tend to prefer wall shadow's be a bit more "soft". More of an accent where it just looks natural, but your not quite sure why until you really look at it(assuming you know what your looking for). But, as you said, I have NOT played with this on a map, so it may look perfectly fine with most "floor" textures once down on the map. In any event, thanks for sharing!

As for the arcs... it's kind of hard to say.... For myself, if I had an odd shaped room, I would likely make my own shadows in GIMP as a stamp based upon the exact dimensions needed, but thats just me and I know some people are really shy of trying to do more advanced image editing. If you just make round rooms, then you would want to make a gazillion difference sizes(to keep the shadow's consistent width the user would have to pick the right size "room"), but then you get into issues with how many doors, where are they located, etc which just multiplies your "stamps" needed. On the other hand, if you go with arc segments, then the shadows are consistent width and stuff you don't have to deal with doors(assuming you place a door section over an "end cap" of a wall and it just looks right), but you had to make a gazillion arc angles to accomidate different rooms sizes.... ugh.. Another down size to this approach vs multiple "fully round rooms pre created" is that the end user has a lot more fiddling to in order to get things lined up which is especially annoying since there is no way to "lock" a tile once dropped... which means if you drop in the wrong place you are just as likely to click on the wrong tile.....either way, it's a lot of work for you.
I save all my Campaign Files to DropBox. Not only can I access a campaign file from pretty much any OS that will run Maptool(Win,OSX, linux), but each file is versioned, so if something goes crazy wild, I can always roll back to a previous version of the same file.

Get your Dropbox 2GB via my referral link, and as a bonus, I get an extra 250 MB of space. Even if you don't don't use my link, I still enthusiastically recommend Dropbox..

User avatar
jfrazierjr
Deity
Posts: 5176
Joined: Tue Sep 11, 2007 7:31 pm

Re: [Texture Set] Wall Shadows & Bevels 100px grid w/20px wa

Post by jfrazierjr »

Oh... on a side note if you willing to spend some extra time on it... while I LOVE tiles that let me make rooms of any size/shape, it's also REALLY nice to have tons of premade ones(sans floor of course). This goes back to my previous comment on how much a PITA it is to deal with tile selection and may be a moot point after 1.4, depending on the features we can implement in the "new" layer system. ie, fast enough for "common" uses, but flexible enough for just about any possible scenario you might want to do. I plan to eventually do a subterranean tile set(inspired by GE's), but also including a large number of pre-made caverns for quick placement(my game is all underground at the moment).
I save all my Campaign Files to DropBox. Not only can I access a campaign file from pretty much any OS that will run Maptool(Win,OSX, linux), but each file is versioned, so if something goes crazy wild, I can always roll back to a previous version of the same file.

Get your Dropbox 2GB via my referral link, and as a bonus, I get an extra 250 MB of space. Even if you don't don't use my link, I still enthusiastically recommend Dropbox..

User avatar
aliasmask
RPTools Team
Posts: 9024
Joined: Tue Nov 10, 2009 6:11 pm
Location: Bay Area

Re: [Texture Set] Wall Shadows & Bevels 100px grid w/20px wa

Post by aliasmask »

Because it was so easy, I went ahead and added another set of shadows 70% lighter. I would have redone the set, but I'm thinking of updating the brick bevel. I think when I rotated, the brick didn't translate too well.

User avatar
aliasmask
RPTools Team
Posts: 9024
Joined: Tue Nov 10, 2009 6:11 pm
Location: Bay Area

Re: [Texture Set] Wall Shadows & Bevels 100px grid w/20px wa

Post by aliasmask »

Concept-wise, I think this was a good idea, but application is a pain in the booty. If you have no other options, then this will work fine, but I have ultimately resorted to using my graphics program to do drop shadows for me. I basically create all the walls and floors and then set design in MT.

Post Reply

Return to “Tilesets, Token Libraries, and Complete Maps”