Thesis on Tile Art

<body topmargin=0 leftmargin=0 marginheight=0 marginwidth=0> <table cellpadding=0 cellspacing=0 border=0><tr> <td valign="top" height=95 BGCOLOR="#CC99CC" TEXT="#080000" background="006265f1ezuady.png"> <div> <FONT SIZE="5" COLOR="#000000" FACE="Times New Roman" ><B>Final Fantasy Chronicles News</B></FONT><B>  </B><B> </B><B>|   </B><A HREF="index.htm" TARGET="_top" TITLE="Final Fantasy Chronicles News"><U><B>home</B></U></A></div> <div> <A HREF="id33.htm" TARGET="_top" TITLE="ChocoboMonkeys Art"><U>ChocoboMonkey's Art</U></A>   |   <A HREF="id34.htm" TARGET="_top" TITLE="ChocoboMonkeys Tile Creation"><U>ChocoboMonkey's Tile Creation</U></A>   |   <A HREF="id35.htm" TARGET="_top" TITLE="CHRs"><U>CHRs</U></A>   |   <A HREF="id36.htm" TARGET="_top" TITLE="CR2s"><U>CR2's</U></A>   |   <A HREF="id37.htm" TARGET="_top" TITLE="CHRs 2"><U>CHRs 2</U></A>   |   <A HREF="id38.htm" TARGET="_top" TITLE="Learning to Draw"><U>Learning to Draw</U></A>   |   <B>Thesis on Tile Art</B>   |   <A HREF="id40.htm" TARGET="_top" TITLE="Tile Making with Photoshop 5"><U>Tile Making with Photoshop 5</U></A>   |   <A HREF="id41.htm" TARGET="_top" TITLE="V2 Tutorial"><U>V2 Tutorial</U></A>   |   <A HREF="id42.htm" TARGET="_top" TITLE="Collision Detection"><U>Collision Detection</U></A>   |   <A HREF="id43.htm" TARGET="_top" TITLE="DMA"><U>DMA</U></A>   |   <A HREF="id44.htm" TARGET="_top" TITLE="Working with Bits"><U>Working with Bits</U></A>   |   <A HREF="id45.htm" TARGET="_top" TITLE="Item DAT Files"><U>Item & DAT Files</U></A>   |   <A HREF="id46.htm" TARGET="_top" TITLE="Menu Making"><U>Menu Making</U></A>   |   <A HREF="id47.htm" TARGET="_top" TITLE="Reading From Files"><U>Reading From Files</U></A>   |   <A HREF="id48.htm" TARGET="_top" TITLE="Savegames"><U>Savegames</U></A>   |   <A HREF="id49.htm" TARGET="_top" TITLE="Entity Talking"><U>Entity Talking</U></A>   |   <A HREF="id57.htm" TARGET="_top" TITLE="Mordred Tutorial 1"><U>Mordred Tutorial 1</U></A>   |   <A HREF="id58.htm" TARGET="_top" TITLE="Mordred Tutorial 2"><U>Mordred Tutorial 2</U></A>   |   <A HREF="id59.htm" TARGET="_top" TITLE="Mordred Tutorial 3"><U>Mordred Tutorial 3</U></A>   |   <A HREF="id63.htm" TARGET="_top" TITLE="Hicolor Fades"><U>Hicolor Fades</U></A>   |   <A HREF="id65.htm" TARGET="_top" TITLE="Tiny Tutorial on Multidimentional Arrays"><U>Tiny Tutorial on Multidimentional Arrays</U></A>   |   <A HREF="id67.htm" TARGET="_top" TITLE="V2.7 B10 Python Commands"><U>V2.7 B10 Python Commands</U></A>   |   <A HREF="id80.htm" TARGET="_top" TITLE="Overkills Tutorial 1"><U>Overkill's Tutorial 1</U></A>   |   <A HREF="id81.htm" TARGET="_top" TITLE="Overkills Tutorial 2"><U>Overkill's Tutorial 2</U></A></div> <div> </div> </td> </tr><tr> <td valign="top" height=385 BGCOLOR="#FFFFFF" TEXT="#080000"> <div> <A HREF="id12.htm" TARGET="_top" TITLE="Tutorials"><U>Tutorials</U></A>  |    <FONT SIZE="1" COLOR="#0000BF" FACE="Arial" ><A HREF="index.htm" TARGET="_top" TITLE="Final Fantasy Chronicles News"><U> home</U></A></FONT></div> <div> <A HREF="id33.htm" TARGET="_top" TITLE="ChocoboMonkeys Art"><U>ChocoboMonkey's Art</U></A>   |   <A HREF="id34.htm" TARGET="_top" TITLE="ChocoboMonkeys Tile Creation"><U>ChocoboMonkey's Tile Creation</U></A>   |   <A HREF="id35.htm" TARGET="_top" TITLE="CHRs"><U>CHRs</U></A>   |   <A HREF="id36.htm" TARGET="_top" TITLE="CR2s"><U>CR2's</U></A>   |   <A HREF="id37.htm" TARGET="_top" TITLE="CHRs 2"><U>CHRs 2</U></A>   |   <A HREF="id38.htm" TARGET="_top" TITLE="Learning to Draw"><U>Learning to Draw</U></A>   |   <B>Thesis on Tile Art</B>   |   <A HREF="id40.htm" TARGET="_top" TITLE="Tile Making with Photoshop 5"><U>Tile Making with Photoshop 5</U></A>   |   <A HREF="id41.htm" TARGET="_top" TITLE="V2 Tutorial"><U>V2 Tutorial</U></A>   |   <A HREF="id42.htm" TARGET="_top" TITLE="Collision Detection"><U>Collision Detection</U></A>   |   <A HREF="id43.htm" TARGET="_top" TITLE="DMA"><U>DMA</U></A>   |   <A HREF="id44.htm" TARGET="_top" TITLE="Working with Bits"><U>Working with Bits</U></A>   |   <A HREF="id45.htm" TARGET="_top" TITLE="Item DAT Files"><U>Item & DAT Files</U></A>   |   <A HREF="id46.htm" TARGET="_top" TITLE="Menu Making"><U>Menu Making</U></A>   |   <A HREF="id47.htm" TARGET="_top" TITLE="Reading From Files"><U>Reading From Files</U></A>   |   <A HREF="id48.htm" TARGET="_top" TITLE="Savegames"><U>Savegames</U></A>   |   <A HREF="id49.htm" TARGET="_top" TITLE="Entity Talking"><U>Entity Talking</U></A>   |   <A HREF="id57.htm" TARGET="_top" TITLE="Mordred Tutorial 1"><U>Mordred Tutorial 1</U></A>   |   <A HREF="id58.htm" TARGET="_top" TITLE="Mordred Tutorial 2"><U>Mordred Tutorial 2</U></A>   |   <A HREF="id59.htm" TARGET="_top" TITLE="Mordred Tutorial 3"><U>Mordred Tutorial 3</U></A>   |   <A HREF="id63.htm" TARGET="_top" TITLE="Hicolor Fades"><U>Hicolor Fades</U></A>   |   <A HREF="id65.htm" TARGET="_top" TITLE="Tiny Tutorial on Multidimentional Arrays"><U>Tiny Tutorial on Multidimentional Arrays</U></A>   |   <A HREF="id67.htm" TARGET="_top" TITLE="V2.7 B10 Python Commands"><U>V2.7 B10 Python Commands</U></A>   |   <A HREF="id80.htm" TARGET="_top" TITLE="Overkills Tutorial 1"><U>Overkill's Tutorial 1</U></A>   |   <A HREF="id81.htm" TARGET="_top" TITLE="Overkills Tutorial 2"><U>Overkill's Tutorial 2</U></A></div> <div> Thesis on Tile Art</div> <div> By KevM</div> <bR> <div> Introduction</div> <bR> <div> After glancing upon the lame title, I knew you were inclined to click! But anyhow, I will be discussing tile art, and basically all the steps of its creation. No, this article won't tell you how to put a pixel on the map, and I won't include some nifty little how to make a rock template.</div> <bR> <div> My goals of this article is to inspire all you budding tile artists out there to create magnificent masterpieces from ideas that flow from the rivers in your mind, and then effectively translate them to your game. When you are done, I want you all to say, "This isn't merely a game, but this is a work of art!" In case you were wondering I AM NOT insane hehe.</div> <bR> <div> Forming Ideas</div> <bR> <div> The main focus of tile art is expression of an idea and making a world of it. Motivation and a rich mind are suitable for the task at hand, unless you're the kind of punk that likes to rip or copy graphics off of a Snes rpg. Making graphics take time, and the more meticulously detailed they are, the better. This is where motivation and patience come into play.</div> <bR> <div> Without motivation, NOTHING would be done, and the project would be over just about as soon as it started. A point of motivation will have to be found somewhere. "I'll be elite and everybody will love me when I create these awesome graphics", or "I am truly an artist, and I will spread my beauty on yet another project". Basically, just think of something that keeps you interested in the project. Motivation and patience are basically interchangeable here.</div> <bR> <div> If you are not a writer, then you basically are left up to the will of those who DO write. Still, there is a lot of room for creativity whilst creating tiles. After receiving your mission, you should begin pondering on the best way to accomplish the task. </div> <bR> <div> Example: Say the writer asked you to draw some standard medieval houses. You have a few choices to do. You can either ask him to give you a more detailed description, or you can leave the job of creativity to yourself.</div> <div> Analysis</div> <bR> <div> Ok, say the idea up at hand is a house. Some questions to answer are:</div> <bR> <div> What kind of house is it? </div> <div> Is it a Victorian styled, or is it something modern.</div> <bR> <div> How detailed should I make it?</div> <div> Should I draw and texture every brick, or leave it more along the line of solid colors, to give it a cartoon-like appearance. Should I make it look old, and worn out over the ages? Is the grass around it tall, green, brown, etc.</div> <bR> <div> What side details should I include?</div> <div> Do I put in those cool little round pots, barrels, boxes, or what.</div> <bR> <div> Should I include any original elements?</div> <div> Do I make a statue with its own little story behind it? An original element is something that is used only once, usually for story related purposes.</div> <bR> <div> Those are the standard type of questions to ask when creating tiles. The next section will help you answer those questions.</div> <div> Finding ideas</div> <bR> <div> Without good ideas, the graphics will definitely come out to be mediocre. A GOOD idea is one that is original and well thought out. There are many, many places to get ideas from. Reading books definitely gets the mind moving. Read a book that is similar to the time period or style you want to hold your game to, for the core elements. Then you should read whatever you can lay your hands on for the formation of other ideas that may play a smaller role. Since you are an artist, it can only help to look at pictures. Find pictures of houses, trees, or whatever you are trying to draw.</div> <bR> <div> Check out other games, as you are doing something similar. It is good to learn things from other games, but it is NOT good to copy them. Art is all about expression, and how is it expression of your feelings if it is a rip of something else? Check out screenshots of Secret of Mana, or whatever beautiful 2d rpg you can lay your hands on. See how they did whatever, and lay some of the techniques on your own work.</div> <bR> <div> And last, but not least, a source to find ideas from is real life. Look at everything around you. Draw concrete or abstract ideas from them. "Hey I like that portrait. I think I'll fit that into the game somewhere."</div> <bR> <div> It is basically things like those to look out for. Now after you have gotten some sources for ideas, the next step is to organize them. Its not good to come up with a godly idea and then all of a sudden forget about it. Sketch them down on paper, or record them using the sexy program Notepad! And now you are ready to get started on the actual creation.</div> <div> Some good tools</div> <bR> <div> <A HREF="http://www.yahoo.com" TARGET="_top" TITLE="http://www.yahoo.com"><U><U>www.yahoo.com</U></U></A><FONT SIZE="3" COLOR="#000000" FACE="Arial" > or any other search engine</FONT></div> <div> <A HREF="http://www.rpgfan.com" TARGET="_top" TITLE="http://www.rpgfan.com"><U><U>www.rpgfan.com</U></U></A><FONT SIZE="3" COLOR="#000000" FACE="Arial" > or </FONT><A HREF="http://www.rpgamer.com" TARGET="_top" TITLE="http://www.rpgamer.com"><U><U>www.rpgamer.com</U></U></A><FONT SIZE="3" COLOR="#000000" FACE="Arial" > for rpg pictures.</FONT></div> <div> <A HREF="http://www.discovery.com" TARGET="_top" TITLE="http://www.discovery.com"><U><U>www.discovery.com</U></U></A><FONT SIZE="3" COLOR="#000000" FACE="Arial" > for real life pictures.</FONT></div> <div> Creation</div> <bR> <div> The two best skills to learn in life are the ability and patience to read, and the ability of analyzing something, and then applying it to your own use. Read the freaking Maped docs and learn them in and out. Then go download some tilesets and maps, and see how the artist did what he or she did. </div> <bR> <div> When creating tile graphics, learning symmetry is a MUST. The left side must blend flawlessly in with the right side, and the top must do the same with the bottom. Otherwise, gamers can see where the tiles are placed, which creates a VERY ugly look, and only serves to distract from the experience. So remember: Left side of tile blends with right side. Top side blends with bottom.</div> <bR> <div> There are some various ways you can go about accomplishing your goals. You can either use Maped, or you can use an outside paint program such as Paint Shop Pro. While using an outside program, be sure to have the palette set BEFORE you start working (if you are using 256 colors). Nothing can be worse than finding out how horribly your image translates to the set palette after working on it for so long.</div> <bR> <div> For larger objects such as trees, I recommend you use the outside program. Here is a tip to help make sure that your tiles cut up neatly. Make sure that the dimensions of the graphic are in multiples of 16. An example would be 16x32. Each tile is 16 pixels, so in this way, it enables Maped's import option to cut up the tiles in a satisfactory manner. </div> <bR> <div> Experiment until you get it right! Oh yeah, Maped has a transparency option, so don't forget that when creating shadows and lighting. Those are the easiest ways to do such effects. Use dark grey for shadows, and whatever color you wish for lighting. Learning to use layers are very important. I would recommend layer 1 for the ground items, like grass, rocks, etc. Layer 2 should be used for the base of houses, trees, etc. Layer 3 is the top of part of those objects. In this case, you would want to stick the character between layer 2 and 3, so he appears in front of the base, and can walk behind objects, which is layer 3. These are only my recommendations, so feel free to use what works best for you.</div> <bR> <div> The only way to get better is practice and learn, practice and learn. The artists at Square didn't become that good in a week, so keep chugging at it, and one day you'll get to that level, and even maybe better.</div> <bR> </td> </tr></table></body>