Wednesday, February 6, 2013

Things I've learned about making tiles

I like making tiles for pixel based games.  I prefer making RPGs, but there are lots of genres that use tiles to make up the graphics of a game.  Between my involvement in the Liberated Pixel Cup and my latest RPG project, I've learned a lot about how I thought making pixel art for games worked, and how they actually work.  I'm still learning, but I think I have enough info to share for those who would like to do the same.



Mockups are not the same as in game art.

Let's say you have a picture you've put together and you want to make tiles out of it.  Do the pieces line up perfectly with a 32x32 grid?  Do you actually want them to be?  How many layers would you need to pull it off if it were all tiled together?  Does something not touch in the mockup that has to touch and look good together if it were a game?  Mockups are significantly easier to make look good than a screencap.  In fact, a good mockup will always look better than the equivalent screencap.  There's more rules and functionality that you have to consider, things that are easy to implement in a mockup that would take an exponential amount of work to implement in game.  It took me a while to realize that not recreating a mockup wasn't a failure on my part.  Once I got past that, I could start focusing on how to start with those differences in mind and I could work much faster and make better quality art.

Form is more important than detail.

This is a basic pixel art rule that took me a long time to really grasp.  When working on a grass tile, you're not making grass, you making an icon that represents grass.  It helps a lot to figure out what makes grass seem grassy.  The color?  The texture?  The contrast?  Understanding this was my personal key to understanding how to make a rock look like a rock.  I was focusing on the texture of the rock, but what makes a rock look like itself is it's shape.  Often times you don't need texture at all.  On the other hand, grass isn't it's shape at all, but it's texture.  If you get the texture right, the shape doesn't even have to remotely look like a blade of grass.  Metal and water are all about the contrast.  You get the right lighting and it won't matter what the color or shape is.  Figuring out the form is what they all have in common.  If you can use large brushes and make something that still looks like what it represents, then you've got all the hard work done.  All the detail like the bark on a tree or the petals of a flower is either icing or just gets in the way.  Usually what you're doing is implying the detail, not actually adding it in.

Look up some HDR photos, the more processed the better.  When done badly, these photos no longer look like photographs, and the subject matter looks flat and emotionless.  The detail is amazing but that's all it has.  There is no mood, no depth, even the color starts loosing its potency.  The subject has lost its form and therefore lost its meaning.  When working in pixels, there's no room for all that detail.  It may be accurate to try and add a bunch of gold embroidery on your prince's coat, but if you do you he won't look like he's wearing a coat anymore.  A touch of gold color in key places is all you need.

Always use reference photos.

I don't care how well you know the subject matter, or how you aren't trying for realism, a reference photo will always make your artwork better.  This is connected with the last point, the more you study a subject you'd like to draw, the more you'll understand it's form, it's essence.  Knowing those things thoroughly lets you push things to their limit.  You'll be able to draw something that people will recognize as a tree, but will have almost none of the elements that we use to define something as a tree.  Or you'll be able to make it seem like a realistic interpretation despite being such a tiny picture.  There will always be something new to learn, so make sure you have whatever you need at your disposal to make the best art you can.

On a related note, since pixel art is such a stylized art form, references of other pixel art are just as useful as photographs.  I've got a huge collection of pixel art from artists I'd like to emulate or learn from.  Sometimes I'll keep things that aren't even that good because there's something in the artwork that tells me something about mine or gives me an idea of how to become better or do it differently.  Seeing how other people solved the same problems can save you lots of time.

Better tools can make a big difference in quality of art.

When working on the LPC, I did almost all the artwork using Photoshop.  Now, there's nothing wrong with that, Photoshop is a very powerful and versatile tool.  I still use it in my pixel pushing. However, since then I've discovered tools like PyxelEdit and I took the time to learn how to use Graphics Gale.  Both of these tools have made me more efficient, letting me see what I was doing in a game like situation.  This meant I spent less time and energy fixing mistakes and more time could be spent on getting it right the first time or just on tweaking it to look prettier.  It's like building something and only using hand tools.  Just because you can do it doesn't mean it's the best set of tools for the job.  Power tools exist for a reason, use them!

Making art for a programmer is much easier than making art for an engine.

By engine I don't mean the type of engine where you'd still need a programmer to make the game.  I mean engine like Adventure Game Studio, Renpy, or RPG Maker.  These are built with an artist in mind, you don't have to know any programming to make a game, and you can spend as much time and effort as you like on your art.  Those are all advantages, but if you don't want to make a game, you only want to draw, getting a programmer is so much easier.  There's no figuring out how to make the art look good within the rules of the engine, you just put together something that looks pretty and is laid out neatly and programmer makes it all work in the game.  Do you want to use 32x32 and 16x16 together on the same map?  I can't think of an engine that allows for this. Do you want to use the same tiles only flip them so you only have to draw a left wall and not the right?  If you want to do that in RPG Maker, you're out of luck, but a programmer won't have any troubles pulling it off.  Do you want 10 possible layers on a map?  With a programmer, not a problem.  Prebuilt engines are really great for getting a game out fast or being a one person army, but if you want freedom to make something really outside the box, you'll want a programmer.  The nice thing is, if you have some skill in art and the dedication to follow through with a project, the programmers will come to you.  Be nice to them though, being a programmer is just as thankless a job as being an artist.

Making art for an engine teaches a lot about efficient tile design.

I wish I'd made a tileset for RPGMaker before working on LPC.  I would make a lot of different decisions about how I did some things.  Things like how to put together the tops of the walls or how to transition between water and multiple types of ground could have been done more effectively.  I'm still working on my RM game, but I've learned a lot about how they make the tiles the way they do and why they do it.  I don't agree with all of them, but thinking about the hows and whys have helped me understand how to make better tiles.  It's a little like looking at other pixel art, only more in depth and focused.

1 comment:

  1. Las Vegas Resort & Casino: Casino & Resort Map & Floor Plans
    This map is a subset of the complete casino floor plans of The Wynn Las Vegas, 대구광역 출장샵 The 제주 출장샵 resort features 2,034 동해 출장마사지 guestrooms, 19,000 진주 출장마사지 square feet of casino space 경주 출장안마

    ReplyDelete