AuthorTopic: GR#036 - Tile Layout [WARNING: Image Heavy Thread]  (Read 66231 times)

Offline HughSpectrum

  • 0010
  • *
  • Posts: 283
  • Karma: +0/-0
    • View Profile

Re: Flak - Game Sprites and Tiles

Reply #10 on: February 03, 2010, 01:03:18 am
Draw the tiles without trying to create a grid.  If you want a grid, just draw grid lines in-game and you'll get a more pleasing effect than what you have now.

Offline Olothontor

  • 0010
  • *
  • Posts: 238
  • Karma: +0/-0
    • View Profile

Re: Flak - Game Sprites and Tiles

Reply #11 on: February 03, 2010, 01:29:41 am
... Good point.  :o

The major problem I see branching from that is that they'll end up being segmented. How would I solve that problem?
"In a mad world, only the mad are sane." - Akira Kurosawa

Offline vierbit

  • 0010
  • *
  • Posts: 158
  • Karma: +0/-0
  • 0.09 posts per day
    • View Profile

Re: Flak - Game Sprites and Tiles

Reply #12 on: February 03, 2010, 07:23:18 am
I just describe how I create stuff like that, itīs not necessary a tutorial. There probably also other ways to do it,
so dont see it as THE way.

Offline Olothontor

  • 0010
  • *
  • Posts: 238
  • Karma: +0/-0
    • View Profile

Re: Flak - Game Sprites and Tiles

Reply #13 on: February 03, 2010, 02:10:03 pm
Excellent! I will certainly take some of those tips into account. Thank you, I really appreciate it.
"In a mad world, only the mad are sane." - Akira Kurosawa

Offline HughSpectrum

  • 0010
  • *
  • Posts: 283
  • Karma: +0/-0
    • View Profile

Re: Flak - Game Sprites and Tiles

Reply #14 on: February 03, 2010, 02:38:33 pm
That is brilliant.  I thank you so much for the maptiling tip.

Offline Olothontor

  • 0010
  • *
  • Posts: 238
  • Karma: +0/-0
    • View Profile

Re: Flak - Game Sprites and Tiles

Reply #15 on: February 03, 2010, 02:53:58 pm


I am incredibly dissatisifed, but at least it's progress. I'll work on making more varied tiles.

« Last Edit: February 03, 2010, 03:42:38 pm by Olothontor »
"In a mad world, only the mad are sane." - Akira Kurosawa

Offline Mathias

  • 0100
  • ***
  • Posts: 1797
  • Karma: +2/-0
  • Goodbye.
    • http://pixeljoint.com/p/9542.htm
    • View Profile

Re: Flak - Game Sprites and Tiles

Reply #16 on: February 03, 2010, 03:49:58 pm
Nice demo, Vierbit!
Hopefully Olo understands the offsetting part. I do this with Photoshop, which has a filter that does it, found at Filter > Other > Offset (just input half of the image's pixel dims in the horizontal and vertical fields). Very fast.



Olo, what about transitions? All you've posted so far are solid tiles. How do you plan to handle transitioning from one surface type to another?

You may not be ready to jump into transitions but you'll benefit greatly from getting a grip on the following.

Here's some more square tiling theory for you. (the following tile examples use 32px X 32px tiles. It's best to keep your tile's dims to a binary number for video card optimization [2,4,8,16,32,64, etc])


The simple 16-Tile System. With only 16 base tiles, you can make any combination of terrain. Vierbit gets into creating tile variations above. Variations aren't even a concern here with this, though very relevant with making nice random tiling solid tiles that obfuscate the grid. You can have as many variations as you want, but they're not necessary to make the 16-Tile System work. Check it out:




See what Blizzard did with this method for WarCraft II. Below I've taken a screencap and overlaid the "simplified" tiles illustrating where the transitions are. (ignore the grey stone walls, they use a different tiling system than the rest)



And here are the simplified 16-tile master sets I made to create every bit of the simplified overlay in the above screencap:



An additional example of WC2's tiles being simplified:



Seam Points are an important feature of creating good transition tiles. They're simply a standard place in the edge of each transition tile where the visual transitions between tiles must meet in order for all tiles to link up correctly.
The yellow dots overlaid in the image below depict where the Seam Points are. Critically important is that they're all the exact same distance from the corner of the tile closest to where the visual transition is taking place . . . if that makes any sense. I know it's confusing at first, but I promise it's all very simple in reality.



BONUS TREES 1 - BONUS TREES 2 - BONUS TREES 3


This is all my own research, so lemme know if anything is unclear. A lot more could be said, the images may not speak for themselves.

« Last Edit: January 28, 2016, 08:45:34 pm by Indigo »

Offline Olothontor

  • 0010
  • *
  • Posts: 238
  • Karma: +0/-0
    • View Profile

Re: Flak - Game Sprites and Tiles

Reply #17 on: February 03, 2010, 03:55:50 pm
I will study this in-depth. Transitions between one type of ground to the next is something I had considered, but I figured I would put it off until I could at least master overall tiling for ONE ground type.

And, hey, I was actually looking for Warcraft II tiles for study earlier, never found any. Those will help immensely.

Also, I figure it's worth mentioning: my partner and I have made this a sort of one-month deal. We intend to finish by February 28. It's like NaNoWriMo for game development!
« Last Edit: February 03, 2010, 04:12:45 pm by Olothontor »
"In a mad world, only the mad are sane." - Akira Kurosawa

Offline Mathias

  • 0100
  • ***
  • Posts: 1797
  • Karma: +2/-0
  • Goodbye.
    • http://pixeljoint.com/p/9542.htm
    • View Profile

Re: Flak - Game Sprites and Tiles

Reply #18 on: February 03, 2010, 04:34:07 pm
It may be wise to wait to tackle transitions. It's whatever you're comfortable with.

I think anyone reading this interested in tiling should go ahead and grab WarCraft II, and play with the level maker. Using it you can easily slap down tiles of any kind and see how they work together.
You know you understand when you can create a random configuration of tiles and overlay the simple tiles on top to match WC's tiles.



***EDIT      Most users will have to use DOSbox to run WarCraft II these days.
« Last Edit: February 05, 2010, 07:18:12 pm by Mathias »

Offline vierbit

  • 0010
  • *
  • Posts: 158
  • Karma: +0/-0
  • 0.09 posts per day
    • View Profile

Re: Flak - Game Sprites and Tiles

Reply #19 on: February 03, 2010, 04:55:04 pm
@Mathias

Great tutorial :y:
Yeah thats exactly how I do it too. I actually posted a similar explanation for transition tiles some time ago, not that detailed though.
But canīt find the image now.

Well, hopefully the explanation is no overkill for Olothontor  ;)
-
edit: found the image
http://www.wayofthepixel.net/pixelation/index.php?topic=6499.msg76586#msg76586
« Last Edit: February 03, 2010, 08:32:48 pm by vierbit »