Creating a seamless grass tile
Step 1)
Choose your colors. You can do this as you go, or just pick some from the start, usually four shades are all you need. If you want to just practice with my palette, go ahead. I seem to divide these shades into two groups. The 'base' colors, and the 'highlight' colors. The two lightest colors jump a bit in brightness, to add that bit of contrast that you need to portray depth in the grass. The base colors are just the two darkest, one is the color that's going to fill the 'empty' space, and the darkest is going to be used to give some deepness to the grass. In the end, try not to create anything too drastic in one direction. Such as too bright and saturated, or too dark and unsaturated. Something too saturated hurts the eyes, and something too dark or unsaturated looks dead and gloomy(unless you want something like that). I usually like picking stuff just in the middle.
Step 2)
Plot the shape. So of course, you start with a 16x16 pixel tile, filled with the second to darkest shade of your palette. Now, take your second lightest shade, and start randomly blotting out blades of grass. Make sure as you do that, you try to keep them relatively the same size. Smaller blades are fine usually, as they tend to just fit in and are a good way to fill space you're having trouble filling. Larger blades though, larger than any of the others, will stand out as they tile. Also, try to even the shapes out, as in not having a large area filled with small blades, then the next area with lots of larger blades. When you're finished, tile them out on an empty piece of the canvas and see how it tiles, go back and make any changes you feel are needed until it beings to look decent.
Step 3)
Give it depth. You'll take your darkest shade and begin putting pixels between the blades you drew out(not on them!). Just like the blades of grass, try not to make any of them too differently as they will stand out just as much as the blades themselves. I made some bad choices with this step in my example and I'll explain later on why. You'll basically want to keep them to single pixels or two pixels adjacent.
Step 4)
Highlight the blades. This is when the grass really starts to come together, and can really start to show its flaws. You'll want to take the second lightest shade and begin putting a few pixels at the top of the blades(inside the blades, not in the base color area!), and shape to them. Try not to put any highlights at the base of the blades. You can look at my example to note where I put them. If you have some experience with drawing and lighting then this will be a bit easier. After you finish, it might look as though it's done, but you're far from it. The next step is the most time-consuming.
Step 5)
Touch-ups. This is where the hard work comes in. It's time to touch it up and make sure it tiles as best as you can make it. My example in this step might look similar to my last example, but there are a lot of subtle changes that make all the difference. Even one pixel in a tile this small can make the outcome change drastically, and there were a lot of cases like that as I made this tile. The best way to do this is to tile it out on an empty piece of your canvas, first of all. Zoom out to 100%. Look at it, you should spot your own tiling errors. What stands out, what repeats. Now the best way to tackle this is to take a bright color like yellow, and draw a small circle around the part that needs to be fixed. Now you can zoom in and be able to find it(trust me, just zooming in and trying to find it is very hard, as it looks so differently zoomed out). Now take note of where the error is, and make tiny changes to it. If you notice a blade is too long, and shows up while tiled, take off a pixel. Earlier I noted I made mistakes in step 3. The mistakes I made were the 3 dark pixels that were forming triangles. They looked like they would be fine, but tiled... they stood out a lot. If you notice 'blank' spots in the grass(too much of the base color), fill it somehow, I extended a few of the short blades of grass near it into the blank areas. Repeat this until satisfied.
Now, a single grass tile isn't practical nowadays(though it makes leveling SO much easier), but it's a good practice in itself. It teaches you how to work with the limitations of the small space of a single tile, and also teaches you how a single pixel can make all the difference, which is a huge part of pixel-art.
If you have any questions, I don't mind answering.
05-08-2007, 11:31 PM
Linear Mode
