Guest Access
Administrator
Administrator
![Administrator Administrator](https://2img.net/u/3113/12/83/19/album/g101_p11.gif)
Administrator
profile
It's been some time learning the events and scripts that I've slowly become more satisfied with the programming for most of my projects. For me that's only half the distance of completion, there's still a long ways as to go in finishing an original game. You still have the sounds, music, and all of the graphics. Here's how I get started with making graphics for RPG Maker XP +
A TILE
I'm going to make a 32 x 32 pixel square
![RMXP = Getting Graphical 3210](https://i.servimg.com/u/f76/14/43/85/81/3210.png)
because the tile set (for making maps) uses 32 x 32 tiles.
A SET OF TILES
When making a set of tiles ~> TILESET
They must be 8 tiles across for each row, so in pixels
32 x 8 = 256
That's 256 pixels across then each row.
The first row is left blank for the auto tiles.
I made this as a sample
![RMXP = Getting Graphical Sample10](https://i.servimg.com/u/f76/14/43/85/81/sample10.png)
Now I'm using these as resource templates to make new resources
for my games and script demos +
G@MeF@Ce
![]() | ![]() | |
![]() | ||
![]() | ![]() |
![Administrator Administrator](https://2img.net/u/3113/12/83/19/album/g101_p11.gif)
profile
![](https://2img.net/u/3113/12/83/19/album/quote_13.png)
A TILE
I'm going to make a 32 x 32 pixel square
![RMXP = Getting Graphical 3210](https://i.servimg.com/u/f76/14/43/85/81/3210.png)
because the tile set (for making maps) uses 32 x 32 tiles.
A SET OF TILES
When making a set of tiles ~> TILESET
They must be 8 tiles across for each row, so in pixels
32 x 8 = 256
That's 256 pixels across then each row.
The first row is left blank for the auto tiles.
I made this as a sample
![RMXP = Getting Graphical Sample10](https://i.servimg.com/u/f76/14/43/85/81/sample10.png)
Now I'm using these as resource templates to make new resources
for my games and script demos +
Administrator
Show Signature
Administrator
Administrator
![Administrator Administrator](https://2img.net/u/3113/12/83/19/album/g101_p11.gif)
Administrator
profile
about to make a tile?
try using this as a template for lining things up perfectly
![RMXP = Getting Graphical Tile_t10](https://i.servimg.com/u/f76/14/43/85/81/tile_t10.png)
the red and green bars are 16 pixels across.
16 x 2 = 32
the blue line is a 1 pixel border
just have in mind the center is between two pixels.
so make your icons, tiles, characters even by pixel if you want them dead centered.
*tile examples
man ~ woman
~![RMXP = Getting Graphical Woman10](https://i.servimg.com/u/f76/14/43/85/81/woman10.png)
heart ~ plus ~ $
~
~![RMXP = Getting Graphical Money10](https://i.servimg.com/u/f76/14/43/85/81/money10.png)
question ~ door ~ chest
~
~![RMXP = Getting Graphical Box10](https://i.servimg.com/u/f76/14/43/85/81/box10.png)
individually these 'could' be used as icons,
icons are usually 24x24pixels.
next is to take these tiles and put them together into a tileset...
G@MeF@Ce
![]() | ![]() | |
![]() | ||
![]() | ![]() |
![Administrator Administrator](https://2img.net/u/3113/12/83/19/album/g101_p11.gif)
profile
![](https://2img.net/u/3113/12/83/19/album/quote_13.png)
try using this as a template for lining things up perfectly
![RMXP = Getting Graphical Tile_t10](https://i.servimg.com/u/f76/14/43/85/81/tile_t10.png)
the red and green bars are 16 pixels across.
16 x 2 = 32
the blue line is a 1 pixel border
just have in mind the center is between two pixels.
so make your icons, tiles, characters even by pixel if you want them dead centered.
*tile examples
man ~ woman
![RMXP = Getting Graphical Man10](https://i.servimg.com/u/f76/14/43/85/81/man10.png)
![RMXP = Getting Graphical Woman10](https://i.servimg.com/u/f76/14/43/85/81/woman10.png)
heart ~ plus ~ $
![RMXP = Getting Graphical Heart10](https://i.servimg.com/u/f76/14/43/85/81/heart10.png)
![RMXP = Getting Graphical Plus10](https://i.servimg.com/u/f76/14/43/85/81/plus10.png)
![RMXP = Getting Graphical Money10](https://i.servimg.com/u/f76/14/43/85/81/money10.png)
question ~ door ~ chest
![RMXP = Getting Graphical Questi11](https://i.servimg.com/u/f76/14/43/85/81/questi11.png)
![RMXP = Getting Graphical Door10](https://i.servimg.com/u/f76/14/43/85/81/door10.png)
![RMXP = Getting Graphical Box10](https://i.servimg.com/u/f76/14/43/85/81/box10.png)
individually these 'could' be used as icons,
icons are usually 24x24pixels.
next is to take these tiles and put them together into a tileset...
Administrator
Show Signature
Administrator
Administrator
![Administrator Administrator](https://2img.net/u/3113/12/83/19/album/g101_p11.gif)
Administrator
profile
again tilesets are 8 tiles across (32x32pixel tiles) so I took the tiles that were just made and made a few lines for the floor, walls, and came up with this platform tileset
![RMXP = Getting Graphical Gplat_10](https://i.servimg.com/u/f76/14/43/85/81/gplat_10.png)
I then took the tile of the man and started a character template sheet.
these sheets must be 4 tiles across and only 4 rows facing:
-down
-left
-right
-up
(all rows are facing down for now)
![RMXP = Getting Graphical Roomer10](https://i.servimg.com/u/f76/14/43/85/81/roomer10.png)
example of tileset, and character
![RMXP = Getting Graphical Exampl10](https://i.servimg.com/u/f76/14/43/85/81/exampl10.png)
start plain, make sure things line up, then begin to color and style.
G@MeF@Ce
![]() | ![]() | |
![]() | ||
![]() | ![]() |
![Administrator Administrator](https://2img.net/u/3113/12/83/19/album/g101_p11.gif)
profile
![](https://2img.net/u/3113/12/83/19/album/quote_13.png)
![RMXP = Getting Graphical Gplat_10](https://i.servimg.com/u/f76/14/43/85/81/gplat_10.png)
I then took the tile of the man and started a character template sheet.
these sheets must be 4 tiles across and only 4 rows facing:
-down
-left
-right
-up
(all rows are facing down for now)
![RMXP = Getting Graphical Roomer10](https://i.servimg.com/u/f76/14/43/85/81/roomer10.png)
example of tileset, and character
![RMXP = Getting Graphical Exampl10](https://i.servimg.com/u/f76/14/43/85/81/exampl10.png)
start plain, make sure things line up, then begin to color and style.
Administrator
Show Signature
Poster Mcposty
Poster Mcposty
![Poster Mcposty Poster Mcposty](https://2img.net/u/3113/12/83/19/album/m10.gif)
Poster Mcposty
profile
I like the style that you did this with. The only problem I see is that when you load up the tileset in RPG Maker, the objects are all white and it's really hard to see which tiles are which since the background of the tile-selector thing is gray.
Using just the few that you provided, it can make a nice 2D dungeon-like game.
Also using a flashlight-like event, it creates this:
MotionM
![]() | ![]() | |
![]() | ||
![]() | ![]() |
![Poster Mcposty Poster Mcposty](https://2img.net/u/3113/12/83/19/album/m10.gif)
profile
![](https://2img.net/u/3113/12/83/19/album/quote_13.png)
Using just the few that you provided, it can make a nice 2D dungeon-like game.
Also using a flashlight-like event, it creates this:
![RMXP = Getting Graphical Aaaa10](https://i.servimg.com/u/f75/17/36/75/49/aaaa10.png)
Poster Mcposty
Show Signature
Administrator
Administrator
![Administrator Administrator](https://2img.net/u/3113/12/83/19/album/g101_p11.gif)
Administrator
profile
it's a start +
Characters:
In a character sheet there are 4 rows of 4 frames
the 1st row - facing down [stand1][step1][stand2][step2]
taking the 'man character sheet' I began to color the top left man with some flesh tones, I then made a copy for the next frame and dropped the head a pixel, raised a leg and a arm a pixel and dropped the opposite arm a pixel to create the look of taking a step forward.
I now have two frames that I will use for the 3rd and 4th frame.
I flip the 4th frame horizontally to create a step from the other leg.
here's my results
![RMXP = Getting Graphical Roomer11](https://i.servimg.com/u/f76/14/43/85/81/roomer11.png)
the 4th row - facing up [stand1][step1][stand2][step2]
taking a copy of the top row I make the very bottom row,
using more of the darker shade for the body and lighter shade for the back of the head to create the backside look.
here's my results
![RMXP = Getting Graphical Roomer12](https://i.servimg.com/u/f76/14/43/85/81/roomer12.png)
and last
the 2nd row - facing left [stand1][step1][stand2][step2]
and 3rd row - facing right [stand1][step1][stand2][step2]
![RMXP = Getting Graphical Roomer13](https://i.servimg.com/u/f76/14/43/85/81/roomer13.png)
now you could use this, resize, recolor, edit and make your own character +
G@MeF@Ce
![]() | ![]() | |
![]() | ||
![]() | ![]() |
![Administrator Administrator](https://2img.net/u/3113/12/83/19/album/g101_p11.gif)
profile
![](https://2img.net/u/3113/12/83/19/album/quote_13.png)
thxMotionM wrote:I like the style that you did this with.
![M\'s trade mark](/users/3113/12/83/19/smiles/873240.png)
So far I've done the size of the resources and some samples making certain things line up right, next I'll start with color and design +MotionM wrote:The only problem I see is that when you load up the tileset in RPG Maker, the objects are all white and it's really hard to see which tiles are which since the background of the tile-selector thing is gray.
Characters:
In a character sheet there are 4 rows of 4 frames
the 1st row - facing down [stand1][step1][stand2][step2]
taking the 'man character sheet' I began to color the top left man with some flesh tones, I then made a copy for the next frame and dropped the head a pixel, raised a leg and a arm a pixel and dropped the opposite arm a pixel to create the look of taking a step forward.
I now have two frames that I will use for the 3rd and 4th frame.
I flip the 4th frame horizontally to create a step from the other leg.
here's my results
![RMXP = Getting Graphical Roomer11](https://i.servimg.com/u/f76/14/43/85/81/roomer11.png)
the 4th row - facing up [stand1][step1][stand2][step2]
taking a copy of the top row I make the very bottom row,
using more of the darker shade for the body and lighter shade for the back of the head to create the backside look.
here's my results
![RMXP = Getting Graphical Roomer12](https://i.servimg.com/u/f76/14/43/85/81/roomer12.png)
and last
the 2nd row - facing left [stand1][step1][stand2][step2]
and 3rd row - facing right [stand1][step1][stand2][step2]
![RMXP = Getting Graphical Roomer13](https://i.servimg.com/u/f76/14/43/85/81/roomer13.png)
now you could use this, resize, recolor, edit and make your own character +
Administrator
Show Signature
Administrator
Administrator
![Administrator Administrator](https://2img.net/u/3113/12/83/19/album/g101_p11.gif)
Administrator
profile
character sheets (continued...)
by using the sprite template I made:
![RMXP = Getting Graphical Roomer14](https://i.servimg.com/u/f76/14/43/85/81/roomer14.png)
can't see?
![RMXP = Getting Graphical Large_10](https://i.servimg.com/u/f76/14/43/85/81/large_10.png)
better?
this sprite sheet wasn't much of an edit, it was more like an add on to the template. Everything from the hat, eyes, beard, robe, shoes and belt are separate layers on top of the template +
It may take more time working on a sprite by layers, but I highly recommend that you take the time to do it this way as it will then take much less time for recolors, edits, using different combinations of layers to produce more characters.
some examples:
![RMXP = Getting Graphical Wiz210](https://i.servimg.com/u/f76/14/43/85/81/wiz210.png)
![RMXP = Getting Graphical Elf10](https://i.servimg.com/u/f76/14/43/85/81/elf10.png)
![RMXP = Getting Graphical Monk10](https://i.servimg.com/u/f76/14/43/85/81/monk10.png)
![RMXP = Getting Graphical Santa10](https://i.servimg.com/u/f76/14/43/85/81/santa10.png)
with very little editing, some adjustments to the hue for color change, and saturation, contrast... you could easily create a cast of characters for your game +
![RMXP = Getting Graphical Cast10](https://i.servimg.com/u/f76/14/43/85/81/cast10.png)
and when it comes to making sprites, why wouldn't you want to save yourself some time? after all it's a tedious pixel meticulous process.
G@MeF@Ce
![]() | ![]() | |
![]() | ||
![]() | ![]() |
![Administrator Administrator](https://2img.net/u/3113/12/83/19/album/g101_p11.gif)
profile
![](https://2img.net/u/3113/12/83/19/album/quote_13.png)
by using the sprite template I made:
![RMXP = Getting Graphical Roomer14](https://i.servimg.com/u/f76/14/43/85/81/roomer14.png)
can't see?
![RMXP = Getting Graphical Large_10](https://i.servimg.com/u/f76/14/43/85/81/large_10.png)
better?
this sprite sheet wasn't much of an edit, it was more like an add on to the template. Everything from the hat, eyes, beard, robe, shoes and belt are separate layers on top of the template +
It may take more time working on a sprite by layers, but I highly recommend that you take the time to do it this way as it will then take much less time for recolors, edits, using different combinations of layers to produce more characters.
some examples:
![RMXP = Getting Graphical Wiz210](https://i.servimg.com/u/f76/14/43/85/81/wiz210.png)
![RMXP = Getting Graphical Elf10](https://i.servimg.com/u/f76/14/43/85/81/elf10.png)
![RMXP = Getting Graphical Monk10](https://i.servimg.com/u/f76/14/43/85/81/monk10.png)
![RMXP = Getting Graphical Santa10](https://i.servimg.com/u/f76/14/43/85/81/santa10.png)
with very little editing, some adjustments to the hue for color change, and saturation, contrast... you could easily create a cast of characters for your game +
![RMXP = Getting Graphical Cast10](https://i.servimg.com/u/f76/14/43/85/81/cast10.png)
and when it comes to making sprites, why wouldn't you want to save yourself some time? after all it's a tedious pixel meticulous process.
Administrator
Show Signature
EVENTALIST
EVENTALIST
![EVENTALIST EVENTALIST](https://2img.net/u/3113/12/83/19/album/wiggle12.gif)
EVENTALIST
profile
Also when doing tile sets check into a built in grid function. Photo shop CS3 has one (crtl+').
Helps quite a bit.
mr_wiggles
![]() | ![]() | |
![]() | ||
![]() | ![]() |
![EVENTALIST EVENTALIST](https://2img.net/u/3113/12/83/19/album/wiggle12.gif)
profile
![](https://2img.net/u/3113/12/83/19/album/quote_13.png)
- Spoiler:
Helps quite a bit.
EVENTALIST
Show Signature
EVENTALIST
GAMEFACE101 » MAKERS » RPG MAKERS » RMXP ( ROLE PLAY GAME MAKER XP ) » RMXP = RESOURCES »RMXP = Getting Graphical
Similar topics